84 caching websites on client side

extension/src/hashpass/app/hashpass_signup/page.tsx

@@ -94,7 +94,7 @@ const handleSubmit = async (e: React.FormEvent) => {
       throw new Error(data.error || 'Sign-up failed');
     }
 
-    router.push('/login'); // Redirect to login page after successful signup
+    router.push(`/signup_success?uuid=${uuid}`);
   } catch (err) {
     if (err instanceof Error) {
       setError(err.message);

extension/src/hashpass/app/signup_success/page.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+export default function SignUpSuccessPage() {
+    return (
+        <main className="flex flex-col items-center justify-center h-screen">
+        <h1 className="text-2xl font-bold">Sign Up Successful</h1>
+        <p className="mt-4 text-lg">Your account has been created successfully!</p>
+        <p className="mt-2 text-lg">You can now use HashPass to manage your passwords securely.</p>
+        </main>
+    );
+}

extension/src/hashpass/app/site_login_popup/site_login_component.tsx

@@ -1,5 +1,5 @@
 "use client";
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { decrypt } from "../security_components/tools/AES_tool";
 import { calculatePassword } from '../security_components/components/password_generator';
 import { parse } from "tldts";
@@ -33,7 +33,7 @@ export async function getEncryptedUuid(uuid: string): Promise<string> {
 }
 
 export default function Site_LogIn() {
-    const userId = "randomuuid"; // This value will be the user's id in plaintext (retrieved from cache)
+    // This value will be the user's id in plaintext (retrieved from cache)
     //const userIdEncrypted = "8gb2BSJbvxtRs53WGHs6jBoVBztcA03gIFv8t8Bm/CLt6fGKkEY="; // This value will be the user's id in ciphertext (retrieved from DB)
 
 
@@ -44,9 +44,28 @@ export default function Site_LogIn() {
     const [showPassword, setShowPassword] = useState(false); // State to toggle password visibility
     const [blockSuccessMessage, setBlockSuccessMessage] = useState<string>('');
 
+    const [userId, setUserId] = useState("");
+
+    useEffect(() => {
+        async function fetchUUID(): Promise<string>{
+            return new Promise((resolve) => {
+                chrome.storage.sync.get(["uuid"], (result) => {
+                    const userId = result.uuid || "";
+                    resolve(userId);
+                });
+            });
+        }
+
+        // Set the UUID from storage
+        fetchUUID().then((fetchedUuid) => {
+            setUserId(fetchedUuid);
+        });
+    }, []);
+
     const handlePassEntry = async () => {
         setLoading(true);
         setSpinnerMessage('Generating Password...');
+        console.log("UUID: ", userId);
 
         try {
             const userIdEncrypted = await getEncryptedUuid(userId);
@@ -172,7 +191,7 @@ export default function Site_LogIn() {
                           Enter your passphrase:
                       </label>
                       <input
-                          type="text"
+                          type="password"
                           value={keyString}
                           onChange={(e) => setKeyString(e.target.value)}
                           placeholder="Simple Passphrase"

extension/src/hashpass/app/site_signup_popup/site_signup_component.tsx

@@ -1,13 +1,12 @@
 'use client';
-import React, { useState } from 'react';
-import { decrypt } from "../security_components/tools/AES_tool";
-import { calculatePassword } from '../security_components/components/password_generator';
+import React from "react";
+import { useEffect, useState } from "react";
+import { decrypt } from "../security_components/tools/AES_tool"
+import {calculatePassword} from '../security_components/components/password_generator';
 import { parse } from "tldts";
 import { getEncryptedUuid } from '../site_login_popup/site_login_component';
 
 export default function Site_SignUp() {
-    const UUID = "randomuuid";
-
     const [keyString, setKeyString] = useState("");
     const [loading, setLoading] = useState(false);
     const [generatedPassword, setGeneratedPassword] = useState(""); // Store generated password
@@ -16,9 +15,28 @@ export default function Site_SignUp() {
     const [blockSuccessMessage, setBlockSuccessMessage] = useState<string>('');
 
 
+    const [UUID, setUUID] = useState("");
+
+    useEffect(() => {
+        async function fetchUUID(): Promise<string>{
+            return new Promise((resolve) => {
+                chrome.storage.sync.get(["uuid"], (result) => {
+                    const UUID = result.uuid || "";
+                    resolve(UUID);
+                });
+            });
+        }
+
+        // Set the UUID from storage
+        fetchUUID().then((fetchedUuid) => {
+            setUUID(fetchedUuid);
+        });
+    }, []); // Empty dependency array means this runs once when the component mounts
+
     const handlePassEntry = async () => {
         setLoading(true);
         setSpinnerMessage('Generating Password...');
+        console.log("UUID: ", UUID);
 
         try {
             const userIdEncrypted = await getEncryptedUuid(UUID);
@@ -176,7 +194,7 @@ export default function Site_SignUp() {
                 Enter your passphrase:
               </label>
               <input
-                type="text"
+                type="password"
                 value={keyString}
                 onChange={(e) => setKeyString(e.target.value)}
                 placeholder="Simple Passphrase"

extension/src/hashpass/public/content.js

@@ -1,3 +1,30 @@
+(function() {
+    const urlParams = new URLSearchParams(window.location.search);
+    console.log('URL Params:', urlParams.toString());
+    const uuid = urlParams.get('uuid');
+
+    if (uuid) {
+        chrome.storage.sync.set({ uuid }, () => {
+            console.log('UUID saved:', uuid);
+        });
+    }
+
+    const observer = new MutationObserver(() => {
+        const urlParams = new URLSearchParams(window.location.search);
+        console.log('URL Params:', urlParams.toString());
+        const uuid = urlParams.get('uuid');
+
+        if (uuid) {
+            chrome.storage.sync.set({ uuid }, () => {
+                console.log('UUID saved:', uuid);
+            });
+        }
+    });
+
+    // Check for changes in the URL (in case of single-page application changes)
+    observer.observe(document, { childList: true, subtree: true });
+})();
+
 // Function to inject a login popup into the page using the bundled TSX component
 function injectLoginPopup() {
   console.log("Injecting Login Popup...");

extension/src/hashpass/public/dist/components.bundle.js

@@ -19297,7 +19297,7 @@ var Components = (() => {
     renderSiteLogIn: () => renderSiteLogIn,
     renderSiteSignUp: () => renderSiteSignUp
   });
-  var import_react4 = __toESM(require_react(), 1);
+  var import_react5 = __toESM(require_react(), 1);
   var import_client = __toESM(require_client(), 1);
 
   // app/site_login_popup/site_login_component.tsx
@@ -19861,16 +19861,30 @@ var Components = (() => {
     }
   }
   function Site_LogIn() {
-    const userId = "randomuuid";
     const [keyString, setKeyString] = (0, import_react2.useState)("");
     const [loading, setLoading] = (0, import_react2.useState)(false);
     const [spinnerMessage, setSpinnerMessage] = (0, import_react2.useState)("");
     const [generatedPassword, setGeneratedPassword] = (0, import_react2.useState)("");
     const [showPassword, setShowPassword] = (0, import_react2.useState)(false);
     const [blockSuccessMessage, setBlockSuccessMessage] = (0, import_react2.useState)("");
+    const [userId, setUserId] = (0, import_react2.useState)("");
+    (0, import_react2.useEffect)(() => {
+      async function fetchUUID() {
+        return new Promise((resolve) => {
+          chrome.storage.sync.get(["uuid"], (result) => {
+            const userId2 = result.uuid || "";
+            resolve(userId2);
+          });
+        });
+      }
+      fetchUUID().then((fetchedUuid) => {
+        setUserId(fetchedUuid);
+      });
+    }, []);
     const handlePassEntry = async () => {
       setLoading(true);
       setSpinnerMessage("Generating Password...");
+      console.log("UUID: ", userId);
       try {
         const userIdEncrypted = await getEncryptedUuid(userId);
         console.log("User ID encrypted: ", userIdEncrypted);
@@ -19962,7 +19976,7 @@ var Components = (() => {
     )) : /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("div", { className: "mb-5" }, /* @__PURE__ */ import_react2.default.createElement("label", { className: "block text-sm font-medium text-gray-600 mb-2" }, "Enter your passphrase:"), /* @__PURE__ */ import_react2.default.createElement(
       "input",
       {
-        type: "text",
+        type: "password",
         value: keyString,
         onChange: (e) => setKeyString(e.target.value),
         placeholder: "Simple Passphrase",
@@ -19988,17 +20002,32 @@ var Components = (() => {
 
   // app/site_signup_popup/site_signup_component.tsx
   var import_react3 = __toESM(require_react(), 1);
+  var import_react4 = __toESM(require_react(), 1);
   function Site_SignUp() {
-    const UUID = "randomuuid";
-    const [keyString, setKeyString] = (0, import_react3.useState)("");
-    const [loading, setLoading] = (0, import_react3.useState)(false);
-    const [generatedPassword, setGeneratedPassword] = (0, import_react3.useState)("");
-    const [showPassword, setShowPassword] = (0, import_react3.useState)(false);
-    const [spinnerMessage, setSpinnerMessage] = (0, import_react3.useState)("");
-    const [blockSuccessMessage, setBlockSuccessMessage] = (0, import_react3.useState)("");
+    const [keyString, setKeyString] = (0, import_react4.useState)("");
+    const [loading, setLoading] = (0, import_react4.useState)(false);
+    const [generatedPassword, setGeneratedPassword] = (0, import_react4.useState)("");
+    const [showPassword, setShowPassword] = (0, import_react4.useState)(false);
+    const [spinnerMessage, setSpinnerMessage] = (0, import_react4.useState)("");
+    const [blockSuccessMessage, setBlockSuccessMessage] = (0, import_react4.useState)("");
+    const [UUID, setUUID] = (0, import_react4.useState)("");
+    (0, import_react4.useEffect)(() => {
+      async function fetchUUID() {
+        return new Promise((resolve) => {
+          chrome.storage.sync.get(["uuid"], (result) => {
+            const UUID2 = result.uuid || "";
+            resolve(UUID2);
+          });
+        });
+      }
+      fetchUUID().then((fetchedUuid) => {
+        setUUID(fetchedUuid);
+      });
+    }, []);
     const handlePassEntry = async () => {
       setLoading(true);
       setSpinnerMessage("Generating Password...");
+      console.log("UUID: ", UUID);
       try {
         const userIdEncrypted = await getEncryptedUuid(UUID);
         const decryptedText = await decrypt(userIdEncrypted, keyString);
@@ -20112,7 +20141,7 @@ var Components = (() => {
     )) : /* @__PURE__ */ import_react3.default.createElement("div", null, /* @__PURE__ */ import_react3.default.createElement("div", { className: "mb-5" }, /* @__PURE__ */ import_react3.default.createElement("label", { className: "block text-sm font-medium text-gray-600 mb-2" }, "Enter your passphrase:"), /* @__PURE__ */ import_react3.default.createElement(
       "input",
       {
-        type: "text",
+        type: "password",
         value: keyString,
         onChange: (e) => setKeyString(e.target.value),
         placeholder: "Simple Passphrase",
@@ -20169,7 +20198,7 @@ var Components = (() => {
     };
     const root = (0, import_client.createRoot)(container);
     root.render(
-      /* @__PURE__ */ import_react4.default.createElement("div", { style: popupWrapperStyle }, /* @__PURE__ */ import_react4.default.createElement("button", { style: closeButtonStyle, onClick: handleClose }, "\xD7"), /* @__PURE__ */ import_react4.default.createElement(Site_LogIn, null))
+      /* @__PURE__ */ import_react5.default.createElement("div", { style: popupWrapperStyle }, /* @__PURE__ */ import_react5.default.createElement("button", { style: closeButtonStyle, onClick: handleClose }, "\xD7"), /* @__PURE__ */ import_react5.default.createElement(Site_LogIn, null))
     );
   }
   function renderSiteSignUp(container) {
@@ -20178,7 +20207,7 @@ var Components = (() => {
     };
     const root = (0, import_client.createRoot)(container);
     root.render(
-      /* @__PURE__ */ import_react4.default.createElement("div", { style: popupWrapperStyle }, /* @__PURE__ */ import_react4.default.createElement("button", { style: closeButtonStyle, onClick: handleClose }, "\xD7"), /* @__PURE__ */ import_react4.default.createElement(Site_SignUp, null))
+      /* @__PURE__ */ import_react5.default.createElement("div", { style: popupWrapperStyle }, /* @__PURE__ */ import_react5.default.createElement("button", { style: closeButtonStyle, onClick: handleClose }, "\xD7"), /* @__PURE__ */ import_react5.default.createElement(Site_SignUp, null))
     );
   }
   return __toCommonJS(popup_components_exports);

extension/src/hashpass/public/service-worker.js

@@ -1,4 +1,4 @@
-chrome.runtime.onMessage.addListener((message, sender) => {
+chrome.runtime.onMessage.addListener(async (message, sender) => {
   if (message.action === "fillPassword") {
     console.log("Received message:", message);
     chrome.tabs.query({ active: true, currentWindow: true }, ([tab]) => {
@@ -30,13 +30,51 @@ chrome.runtime.onMessage.addListener((message, sender) => {
   // Check that sender.tab exists so we can target the correct tab
   if (!sender.tab || !sender.tab.id) return;
 
+  const uuid = await getUUID();
+
+  let blockedDomains = [];
+  try {
+    const response = await fetch("https://8fy84busdk.execute-api.us-east-1.amazonaws.com/API/getBlockedDomains", {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify({ uuid: uuid })
+    });
+    if (!response.ok) {
+        throw new Error("Failed to get domains");
+    }
+    blockedDomains = await response.json();
+  } catch (error) {
+    console.error(`Error fetching blocked domains for ${uuid}:`, error);
+  }
+
+  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
+  if (!tab?.url) return "";
+  const url = new URL(tab.url);
+  let domain = url.hostname.replace(/^(?:.*\.)?([^.]+\.[^.]+)$/, "$1");
+  console.log("Domain:", domain);
+
+  if (domain && blockedDomains.includes(domain)) {
+    console.log("Domain is blocked:", domain);
+    return;
+  }
+
   if (message.action === "detected_login_form") {
     chrome.tabs.sendMessage(sender.tab.id, { action: "injectLoginPopup" });
   } else if (message.action === "detected_signup_form") {
     chrome.tabs.sendMessage(sender.tab.id, { action: "injectSignupPopup" });
   }
 }); 
 
+function getUUID() {
+    return new Promise((resolve) => {
+      chrome.storage.sync.get(["uuid"], (result) => {
+        resolve(result.uuid);
+      });
+    });
+}
+
 function injectPassword(passphrase) {
   const attempt = () => {
     const input = document.querySelector('input[type="password"]');