fix: options/popup loading/saving

CHANGELOG.md

@@ -1,5 +1,11 @@
 # CHANGELOG
 
+## v0.2.1
+
+### Fixes
+
+- Options & popup behavior
+
 ## v0.2.0
 
 ### Features

manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "FP Max",
   "description": "Enhance your Floatplane experience",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "manifest_version": 3,
   "permissions": ["storage"],
   "action": {

src/content_script.ts

@@ -7,6 +7,11 @@ export default function main() {
     ['saveInterval', 'lastPlayed', 'useTimestamps', 'returnToLastTime'],
     ({ useTimestamps, returnToLastTime }: Settings) => {
       // mutation observer to detect when the video is loaded
+      console.debug(
+        '🚀 | file: content_script.ts:36 | main | useTimestamps, returnToLastTime:',
+        useTimestamps,
+        returnToLastTime,
+      )
       const observer = new MutationObserver((mutations) => {
         mutations.forEach((mutation) => {
           if (returnToLastTime) {

src/options.tsx

@@ -11,10 +11,12 @@ function OptionsApp() {
       {
         returnToLastTime: false,
         saveInterval: 5,
+        useTimestamps: true,
       },
       (items) => {
         setReturnToLastTime(items.returnToLastTime)
         setSaveInterval(items.saveInterval)
+        setUseTimestamps(items.useTimestamps)
       },
     )
   }, [])
@@ -25,6 +27,9 @@ function OptionsApp() {
   useEffect(() => {
     chrome.storage.sync.set({ saveInterval })
   }, [saveInterval])
+  useEffect(() => {
+    chrome.storage.sync.set({ useTimestamps })
+  }, [useTimestamps])
 
   return (
     <>

src/popup.tsx

@@ -10,11 +10,13 @@ function PopupApp() {
     chrome.storage.sync.get(
       {
         returnToLastTime: false,
-        saveInterval: 5,
+        saveInterval: 5000,
+        useTimestamps: true,
       },
       (items) => {
         setReturnToLastTime(items.returnToLastTime)
         setSaveInterval(items.saveInterval)
+        setUseTimestamps(items.useTimestamps)
       },
     )
   }, [])
@@ -25,10 +27,13 @@ function PopupApp() {
   useEffect(() => {
     chrome.storage.sync.set({ saveInterval })
   }, [saveInterval])
+  useEffect(() => {
+    chrome.storage.sync.set({ useTimestamps })
+  }, [useTimestamps])
 
   return (
     <>
-      <div>
+      <div style={{ width: 200 }}>
         <label>
           <input
             type="checkbox"