refactor: migrate extension to TypeScript and add Material-UI components

hero_vault_extension/src/utils/chromeApi.ts

@@ -0,0 +1,103 @@
+/**
+ * Chrome API utilities for Hero Vault Extension
+ * 
+ * This module provides Chrome API detection and mocks for development mode
+ */
+
+// Check if we're running in a Chrome extension environment
+export const isExtensionEnvironment = (): boolean => {
+  return typeof chrome !== 'undefined' && !!chrome.runtime && !!chrome.runtime.id;
+};
+
+// Mock storage for development mode
+const mockStorage: Record<string, any> = {
+  // Initialize with some default values for script storage
+  pendingScripts: [],
+  scriptResults: []
+};
+
+// Mock Chrome API for development mode
+export const getChromeApi = () => {
+  // If we're in a Chrome extension environment, return the real Chrome API
+  if (isExtensionEnvironment()) {
+    return chrome;
+  }
+
+  // Otherwise, return a mock implementation
+  return {
+    runtime: {
+      sendMessage: (message: any): Promise<any> => {
+        console.log('Mock sendMessage called with:', message);
+        
+        // Mock responses based on message type
+        if (message.type === 'SESSION_STATUS') {
+          return Promise.resolve({ active: false });
+        }
+        
+        if (message.type === 'CREATE_KEYSPACE') {
+          mockStorage['currentKeyspace'] = message.keyspace;
+          return Promise.resolve({ success: true });
+        }
+        
+        if (message.type === 'UNLOCK_SESSION') {
+          mockStorage['currentKeyspace'] = message.keyspace;
+          return Promise.resolve({ success: true });
+        }
+        
+        if (message.type === 'LOCK_SESSION') {
+          delete mockStorage['currentKeyspace'];
+          return Promise.resolve({ success: true });
+        }
+        
+        return Promise.resolve({ success: false });
+      },
+      getURL: (path: string): string => {
+        return path;
+      }
+    },
+    storage: {
+      local: {
+        get: (keys: string | string[] | object): Promise<Record<string, any>> => {
+          console.log('Mock storage.local.get called with:', keys);
+          
+          if (typeof keys === 'string') {
+            // Handle specific script storage keys
+            if (keys === 'pendingScripts' && !mockStorage[keys]) {
+              mockStorage[keys] = [];
+            }
+            if (keys === 'scriptResults' && !mockStorage[keys]) {
+              mockStorage[keys] = [];
+            }
+            return Promise.resolve({ [keys]: mockStorage[keys] });
+          }
+          
+          if (Array.isArray(keys)) {
+            const result: Record<string, any> = {};
+            keys.forEach(key => {
+              // Handle specific script storage keys
+              if (key === 'pendingScripts' && !mockStorage[key]) {
+                mockStorage[key] = [];
+              }
+              if (key === 'scriptResults' && !mockStorage[key]) {
+                mockStorage[key] = [];
+              }
+              result[key] = mockStorage[key];
+            });
+            return Promise.resolve(result);
+          }
+          
+          return Promise.resolve(mockStorage);
+        },
+        set: (items: Record<string, any>): Promise<void> => {
+          console.log('Mock storage.local.set called with:', items);
+          
+          Object.keys(items).forEach(key => {
+            mockStorage[key] = items[key];
+          });
+          
+          return Promise.resolve();
+        }
+      }
+    }
+  } as typeof chrome;
+};