refactor: Replace console logging with logger utility

- Add logger import across multiple view components
- Replace console.error/warn/log with logger methods
- Update error handling to use structured logging
- Improve type safety for error objects
- Add crypto-browserify polyfill for browser environment

The changes improve logging by:
1. Using consistent logging interface
2. Adding structured error logging
3. Improving error type safety
4. Centralizing logging configuration
5. Fixing browser compatibility issues

Affected files:
- Multiple view components
- vite.config.ts
- Build configuration

src/views/AccountViewView.vue

@@ -976,6 +976,7 @@ import {
   retrieveAccountMetadata,
 } from "../libs/util";
 import { UserProfile } from "@/libs/partnerServer";
+import { logger } from "../utils/logger";
 
 const inputImportFileNameRef = ref<Blob>();
 
@@ -1109,12 +1110,12 @@ export default class AccountViewView extends Vue {
       }
     } catch (error) {
       // this can happen when running automated tests in dev mode because notifications don't work
-      console.error(
+      logger.error(
         "Telling user to clear cache at page create because:",
         error,
       );
       // this sometimes gives different information on the error
-      console.error(
+      logger.error(
         "To repeat with concatenated error: telling user to clear cache at page create because: " +
           error,
       );
@@ -1521,7 +1522,7 @@ export default class AccountViewView extends Vue {
    * @param {Error} error - The error object.
    */
   private handleExportError(error: unknown) {
-    console.error("Export Error:", error);
+    logger.error("Export Error:", error);
     this.$notify(
       {
         group: "alert",
@@ -1591,7 +1592,7 @@ export default class AccountViewView extends Vue {
           query: { contacts: JSON.stringify(contactRows) },
         });
       } catch (error) {
-        console.error("Error checking contact imports:", error);
+        logger.error("Error checking contact imports:", error);
         this.$notify(
           {
             group: "alert",
@@ -1607,7 +1608,7 @@ export default class AccountViewView extends Vue {
   }
 
   private progressCallback(progress: ImportProgress) {
-    console.log(
+    logger.log(
       `Import progress: ${progress.completedRows} of ${progress.totalRows} rows completed.`,
     );
     if (progress.done) {
@@ -1659,7 +1660,7 @@ export default class AccountViewView extends Vue {
             await updateAccountSettings(did, { isRegistered: true });
             this.isRegistered = true;
           } catch (err) {
-            console.error("Got an error updating settings:", err);
+            logger.error("Got an error updating settings:", err);
             this.$notify(
               {
                 group: "alert",
@@ -1698,7 +1699,7 @@ export default class AccountViewView extends Vue {
     if (error instanceof AxiosError) {
       if (error.status == 400 || error.status == 404) {
         // no worries: they probably just aren't registered and don't have any limits
-        console.log(
+        logger.log(
           "Got 400 or 404 response retrieving limits which probably means they're not registered:",
           error,
         );
@@ -1707,11 +1708,11 @@ export default class AccountViewView extends Vue {
         const data = error.response?.data as ErrorResponse;
         this.limitsMessage =
           (data?.error?.message as string) || "Bad server response.";
-        console.error("Got bad response retrieving limits:", error);
+        logger.error("Got bad response retrieving limits:", error);
       }
     } else {
       this.limitsMessage = "Got an error retrieving limits.";
-      console.error("Got some error retrieving limits:", error);
+      logger.error("Got some error retrieving limits:", error);
     }
   }
 
@@ -1788,7 +1789,7 @@ export default class AccountViewView extends Vue {
         window.location.hostname === "localhost" &&
         !DEFAULT_IMAGE_API_SERVER.includes("localhost")
       ) {
-        console.log(
+        logger.log(
           "Using shared image API server, so only users on that server can play with images.",
         );
       }
@@ -1802,7 +1803,7 @@ export default class AccountViewView extends Vue {
         // don't bother with a notification
         // (either they'll simply continue or they're canceling and going back)
       } else {
-        console.error("Non-success deleting image:", response);
+        logger.error("Non-success deleting image:", response);
         this.$notify(
           {
             group: "alert",
@@ -1822,10 +1823,10 @@ export default class AccountViewView extends Vue {
 
       this.profileImageUrl = undefined;
     } catch (error) {
-      console.error("Error deleting image:", error);
+      logger.error("Error deleting image:", error);
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       if ((error as any).response.status === 404) {
-        console.error("The image was already deleted:", error);
+        logger.error("The image was already deleted:", error);
 
         await updateAccountSettings(this.activeDid, {
           profileImageUrl: undefined,