saving data works, refreshes the UI, and also added an option to clear the storage from the UI

Shared (Extension)/Resources/background.js

@@ -40,6 +40,12 @@ browser.runtime.onMessage.addListener(async (message, _sender, sendResponse) =>
             let newIndex = await newProfile();
             sendResponse(newIndex);
             break;
+        case 'saveProfile':
+            await saveProfile(message.payload);
+            break;
+        case 'clearData':
+            await browser.storage.local.clear();
+            break;
         default:
             break;
     }
@@ -109,4 +115,11 @@ async function newProfile() {
     profiles.push(newProfile);
     await storage.set({profiles});
     return profiles.length - 1;
+}
+
+async function saveProfile(profile) {
+    let index = await getProfileIndex();
+    let profiles = await get('profiles');
+    profiles[index] = profile;
+    await storage.set({profiles});
 }

Shared (Extension)/Resources/popup.html

@@ -28,8 +28,9 @@
 
     <div class="buttons">
         <button @click="visibleKey = !visibleKey" x-text="visibleKey ? 'Hide' : 'Show'"></button>
-        <button @click="saveKey()">Save</button>
-        <button @click="profileIndex = 1">Profile Index</button>
+        <button @click="await saveProfile()">Save</button>
+        <button @click="confirmClear = true" x-show="!confirmClear">Clear Data</button>
+        <button @click="await clearData()" x-show="confirmClear">Confirm Clear</button>
     </div>
 
     <div x-show="hasValidPubKey">

Shared (Extension)/Resources/popup.js

@@ -9,6 +9,7 @@ Alpine.data('popup', () => ({
     profileNames: ['Default'],
     profileIndex: 0,
     visibleKey: false,
+    confirmClear: false,
 
     async init() {
         console.log("Initializing backend.");
@@ -74,6 +75,19 @@ Alpine.data('popup', () => ({
         this.profileIndex = newIndex;
     },
 
+    async saveProfile() {
+        let {name, privKey, hosts} = this;
+        let profile = {name, privKey, hosts};
+        await browser.runtime.sendMessage({kind: 'saveProfile', payload: profile});
+        await this.refreshProfile();
+    },
+
+    async clearData() {
+        await browser.runtime.sendMessage({kind: 'clearData'});
+        await this.init(); // Re-initialize after clearing
+        this.confirmClear = false;
+    },
+
     // Properties
 
     get hasValidPubKey() {