Add Password Management Extension

* Create manifest.json

* Create content.js

* Create popup.html

* Create popup.js

* Create background.js

* Delete src/browser-extension directory

* Create manifest.json

* Create content.js

* Create popup.html

* Create popup.js

* Create background.js

* Update server.js

backend/server.js

@@ -10,7 +10,6 @@ dotenv.config();
 const ENCRYPTION_KEY = Buffer.from(process.env.ENCRYPTION_KEY, 'utf-8'); 
 const IV_LENGTH = 16; // For AES, this is always 16
 
-
 // Encrypt a password
 const encrypt = (text) => {
   const iv = crypto.randomBytes(IV_LENGTH);
@@ -32,8 +31,6 @@ function decrypt(text) {
   return decrypted;
 }
 
-
-
 // Connecting to the MongoDB Client
 const url = process.env.MONGO_URI;
 const client = new MongoClient(url);
@@ -55,17 +52,17 @@ const port = process.env.PORT || 3000; // Use port from environment variables or
 
 // Middleware
 app.use(bodyParser.json());
-app.use(cors());
+app.use(cors({ origin: 'chrome-extension://your-extension-id' })); // Replace with your actual extension ID
 
 // Get all the passwords
 app.get("/", async (req, res) => {
   try {
     const db = client.db(dbName);
     const collection = db.collection("passwords");
     const passwords = await collection.find({}).toArray();
-    const decryptedPassword= passwords.map((item)=>{
+    const decryptedPassword = passwords.map((item) => {
       const [iv, encryptedData] = item.password.split(':');
-      return {...item,password:decrypt({iv,encryptedData})};
+      return { ...item, password: decrypt({ iv, encryptedData }) };
     });
     res.status(200).json(decryptedPassword);
   } catch (error) {
@@ -74,6 +71,27 @@ app.get("/", async (req, res) => {
   }
 });
 
+// Get a password by id
+app.get("/:id", async (req, res) => {
+  try {
+    const { id } = req.params;
+    const db = client.db(dbName);
+    const collection = db.collection("passwords");
+    const item = await collection.findOne({ _id: new ObjectId(id) });
+
+    if (!item) {
+      return res.status(404).json({ success: false, message: "Password not found" });
+    }
+
+    const [iv, encryptedData] = item.password.split(':');
+    const decryptedPassword = decrypt({ iv, encryptedData });
+    res.status(200).json({ ...item, password: decryptedPassword });
+  } catch (error) {
+    console.error("Error fetching password:", error);
+    res.status(500).json({ success: false, message: "Internal Server Error" });
+  }
+});
+
 // Save a password
 app.post("/", async (req, res) => {
   try {
@@ -89,7 +107,7 @@ app.post("/", async (req, res) => {
     const collection = db.collection("passwords");
     // Encrypt the password before saving
     const encryptedPassword = encrypt(password);
-    const result = await collection.insertOne({ site, username, password:encryptedPassword});
+    const result = await collection.insertOne({ site, username, password: encryptedPassword });
     res.status(201).json({ success: true, result });
   } catch (error) {
     console.error("Error saving password:", error);
@@ -118,7 +136,7 @@ app.put("/:id", async (req, res) => {
 
     const result = await collection.updateOne(
       { _id: new ObjectId(id) },
-      { $set: { site, username, password:encryptedPassword } } // Use the encrypted password here
+      { $set: { site, username, password: encryptedPassword } } // Use the encrypted password here
     );
 
     if (result.matchedCount === 0) {
@@ -138,7 +156,6 @@ app.put("/:id", async (req, res) => {
   }
 });
 
-
 // Delete a password by id
 app.delete("/:id", async (req, res) => {
   try {

src/browser-extension/background.js

@@ -0,0 +1,3 @@
+chrome.runtime.onInstalled.addListener(() => {
+  console.log("PassOP Autofill Extension installed.");
+});

src/browser-extension/content.js

@@ -0,0 +1,12 @@
+chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  if (request.action === "autofill") {
+    const usernameField = document.querySelector("input[type='email'], input[type='text']");
+    const passwordField = document.querySelector("input[type='password']");
+
+    if (usernameField && passwordField) {
+      usernameField.value = request.username;
+      passwordField.value = request.password;
+      sendResponse({ status: "filled" });
+    }
+  }
+});

src/browser-extension/manifest.json

@@ -0,0 +1,18 @@
+{
+  "manifest_version": 3,
+  "name": "PassOP AutoFill",
+  "version": "1.0",
+  "permissions": ["storage", "activeTab", "scripting"],
+  "action": {
+    "default_popup": "popup.html"
+  },
+  "background": {
+    "service_worker": "background.js"
+  },
+  "content_scripts": [
+    {
+      "matches": ["<all_urls>"],
+      "js": ["content.js"]
+    }
+  ]
+}

src/browser-extension/popup.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+  <head><title>PassOP Autofill</title></head>
+  <body>
+    <input id="site" placeholder="Website URL" />
+    <button id="fetch">Fetch Credentials</button>
+
+    <script src="popup.js"></script>
+  </body>
+</html>

src/browser-extension/popup.js

@@ -0,0 +1,16 @@
+document.getElementById("fetch").addEventListener("click", () => {
+  const site = document.getElementById("site").value;
+
+  // Fetch credentials from backend (e.g., your API)
+  fetch(`https://your-backend-url/api/credentials?site=${site}`)
+    .then(response => response.json())
+    .then(data => {
+      chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
+        chrome.tabs.sendMessage(tabs[0].id, {
+          action: "autofill",
+          username: data.username,
+          password: data.password
+        });
+      });
+    });
+});