From 93ad7b0a548b08b912572bf91272821dceb58877 Mon Sep 17 00:00:00 2001
From: Alfredo <a.chissotti@reply.it>
Date: Thu, 22 Feb 2024 08:29:50 +0000
Subject: [PATCH] setting and reading to/from the same key

---
 background.js | 46 ++++++++++++++++++++++++++++------------------
 content.js    | 14 ++------------
 popup.css     |  4 ++--
 popup.js      | 20 +++++---------------
 4 files changed, 37 insertions(+), 47 deletions(-)

diff --git a/background.js b/background.js
index 0ef69a3..f55d5d6 100644
--- a/background.js
+++ b/background.js
@@ -1,31 +1,41 @@
 const isChrome = navigator.userAgent.includes("Chrome");
+const browserObj = isChrome ? chrome : browser;
 const whyKey = 'sfmWhySF';
 
+function addKey(items, callback){
+    items.key = whyKey; 
+    callback(items);
+}
+
 async function getStorage(callback){
-    console.log({isChrome});
-    if(isChrome)
-        return chrome.storage.sync.get([whyKey], callback);//chrome
-    //firefox
-    const result = await browser.storage.sync.get([whyKey]);
-    callback(await result);
+    browserObj.storage.sync.get([whyKey], items => {
+        addKey(items, callback);
+    });
 }
 
-function setStorage(tabs){
-    // Save it using the Chrome extension storage API.
-    chrome.storage.sync.set({whyKey: tabs}, function() {
+function setStorage(tabs, callback){
+    const set = {};
+    set[whyKey] = tabs;
+    browserObj.storage.sync.set(set, function() {
         //TODO notify user of save
-        console.log("saved");
+        console.log("saved",set);
+        callback(null);
     });
 }
 
 // need to use message in order to work in private windows
-chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
+browserObj.runtime.onMessage.addListener((request, sender, sendResponse) => {
     const message = request.message;
-    if(message.what === "get")
-        return getStorage(sendResponse);
-    if(message.what === "set")
-        return setStorage(message.tabs);
-    if(message.what === "getKey")
-        return sendResponse(whyKey)
-    console.error(`invalid message: ${message}`);
+    if(message == null || message.what == null){
+        console.error(`invalid message: ${message}`);
+        sendResponse(null);
+        return false;
+    }
+    if(message.what === "get"){
+        getStorage(sendResponse);
+    }
+    else if(message.what === "set"){
+        setStorage(message.tabs, sendResponse);
+    }
+    return true;// will call sendResponse asynchronously
 });
diff --git a/content.js b/content.js
index 1f9fd24..dbca7c6 100644
--- a/content.js
+++ b/content.js
@@ -1,6 +1,5 @@
 "use strict";
 
-let whyKey;
 let setupTabUl = document.getElementsByClassName("tabBarItems slds-grid")[0];//This is on Salesforce Setup
 const setupLightning = "/lightning/setup/";
 const setupDefaultPage = "/home";
@@ -17,14 +16,6 @@ function setStorage(tabs){
     sendMessage({"what": "set", tabs}, null);
 }
 
-function setWhyKey(value){
-    whyKey = value;
-}
-
-function getWhyKey(){
-    sendMessage({"what": "getKey"}, setWhyKey);
-}
-
 function generateRowTemplate(row){
     let { tabTitle, url } = row;
     if(url.startsWith("/"))
@@ -50,9 +41,9 @@ function initTabs(){
 }
 
 function init(items){
-    console.log(items, whyKey);
+    console.log(items);
     //call inittabs if we did not find data inside storage
-    const rowObj = (items == null || items[whyKey] == null) ? initTabs() : items[whyKey];
+    const rowObj = (items == null || items[items.key] == null) ? initTabs() : items[items.key];
 
     const rows = [];
     for (const row of rowObj) {
@@ -73,5 +64,4 @@ function delayLoadSetupTabs(count = 0) {
     } else getStorage(init);
 }
 
-getWhyKey();
 delayLoadSetupTabs();
diff --git a/popup.css b/popup.css
index 9bf3910..c4f38c9 100644
--- a/popup.css
+++ b/popup.css
@@ -77,13 +77,13 @@ header {
     & > div:last-child {
         flex: none;
 
-        & > button.save {
+        & > button#save {
             color: #FFFFFF;
             background-color: #0176D3;
             border-color: #0176D3;
         }
 
-        & > button.add {
+        & > button#add {
             color: #0176D3;
             background-color: #FFFFFF;
             border-color: #CBCBCB;
diff --git a/popup.js b/popup.js
index ce2d7c1..6d0500f 100644
--- a/popup.js
+++ b/popup.js
@@ -1,6 +1,5 @@
 "use strict";
 
-let whyKey;
 const tabTemplate = document.getElementById("tr_template");
 const tabAppendElement = document.getElementById("tabs");
 const saveButton = document.getElementById("save");
@@ -18,14 +17,6 @@ function setStorage(tabs){
     sendMessage({"what": "set", tabs}, null);
 }
 
-function setWhyKey(value){
-    whyKey = value;
-}
-
-function getWhyKey(){
-    sendMessage({"what": "getKey"}, setWhyKey);
-}
-
 function deleteTab(){
     this.closest(".tab").remove();
     saveTabs();
@@ -42,11 +33,11 @@ function loadTemplateTab(){
 }
 
 function loadTabs(items){
-    console.log(items, whyKey);
-    if(items == null || items[whyKey] == null)
+    console.log(items);
+    if(items == null || items[items.key] == null)
         return loadTemplateTab();
 
-    const rowObjs = items[whyKey];
+    const rowObjs = items[items.key];
     const elements = [];
     for (const tab of rowObjs){
         console.log(tab);
@@ -62,8 +53,8 @@ function saveTabs(){
     const tabs = [];
     const tabElements = document.getElementsByClassName("tab");
     Array.from(tabElements).forEach(function (tab) {        
-        const tabTitle = tab.querySelector("#tabTitle").value;
-        const url = tab.querySelector("#url").value;
+        const tabTitle = tab.querySelector(".tabTitle").value;
+        const url = tab.querySelector(".url").value;
         if (tabTitle != null && url != null){
             tabs.push({tabTitle, url});
         }
@@ -79,5 +70,4 @@ function addTab(){
 saveButton.addEventListener("click", saveTabs);
 addButton.addEventListener("click", addTab);
 
-getWhyKey();
 getStorage(loadTabs);