Added separate class for syncing multiple preference fields with stores

This will make the sync code less boilerplate-y. Instead of manually
subscribing back and forth, this will be done inside the class in
correct order and in any amount.

Types are a bit wonky though.

.github/workflows/build-and-tests.yml

@@ -14,12 +14,12 @@ jobs:
         name: 'Run Unit Tests'
         runs-on: ubuntu-latest
         steps:
-            -   uses: actions/checkout@v4
+            -   uses: actions/checkout@v7
 
             -   name: Setup Node.js
-                uses: actions/setup-node@v4
+                uses: actions/setup-node@v6
                 with:
-                    node-version: '22'
+                    node-version: '25'
 
             -   name: Install npm dependencies
                 run: npm ci

.github/workflows/build-extensions.yml

@@ -14,12 +14,12 @@ jobs:
     
     steps:
     - name: Checkout repository
-      uses: actions/checkout@v4
+      uses: actions/checkout@v7
       
     - name: Setup Node.js
-      uses: actions/setup-node@v4
+      uses: actions/setup-node@v6
       with:
-        node-version: '20'
+        node-version: '25'
         cache: 'npm'
         
     - name: Install dependencies
@@ -39,7 +39,7 @@ jobs:
         zip -r "../${{ matrix.site }}-tagging-assistant-extension.zip" .
         
     - name: Upload extension artifact
-      uses: actions/upload-artifact@v4
+      uses: actions/upload-artifact@v7
       with:
         name: ${{ matrix.site }}-tagging-assistant-extension
         path: ${{ matrix.site }}-tagging-assistant-extension.zip
@@ -51,12 +51,12 @@ jobs:
     
     steps:
     - name: Download all artifacts
-      uses: actions/download-artifact@v4
+      uses: actions/download-artifact@v8
       with:
         path: artifacts
         
     - name: Create combined artifact
-      uses: actions/upload-artifact@v4
+      uses: actions/upload-artifact@v7
       with:
         name: all-extensions
         path: artifacts/

manifest.json

@@ -28,7 +28,8 @@
                 "*://*.furbooru.org/*"
             ],
             "js": [
-                "src/content/deps/amd.ts"
+                "src/content/deps/amd.ts",
+                "src/content/user-details.ts"
             ]
         },
         {

package-lock.json

@@ -28,6 +28,9 @@
                 "typescript": "^6.0.3",
                 "vite": "^7.3.5",
                 "vitest": "^4.1.8"
+            },
+            "engines": {
+                "node": ">=25"
             }
         },
         "node_modules/@asamuzakjp/css-color": {
@@ -833,6 +836,178 @@
                 "@parcel/watcher-win32-x64": "2.5.0"
             }
         },
+        "node_modules/@parcel/watcher-android-arm64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.0.tgz",
+            "integrity": "sha512-qlX4eS28bUcQCdribHkg/herLe+0A9RyYC+mm2PXpncit8z5b3nSqGVzMNR3CmtAOgRutiZ02eIJJgP/b1iEFQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-darwin-arm64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.0.tgz",
+            "integrity": "sha512-hyZ3TANnzGfLpRA2s/4U1kbw2ZI4qGxaRJbBH2DCSREFfubMswheh8TeiC1sGZ3z2jUf3s37P0BBlrD3sjVTUw==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-darwin-x64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.0.tgz",
+            "integrity": "sha512-9rhlwd78saKf18fT869/poydQK8YqlU26TMiNg7AIu7eBp9adqbJZqmdFOsbZ5cnLp5XvRo9wcFmNHgHdWaGYA==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-freebsd-x64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.0.tgz",
+            "integrity": "sha512-syvfhZzyM8kErg3VF0xpV8dixJ+RzbUaaGaeb7uDuz0D3FK97/mZ5AJQ3XNnDsXX7KkFNtyQyFrXZzQIcN49Tw==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "freebsd"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-linux-arm-glibc": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.0.tgz",
+            "integrity": "sha512-0VQY1K35DQET3dVYWpOaPFecqOT9dbuCfzjxoQyif1Wc574t3kOSkKevULddcR9znz1TcklCE7Ht6NIxjvTqLA==",
+            "cpu": [
+                "arm"
+            ],
+            "libc": [
+                "glibc"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-linux-arm-musl": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.0.tgz",
+            "integrity": "sha512-6uHywSIzz8+vi2lAzFeltnYbdHsDm3iIB57d4g5oaB9vKwjb6N6dRIgZMujw4nm5r6v9/BQH0noq6DzHrqr2pA==",
+            "cpu": [
+                "arm"
+            ],
+            "libc": [
+                "musl"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-linux-arm64-glibc": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.0.tgz",
+            "integrity": "sha512-BfNjXwZKxBy4WibDb/LDCriWSKLz+jJRL3cM/DllnHH5QUyoiUNEp3GmL80ZqxeumoADfCCP19+qiYiC8gUBjA==",
+            "cpu": [
+                "arm64"
+            ],
+            "libc": [
+                "glibc"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-linux-arm64-musl": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.0.tgz",
+            "integrity": "sha512-S1qARKOphxfiBEkwLUbHjCY9BWPdWnW9j7f7Hb2jPplu8UZ3nes7zpPOW9bkLbHRvWM0WDTsjdOTUgW0xLBN1Q==",
+            "cpu": [
+                "arm64"
+            ],
+            "libc": [
+                "musl"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
         "node_modules/@parcel/watcher-linux-x64-glibc": {
             "version": "2.5.0",
             "cpu": [
@@ -869,6 +1044,66 @@
                 "url": "https://opencollective.com/parcel"
             }
         },
+        "node_modules/@parcel/watcher-win32-arm64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.0.tgz",
+            "integrity": "sha512-twtft1d+JRNkM5YbmexfcH/N4znDtjgysFaV9zvZmmJezQsKpkfLYJ+JFV3uygugK6AtIM2oADPkB2AdhBrNig==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-win32-ia32": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.0.tgz",
+            "integrity": "sha512-+rgpsNRKwo8A53elqbbHXdOMtY/tAtTzManTWShB5Kk54N8Q9mzNWV7tV+IbGueCbcj826MfWGU3mprWtuf1TA==",
+            "cpu": [
+                "ia32"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@parcel/watcher-win32-x64": {
+            "version": "2.5.0",
+            "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.0.tgz",
+            "integrity": "sha512-lPrxve92zEHdgeff3aiu4gDOIt4u7sJYha6wbdEZDCDUhtjTsOMiaJzG5lMY4GkWH8p0fMmO2Ppq5G5XXG+DQw==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
         "node_modules/@polka/url": {
             "version": "1.0.0-next.28",
             "license": "MIT"
@@ -2279,279 +2514,6 @@
                 "node": ">=6"
             }
         },
-        "node_modules/lightningcss": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
-            "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
-            "license": "MPL-2.0",
-            "optional": true,
-            "peer": true,
-            "dependencies": {
-                "detect-libc": "^2.0.3"
-            },
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            },
-            "optionalDependencies": {
-                "lightningcss-android-arm64": "1.32.0",
-                "lightningcss-darwin-arm64": "1.32.0",
-                "lightningcss-darwin-x64": "1.32.0",
-                "lightningcss-freebsd-x64": "1.32.0",
-                "lightningcss-linux-arm-gnueabihf": "1.32.0",
-                "lightningcss-linux-arm64-gnu": "1.32.0",
-                "lightningcss-linux-arm64-musl": "1.32.0",
-                "lightningcss-linux-x64-gnu": "1.32.0",
-                "lightningcss-linux-x64-musl": "1.32.0",
-                "lightningcss-win32-arm64-msvc": "1.32.0",
-                "lightningcss-win32-x64-msvc": "1.32.0"
-            }
-        },
-        "node_modules/lightningcss-android-arm64": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
-            "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
-            "cpu": [
-                "arm64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "android"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-darwin-arm64": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
-            "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
-            "cpu": [
-                "arm64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-darwin-x64": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
-            "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
-            "cpu": [
-                "x64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "darwin"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-freebsd-x64": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
-            "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
-            "cpu": [
-                "x64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "freebsd"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-linux-arm-gnueabihf": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
-            "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
-            "cpu": [
-                "arm"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-linux-arm64-gnu": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
-            "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
-            "cpu": [
-                "arm64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-linux-arm64-musl": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
-            "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
-            "cpu": [
-                "arm64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-linux-x64-gnu": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
-            "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
-            "cpu": [
-                "x64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-linux-x64-musl": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
-            "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
-            "cpu": [
-                "x64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "linux"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-win32-arm64-msvc": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
-            "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
-            "cpu": [
-                "arm64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss-win32-x64-msvc": {
-            "version": "1.32.0",
-            "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
-            "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
-            "cpu": [
-                "x64"
-            ],
-            "license": "MPL-2.0",
-            "optional": true,
-            "os": [
-                "win32"
-            ],
-            "peer": true,
-            "engines": {
-                "node": ">= 12.0.0"
-            },
-            "funding": {
-                "type": "opencollective",
-                "url": "https://opencollective.com/parcel"
-            }
-        },
-        "node_modules/lightningcss/node_modules/detect-libc": {
-            "version": "2.1.2",
-            "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
-            "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
-            "license": "Apache-2.0",
-            "optional": true,
-            "peer": true,
-            "engines": {
-                "node": ">=8"
-            }
-        },
         "node_modules/locate-character": {
             "version": "3.0.0",
             "license": "MIT"
@@ -3114,20 +3076,6 @@
                 }
             }
         },
-        "node_modules/svelte-check/node_modules/picomatch": {
-            "version": "4.0.2",
-            "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
-            "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
-            "dev": true,
-            "optional": true,
-            "peer": true,
-            "engines": {
-                "node": ">=12"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/jonschlinkert"
-            }
-        },
         "node_modules/symbol-tree": {
             "version": "3.2.4",
             "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",

package.json

@@ -35,5 +35,8 @@
         "typescript": "^6.0.3",
         "vite": "^7.3.5",
         "vitest": "^4.1.8"
+    },
+    "engines": {
+        "node": ">=25"
     }
 }

src/content/user-details.ts

@@ -0,0 +1,14 @@
+import { UserDetails } from "$lib/extension/preferences/UserDetails";
+
+(async () => {
+  const userDetails = new UserDetails();
+  const userDataStore = document.querySelector<HTMLElement>('.js-datastore');
+
+  if (!userDataStore) {
+    return;
+  }
+
+  await userDetails.isAuthorized.set(userDataStore.dataset.userIsSignedIn === 'true');
+})();
+
+

src/lib/extension/EntitiesController.ts

@@ -2,7 +2,15 @@ import StorageHelper, { type StorageChangeSubscriber } from "$lib/browser/Storag
 import type StorageEntity from "$lib/extension/base/StorageEntity";
 
 export default class EntitiesController {
-  static #storageHelper = new StorageHelper(chrome.storage.local);
+  /**
+   * Instance of storage helper used to store/read/subscribe to storage changes.
+   *
+   * Mainly exposed for the testing purposes. When class is loaded outside of extension context, will hold `null`
+   * instead. Any operations of entities will throw an error in this case.
+   */
+  static storage: StorageHelper | null = typeof chrome !== 'undefined'
+    ? new StorageHelper(chrome.storage.local)
+    : null;
 
   /**
    * Read all entities of the given type from the storage. Build the entities from the raw data and return them.
@@ -14,7 +22,11 @@ export default class EntitiesController {
    * @return List of entities of the given type.
    */
   static async readAllEntities<Type extends StorageEntity<any>>(entityName: string, entityClass: new (...any: any[]) => Type): Promise<Type[]> {
-    const rawEntities = await this.#storageHelper.read(entityName, {});
+    if (!this.storage) {
+      throw new Error('Missing storage!');
+    }
+
+    const rawEntities = await this.storage.read(entityName, {});
 
     if (!rawEntities || Object.keys(rawEntities).length === 0) {
       return [];
@@ -32,10 +44,14 @@ export default class EntitiesController {
    * @param entity Entity to update.
    */
   static async updateEntity(entityName: string, entity: StorageEntity<Object>): Promise<void> {
-    this.#storageHelper.write(
+    if (!this.storage) {
+      throw new Error('Missing storage!');
+    }
+
+    this.storage.write(
       entityName,
       Object.assign(
-        await this.#storageHelper.read(
+        await this.storage.read(
           entityName, {}
         ),
         {
@@ -52,9 +68,13 @@ export default class EntitiesController {
    * @param entityId ID of the entity to delete.
    */
   static async deleteEntity(entityName: string, entityId: string): Promise<void> {
-    const entities = await this.#storageHelper.read(entityName, {});
+    if (!this.storage) {
+      throw new Error('Missing storage!');
+    }
+
+    const entities = await this.storage.read(entityName, {});
     delete entities[entityId];
-    this.#storageHelper.write(entityName, entities);
+    this.storage.write(entityName, entities);
   }
 
   /**
@@ -68,6 +88,12 @@ export default class EntitiesController {
    * @return Unsubscribe function.
    */
   static subscribeToEntity<Type extends StorageEntity<any>>(entityName: string, entityClass: new (...any: any[]) => Type, callback: (entities: Type[]) => void): () => void {
+    if (!this.storage) {
+      throw new Error('Missing storage!');
+    }
+
+    const storage = this.storage;
+
     /**
      * Watch the changes made to the storage and call the callback when the entity changes.
      */
@@ -80,8 +106,8 @@ export default class EntitiesController {
         .then(callback);
     }
 
-    this.#storageHelper.subscribe(subscriber);
+    storage.subscribe(subscriber);
 
-    return () => this.#storageHelper.unsubscribe(subscriber);
+    return () => storage.unsubscribe(subscriber);
   }
 }

src/lib/extension/base/CacheablePreferences.ts

@@ -70,6 +70,10 @@ export class PreferenceField<
   set(value: Fields[Key]) {
     return this.#preferences.writeRaw(this.#fieldKey, value);
   }
+
+  get key(): Key {
+    return this.#fieldKey;
+  }
 }
 
 /**

src/lib/extension/preferences/UserDetails.ts

@@ -0,0 +1,16 @@
+import CacheablePreferences, { PreferenceField, type WithFields } from "$lib/extension/base/CacheablePreferences";
+
+export interface UserDetailsFields {
+  isAuthorized: boolean;
+}
+
+export class UserDetails extends CacheablePreferences<UserDetailsFields> implements WithFields<UserDetailsFields> {
+  constructor() {
+    super('userDetails');
+  }
+
+  isAuthorized = new PreferenceField(this, {
+    field: 'isAuthorized',
+    defaultValue: false,
+  });
+}

src/lib/store-sync.ts

@@ -0,0 +1,65 @@
+import type { Writable } from "svelte/store";
+import CacheablePreferences, { type PreferenceField } from "$lib/extension/base/CacheablePreferences";
+
+interface PrerefenceConnectionOptions<ValueType> {
+  /**
+   * Optional callback to apply modifications to the value when sending them from the preference field to the single
+   * storage. If not provided, value itself will be sent instead.
+   */
+  updateToStore?: (value: any) => ValueType;
+}
+
+export class PreferenceSync<PreferencesType extends Record<string, any> = Record<string, any>> {
+  readonly #preferences: CacheablePreferences<PreferencesType>;
+  readonly #syncedPairs: [PreferenceField<PreferencesType, string>, Writable<any>, PrerefenceConnectionOptions<any>][] = [];
+
+  protected constructor(preferences: CacheablePreferences<PreferencesType>) {
+    this.#preferences = preferences;
+  }
+
+  /**
+   * Connect the specific preference field to the provided storage.
+   * @param field Field object.
+   * @param store Storage object. Should contain the appropriate type for the value.
+   * @param [options] Additional settings.
+   */
+  connect<FieldKey extends keyof PreferencesType>(
+    field: PreferenceField<PreferencesType, FieldKey>,
+    store: Writable<PreferencesType[FieldKey]>,
+    options: PrerefenceConnectionOptions<PreferencesType[FieldKey]> = {}
+  ): this {
+    this.#syncedPairs.push([field as any, store, options]);
+
+    return this;
+  }
+
+  async startSync(): Promise<void> {
+    await Promise.allSettled(
+      this.#syncedPairs.map(
+        ([field, store, options]) => field.get()
+          .then(initialValue => store.set(options.updateToStore?.(initialValue) ?? initialValue))
+      )
+    );
+
+    for (const [field, store] of this.#syncedPairs) {
+      store.subscribe(value => field.set(value));
+    }
+
+    this.#preferences.subscribe(updatedSettings => {
+      for (const [field, store, options] of this.#syncedPairs) {
+        if (!(field.key in updatedSettings)) {
+          continue;
+        }
+
+        const updatedValue = updatedSettings[field.key];
+        store.set(options.updateToStore?.(updatedValue) ?? updatedValue);
+      }
+    });
+  }
+
+  static for<
+    PreferencesType extends Record<string, any> = Record<string, any>
+  >(preferences: CacheablePreferences<PreferencesType>): PreferenceSync<PreferencesType> {
+    return new PreferenceSync<PreferencesType>(preferences);
+  }
+}

src/routes/features/profiles/+page.svelte

@@ -5,6 +5,8 @@
   import { activeTaggingProfile, taggingProfiles } from "$stores/entities/tagging-profiles";
   import TaggingProfile from "$entities/TaggingProfile";
   import { popupTitle } from "$stores/popup";
+  import { user } from "$stores/preferences/user";
+  import Notice from "$components/ui/Notice.svelte";
 
   $popupTitle = 'Tagging Profiles';
 
@@ -28,6 +30,18 @@
 <Menu>
   <MenuItem href="/" icon="arrow-left">Back</MenuItem>
   <MenuItem href="/features/profiles/new/edit" icon="plus">Create New</MenuItem>
+</Menu>
+{#if $user?.isAuthorized === false}
+  <Menu>
+    <hr>
+  </Menu>
+  <Notice level="warning">
+    <strong>Tagging profiles will only work when you're signed in!</strong>
+    <br><br>
+    Unauthorized users have to solve the captcha before sending any submissions to the site.
+  </Notice>
+{/if}
+<Menu>
   {#if profiles.length}
     <hr>
   {/if}

src/stores/preferences/misc.ts

@@ -1,18 +1,11 @@
 import { writable } from "svelte/store";
 import MiscPreferences from "$lib/extension/preferences/MiscPreferences";
+import { PreferenceSync } from "$lib/store-sync";
 
 export const fullScreenViewerEnabled = writable(true);
 
 const preferences = new MiscPreferences();
 
-Promise.allSettled([
-  preferences.fullscreenViewer.get().then(v => fullScreenViewerEnabled.set(v))
-]).then(() => {
-  fullScreenViewerEnabled.subscribe(value => {
-    void preferences.fullscreenViewer.set(value);
-  });
-
-  preferences.subscribe(settings => {
-    fullScreenViewerEnabled.set(Boolean(settings.fullscreenViewer));
-  });
-});
+void PreferenceSync.for(preferences)
+  .connect(preferences.fullscreenViewer, fullScreenViewerEnabled, {updateToStore: Boolean})
+  .startSync();

src/stores/preferences/profiles.ts

@@ -1,18 +1,13 @@
 import { writable } from "svelte/store";
 import TaggingProfilesPreferences from "$lib/extension/preferences/TaggingProfilesPreferences";
+import { PreferenceSync } from "$lib/store-sync";
 
 export const stripBlacklistedTagsEnabled = writable(true);
 
 const preferences = new TaggingProfilesPreferences();
 
-Promise
-  .all([
-    preferences.stripBlacklistedTags.get().then(v => stripBlacklistedTagsEnabled.set(v ?? true))
-  ])
-  .then(() => {
-    preferences.subscribe(settings => {
-      stripBlacklistedTagsEnabled.set(typeof settings.stripBlacklistedTags === 'boolean' ? settings.stripBlacklistedTags : true);
-    });
-
-    stripBlacklistedTagsEnabled.subscribe(v => preferences.stripBlacklistedTags.set(v));
-  });
+void PreferenceSync.for(preferences)
+  .connect(preferences.stripBlacklistedTags, stripBlacklistedTagsEnabled, {
+    updateToStore: maybeBoolean => typeof maybeBoolean === 'boolean' ? maybeBoolean : true,
+  })
+  .startSync();

src/stores/preferences/tags.ts

@@ -1,5 +1,6 @@
 import { writable } from "svelte/store";
 import TagsPreferences from "$lib/extension/preferences/TagsPreferences";
+import { PreferenceSync } from "$lib/store-sync";
 
 const preferences = new TagsPreferences();
 
@@ -7,28 +8,8 @@ export const shouldSeparateTagGroups = writable(false);
 export const shouldReplaceLinksOnForumPosts = writable(false);
 export const shouldReplaceTextOfTagLinks = writable(true);
 
-Promise
-  .allSettled([
-    preferences.groupSeparation.get().then(value => shouldSeparateTagGroups.set(value)),
-    preferences.replaceLinks.get().then(value => shouldReplaceLinksOnForumPosts.set(value)),
-    preferences.replaceLinkText.get().then(value => shouldReplaceTextOfTagLinks.set(value)),
-  ])
-  .then(() => {
-    shouldSeparateTagGroups.subscribe(value => {
-      void preferences.groupSeparation.set(value);
-    });
-
-    shouldReplaceLinksOnForumPosts.subscribe(value => {
-      void preferences.replaceLinks.set(value);
-    });
-
-    shouldReplaceTextOfTagLinks.subscribe(value => {
-      void preferences.replaceLinkText.set(value);
-    });
-
-    preferences.subscribe(settings => {
-      shouldSeparateTagGroups.set(Boolean(settings.groupSeparation));
-      shouldReplaceLinksOnForumPosts.set(Boolean(settings.replaceLinks));
-      shouldReplaceTextOfTagLinks.set(Boolean(settings.replaceLinkText));
-    });
-  });
+void PreferenceSync.for(preferences)
+  .connect(preferences.groupSeparation, shouldSeparateTagGroups, {updateToStore: Boolean})
+  .connect(preferences.replaceLinks, shouldReplaceLinksOnForumPosts, {updateToStore: Boolean})
+  .connect(preferences.replaceLinkText, shouldReplaceTextOfTagLinks, {updateToStore: Boolean})
+  .startSync();

src/stores/preferences/user.ts

@@ -0,0 +1,18 @@
+import { UserDetails, type UserDetailsFields } from "$lib/extension/preferences/UserDetails";
+import { readable } from "svelte/store";
+
+const userDetails = new UserDetails();
+
+export const user = readable<UserDetailsFields | null>(null, set => {
+  userDetails.subscribe(settings => {
+    set({
+      isAuthorized: Boolean(settings.isAuthorized)
+    });
+  });
+
+  userDetails.isAuthorized.get().then(isAuthorized => {
+    set({
+      isAuthorized
+    });
+  });
+});

tests/lib/extension/EntitiesController.spec.ts

@@ -0,0 +1,261 @@
+import EntitiesController from "$lib/extension/EntitiesController";
+import ChromeStorageArea from "$tests/mocks/ChromeStorageArea";
+import StorageHelper from "$lib/browser/StorageHelper";
+import { TestedEntity, type TestedSettings } from "$tests/stubs/Entity";
+import { randomString } from "$tests/utils";
+import { randomInt } from "crypto";
+
+describe('EntitiesController', () => {
+  let mockedStorage: ChromeStorageArea;
+
+  beforeEach(() => {
+    mockedStorage = new ChromeStorageArea();
+    EntitiesController.storage = new StorageHelper(mockedStorage);
+  });
+
+  it('should throw when storage is not present', async () => {
+    EntitiesController.storage = null;
+
+    const readPromise = EntitiesController.readAllEntities(
+      TestedEntity._entityName,
+      TestedEntity,
+    );
+
+    const deletePromise = EntitiesController.deleteEntity(
+      TestedEntity._entityName,
+      randomString(),
+    );
+
+    const updatePromise = EntitiesController.updateEntity(
+      TestedEntity._entityName,
+      new TestedEntity(randomString(), {
+        numberField: randomInt(1000),
+        stringField: randomString(),
+      }),
+    );
+
+    const subscribe = () => {
+      EntitiesController.subscribeToEntity(TestedEntity._entityName, TestedEntity, vi.fn());
+    }
+
+    await expect(readPromise).rejects.toThrow(Error);
+    await expect(deletePromise).rejects.toThrow(Error);
+    await expect(updatePromise).rejects.toThrow(Error);
+
+    expect(subscribe).toThrow(Error);
+  });
+
+  describe('readAllEntities', () => {
+    it('should return empty array when nothing in the storage yet', async () => {
+      const entities = await EntitiesController.readAllEntities(TestedEntity._entityName, TestedEntity);
+      expect(entities).toHaveLength(0);
+    });
+
+    it('should properly capture different entities from storage', async () => {
+      const storageWithEntities: Record<string, Record<string, Partial<TestedSettings>>> = {
+        [TestedEntity._entityName]: {
+          [randomString()]: {
+            stringField: randomString(),
+            numberField: randomInt(-100_000, 100_000),
+          },
+          [randomString()]: {
+            stringField: randomString(),
+            numberField: randomInt(-100_000, 100_000),
+          },
+        }
+      };
+
+      mockedStorage.insertMockedData(storageWithEntities);
+
+      const loadedEntities = await EntitiesController.readAllEntities(TestedEntity._entityName, TestedEntity);
+
+      expect(loadedEntities).toHaveLength(2);
+
+      for (const entity of loadedEntities) {
+        const rawStorageEntry = storageWithEntities[TestedEntity._entityName][entity.id];
+
+        expect(entity.settings.stringField).toBe(rawStorageEntry.stringField);
+        expect(entity.settings.numberField).toBe(rawStorageEntry.numberField);
+      }
+    });
+  });
+
+  describe('updateEntity', () => {
+    it('should create a storage structure if it is not created yet', async () => {
+      expect(mockedStorage.mockedData).toEqual({});
+
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(100_000),
+      });
+
+      await EntitiesController.updateEntity(TestedEntity._entityName, entity);
+
+      expect(mockedStorage.mockedData).toEqual({
+        [TestedEntity._entityName]: {
+          [entity.id]: {
+            stringField: entity.settings.stringField,
+            numberField: entity.settings.numberField,
+          },
+        },
+      });
+    });
+
+    it('should update entity inside the existing', async () => {
+      const id = randomString();
+      const initialStringValue = randomString();
+      const updatedStringValue = randomString();
+
+      mockedStorage.insertMockedData({
+        [TestedEntity._entityName]: {
+          [id]: {
+            stringField: initialStringValue,
+            numberField: randomInt(100_000),
+          } as TestedSettings,
+        }
+      });
+
+      const [entity] = await EntitiesController.readAllEntities(TestedEntity._entityName, TestedEntity);
+      expect(entity.settings.stringField).toBe(initialStringValue);
+
+      entity.settings.stringField = updatedStringValue;
+      await EntitiesController.updateEntity(TestedEntity._entityName, entity);
+
+      const entityInsideStorage = mockedStorage.mockedData[TestedEntity._entityName][id];
+      expect(entityInsideStorage.stringField).toBe(updatedStringValue);
+    });
+  });
+
+  describe('deleteEntity', () => {
+    it('should initialize the storage structure if delete called', async () => {
+      expect(mockedStorage.mockedData).toEqual({});
+
+      await EntitiesController.deleteEntity(TestedEntity._entityName, randomString());
+
+      expect(mockedStorage.mockedData).toEqual({
+        [TestedEntity._entityName]: {},
+      });
+    });
+
+    it('should delete entity and keep the storage object empty', async () => {
+      const id = randomString();
+      const settings: TestedSettings = {
+        numberField: randomInt(100_000),
+        stringField: randomString(),
+      };
+
+      mockedStorage.insertMockedData({
+        [TestedEntity._entityName]: {
+          [id]: settings,
+        }
+      });
+
+      // Doesn't touch existing instance if ID is not found in the storage
+      await EntitiesController.deleteEntity(TestedEntity._entityName, randomString());
+
+      expect(mockedStorage.mockedData).toEqual({
+        [TestedEntity._entityName]: {
+          [id]: settings,
+        }
+      });
+
+      await EntitiesController.deleteEntity(TestedEntity._entityName, id);
+
+      expect(mockedStorage.mockedData).toEqual({
+        [TestedEntity._entityName]: {}
+      });
+    });
+  });
+
+  describe('subscribeToEntity', () => {
+    it('should notify about changes and return new entities', async () => {
+      let receivedEntities: TestedEntity[] | null = null;
+
+      const subscriber = vi.fn((entities: TestedEntity[]) => {
+        receivedEntities = entities;
+      });
+
+      void EntitiesController.subscribeToEntity(TestedEntity._entityName, TestedEntity, subscriber);
+
+      expect(subscriber).not.toHaveBeenCalled();
+
+      const createdEntity = new TestedEntity(randomString(), {
+        numberField: randomInt(100),
+        stringField: randomString(),
+      });
+
+      await EntitiesController.updateEntity(TestedEntity._entityName, createdEntity);
+
+      await vi.waitFor(() => {
+        expect(subscriber).toHaveBeenCalled();
+      }, {interval: 1, timeout: 10});
+
+      const [firstReceivedEntity] = receivedEntities || [];
+
+      expect(firstReceivedEntity).toBeInstanceOf(TestedEntity);
+      expect(firstReceivedEntity).not.toBe(createdEntity);
+      expect(firstReceivedEntity).toEqual(createdEntity);
+    });
+
+    it('should stop receiving updates once unsubscribed', async () => {
+      const firstSubscriber = vi.fn();
+      const unsubscribeFirst = EntitiesController.subscribeToEntity(TestedEntity._entityName, TestedEntity, firstSubscriber);
+
+      const entity = new TestedEntity(randomString(), {
+        numberField: randomInt(100_000),
+        stringField: randomString(),
+      });
+
+      await EntitiesController.updateEntity(TestedEntity._entityName, entity);
+
+      await vi.waitFor(() => {
+        expect(firstSubscriber).toHaveBeenCalledOnce();
+      }, {interval: 1, timeout: 10});
+
+      firstSubscriber.mockReset();
+      unsubscribeFirst();
+
+      const secondSubscriber = vi.fn();
+      void EntitiesController.subscribeToEntity(TestedEntity._entityName, TestedEntity, secondSubscriber);
+
+      entity.settings.stringField = randomString();
+
+      await EntitiesController.updateEntity(TestedEntity._entityName, entity);
+
+      await vi.waitFor(() => {
+        expect(secondSubscriber).toHaveBeenCalledOnce();
+      }, {interval: 1, timeout: 10});
+
+      expect(firstSubscriber).not.toHaveBeenCalled();
+    });
+
+    it('should not notify when something else was changed in the storage', async () => {
+      const rawStorageSubscriber = vi.fn();
+      const entitiesSubscriber = vi.fn();
+
+      void EntitiesController.storage?.subscribe(rawStorageSubscriber);
+      void EntitiesController.subscribeToEntity(TestedEntity._entityName, TestedEntity, entitiesSubscriber);
+
+      EntitiesController.storage?.write('otherStorage', {
+        someField: randomString(),
+      });
+
+      await EntitiesController.updateEntity(
+        TestedEntity._entityName,
+        new TestedEntity(randomString(), {
+          stringField: randomString(),
+          numberField: randomInt(100_000),
+        }),
+      );
+
+      EntitiesController.storage?.write('otherStorage', {
+        someField: randomString(),
+      });
+
+      await vi.waitFor(() => {
+        expect(entitiesSubscriber).toHaveBeenCalledOnce();
+        expect(rawStorageSubscriber).toHaveBeenCalledTimes(3);
+      }, {timeout: 10, interval: 1});
+    })
+  });
+});

tests/lib/extension/base/CachablePreferences.spec.ts

@@ -1,50 +1,6 @@
-import CacheablePreferences, { PreferenceField, type WithFields } from "$lib/extension/base/CacheablePreferences";
-import ConfigurationController from "$lib/extension/ConfigurationController";
-import ChromeStorageArea from "$tests/mocks/ChromeStorageArea";
-import StorageHelper from "$lib/browser/StorageHelper";
 import { randomString } from "$tests/utils";
 import { randomInt } from "crypto";
-
-interface TestedFields {
-  numberField: number;
-  stringField: string;
-}
-
-class TestedPreferences extends CacheablePreferences<TestedFields> implements WithFields<TestedFields> {
-  readonly defaults: TestedFields;
-  readonly mockedSettingsNamespace: string;
-  readonly mockedStorageArea: ChromeStorageArea;
-  readonly mockedStorageHelper: StorageHelper;
-
-  numberField;
-  stringField;
-
-  constructor(settingsNamespace: string, mockedDefaults: TestedFields) {
-    const mockedStorageArea = new ChromeStorageArea();
-    const mockedStorageHelper = new StorageHelper(mockedStorageArea);
-    const mockedConfigurationController = new ConfigurationController(
-      settingsNamespace,
-      mockedStorageHelper,
-    );
-
-    super(settingsNamespace, mockedConfigurationController);
-
-    this.mockedSettingsNamespace = settingsNamespace;
-    this.mockedStorageArea = mockedStorageArea;
-    this.mockedStorageHelper = mockedStorageHelper;
-    this.defaults = mockedDefaults;
-
-    this.numberField = new PreferenceField(this, {
-      field: 'numberField',
-      defaultValue: this.defaults.numberField,
-    });
-
-    this.stringField = new PreferenceField(this, {
-      field: 'stringField',
-      defaultValue: this.defaults.stringField,
-    });
-  }
-}
+import { TestedPreferences } from "$tests/stubs/Preferences";
 
 describe('CachablePreferences', () => {
   let preferences: TestedPreferences;

tests/lib/extension/base/StorageEntity.spec.ts

@@ -0,0 +1,239 @@
+import ChromeStorageArea from "$tests/mocks/ChromeStorageArea";
+import StorageHelper from "$lib/browser/StorageHelper";
+import { randomString } from "$tests/utils";
+import { randomInt } from "crypto";
+import EntitiesController from "$lib/extension/EntitiesController";
+import { TestedEntity } from "$tests/stubs/Entity";
+
+describe("StorageEntity", () => {
+  let mockedStorageArea: ChromeStorageArea;
+
+  beforeEach(() => {
+    mockedStorageArea = new ChromeStorageArea();
+    EntitiesController.storage = new StorageHelper(mockedStorageArea);
+  });
+
+  describe("readAll", () => {
+    it("should return empty array if no entities stored", async () => {
+      const entities = await TestedEntity.readAll();
+
+      expect(entities).toHaveLength(0);
+    });
+
+    it("should read all entities from storage", async () => {
+      const entity1 = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      const entity2 = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity1.save();
+      await entity2.save();
+
+      const entities = await TestedEntity.readAll();
+
+      expect(entities).toHaveLength(2);
+      expect(entities[0].id).toBe(entity1.id);
+      expect(entities[0].settings).toEqual(entity1.settings);
+      expect(entities[1].id).toBe(entity2.id);
+      expect(entities[1].settings).toEqual(entity2.settings);
+    });
+
+    it("should build entities with correct class", async () => {
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+
+      const [savedEntity] = await TestedEntity.readAll();
+
+      expect(savedEntity).toBeInstanceOf(TestedEntity);
+    });
+  });
+
+  describe("save", () => {
+    it("should save entity to storage", async () => {
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+
+      expect(mockedStorageArea.mockedData).toEqual({
+        [TestedEntity._entityName]: {
+          [entity.id]: entity.settings,
+        },
+      });
+    });
+
+    it("should overwrite existing entity with same ID", async () => {
+      const id = randomString();
+      const originalSettings = {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      };
+
+      const entity1 = new TestedEntity(id, originalSettings);
+      await entity1.save();
+
+      const updatedSettings = {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      };
+
+      const entity2 = new TestedEntity(id, updatedSettings);
+      await entity2.save();
+
+      expect(mockedStorageArea.mockedData).toEqual({
+        [TestedEntity._entityName]: {
+          [id]: updatedSettings,
+        },
+      });
+    });
+  });
+
+  describe("delete", () => {
+    it("should delete entity from storage", async () => {
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+      expect(mockedStorageArea.mockedData[TestedEntity._entityName]).not.toEqual({});
+
+      await entity.delete();
+      expect(mockedStorageArea.mockedData[TestedEntity._entityName]).toEqual({});
+    });
+
+    it("should not fail if entity does not exist", async () => {
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await expect(entity.delete()).resolves.not.toThrow();
+    });
+  });
+
+  describe("subscribe", () => {
+    it("should notify about new entities", async () => {
+      const subscriber = vi.fn();
+      void TestedEntity.subscribe(subscriber);
+
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+
+      // Saving is not notified about immediately.
+      await vi.waitFor(() => {
+        expect(subscriber).toHaveBeenCalledOnce();
+        expect(subscriber).toHaveBeenCalledWith([entity]);
+      }, {timeout: 10, interval: 1});
+    });
+
+    it("should notify about entity updates", async () => {
+      const subscriber = vi.fn();
+      void TestedEntity.subscribe(subscriber);
+
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+
+      await vi.waitFor(() => {
+        expect(subscriber).toHaveBeenCalledOnce();
+      }, {interval: 1, timeout: 10});
+
+      subscriber.mockReset();
+
+      entity.settings.stringField = randomString();
+      await entity.save();
+
+      await vi.waitFor(() => {
+        expect(subscriber).toHaveBeenCalledOnce();
+        expect(subscriber).toHaveBeenCalledWith([entity]);
+      }, {interval: 1, timeout: 10});
+    });
+
+    it("should notify about entity deletion", async () => {
+      const subscriber = vi.fn();
+      void TestedEntity.subscribe(subscriber);
+
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+      await entity.delete();
+
+      await vi.waitFor(() => {
+        expect(subscriber).toHaveBeenCalledTimes(2);
+      }, {interval: 1, timeout: 10});
+
+      expect(subscriber).toHaveBeenCalledWith([entity]);
+      expect(subscriber).toHaveBeenCalledWith([]);
+    });
+
+    it("should stop notifications after unsubscribe", async () => {
+      const subscriber = vi.fn();
+      const unsubscribe = TestedEntity.subscribe(subscriber);
+
+      unsubscribe();
+
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      await entity.save();
+
+      expect(subscriber).not.toHaveBeenCalled();
+    });
+  });
+
+  describe("properties", () => {
+    it("should expose id", () => {
+      const id = randomString();
+      const entity = new TestedEntity(id, {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      expect(entity.id).toBe(id);
+    });
+
+    it("should expose settings", () => {
+      const settings = {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      };
+
+      const entity = new TestedEntity(randomString(), settings);
+
+      expect(entity.settings).toEqual(settings);
+    });
+
+    it("should expose type from _entityName", () => {
+      const entity = new TestedEntity(randomString(), {
+        stringField: randomString(),
+        numberField: randomInt(-100000, 100000),
+      });
+
+      expect(entity.type).toBe(TestedEntity._entityName);
+    });
+  });
+});

tests/lib/philomena/tag-utils.spec.ts

@@ -1,76 +1,141 @@
 import { URL } from 'url';
-import { resolveTagNameFromLink, slugEncodedCharacters } from '$lib/philomena/tag-utils';
+import {
+  buildTagsAndAliasesMap,
+  resolveTagCategoryFromTagName,
+  resolveTagNameFromLink,
+  slugEncodedCharacters
+} from '$lib/philomena/tag-utils';
+import { randomString } from "$tests/utils";
+import { namespaceCategories } from "$config/tags";
 
-describe('tag-utils', () => {
-  const origin = 'https://furbooru.org';
+const origin = 'https://furbooru.org';
 
-  describe('resolveTagNameFromLink', () => {
-    function resolveFromSearchQuery(encodedQuery: string): string | null {
-      return resolveTagNameFromLink(new URL(`/search?q=${encodedQuery}`, origin));
-    }
+describe('buildTagsAndAliasesMap', () => {
+  it('should return regular tags if both real and real+alias tags are the same', () => {
+    const tagsAndAliases = ['avali', 'experiment (casualties unknown)', 'fictional species'];
 
-    describe('Parsing from /search/?q=tag links', () => {
-      it('should resolve a single tag from /search URLs', () => {
-        expect(resolveFromSearchQuery('safe')).toBe('safe');
-      });
-
-      it('should return null for queries with multiple comma-separated tags', () => {
-        // Comma acts as a separator in the query, resulting in multiple tokens
-        expect(resolveFromSearchQuery('safe, suggestive')).toBe(null);
-      });
-
-      it('should return null if query is empty or not a term', () => {
-        expect(resolveFromSearchQuery('')).toBe(null);
-        expect(resolveFromSearchQuery('!')).toBe(null);
-      });
-
-      it('should properly treat parentheses in the query with single tag', () => {
-        // Parentheses are operators in the query language, but when inside the tag name, they should still be properly
-        // working.
-        expect(resolveFromSearchQuery('experiment (casualties unknown)')).toBe('experiment (casualties unknown)');
-      });
-
-      it('should properly resolve queries with encoded characters', () => {
-        expect(resolveFromSearchQuery('pok%C3%A9mon')).toBe('pokémon');
-      });
-
-      it('should unquote quoted term', () => {
-        expect(resolveFromSearchQuery('"experiment (casualties unknown)"')).toBe('experiment (casualties unknown)')
-        expect(resolveFromSearchQuery('"single tag, really"')).toBe('single tag, really');
-      });
-    })
-
-    describe('Parsing from /tags/name links', () => {
-      function resolveFromTagLink(encodedTagName: string): string | null {
-        return resolveTagNameFromLink(new URL(`/tags/${encodedTagName}`, origin));
+    expect(buildTagsAndAliasesMap(tagsAndAliases, tagsAndAliases)).toMatchInlineSnapshot(`
+      Map {
+        "avali" => "avali",
+        "experiment (casualties unknown)" => "experiment (casualties unknown)",
+        "fictional species" => "fictional species",
       }
+    `);
+  });
 
-      it('should resolve a single tag', () => {
-        expect(resolveFromTagLink('safe')).toBe('safe');
-      });
+  it('should identify any aliases going after the real tag', () => {
+    const realTags = ['avali', 'experiment (casualties unknown)', 'fictional species'];
+    const realAndAliasesTags = ['avali', 'experiment (casualties unknown)', 'experiment (gunsaw)', 'fictional species'];
 
-      it('should only read the tag page even if query is provided', () => {
-        expect(resolveFromTagLink('grotesque?q=explicit')).toBe('grotesque');
-      });
+    expect(buildTagsAndAliasesMap(realAndAliasesTags, realTags)).toMatchInlineSnapshot(`
+      Map {
+        "avali" => "avali",
+        "experiment (casualties unknown)" => "experiment (casualties unknown)",
+        "fictional species" => "fictional species",
+        "experiment (gunsaw)" => "experiment (casualties unknown)",
+      }
+    `);
+  });
 
-      it('should properly resolve links with encoded characters', () => {
-        expect(resolveFromTagLink('pok%C3%A9mon')).toBe('pokémon');
-      });
+  it('should ignore any non-real tags coming before first tag is found', () => {
+    const outOfOrderTag = randomString();
 
-      it('should decoded slug-encoded characters', () => {
-        // More common example where tag is.
-        expect(resolveFromTagLink(`namespace-colon-tag+name`)).toBe('namespace:tag name');
+    const realTags = ['avali', 'experiment (casualties unknown)', 'fictional species'];
+    const realAndAliasesTags = [outOfOrderTag, 'avali', 'experiment (casualties unknown)', 'experiment (gunsaw)', 'fictional species'];
 
-        // Testing the whole list of encoded characters.
-        for (const [encodedCharacter, decodedCharacter] of slugEncodedCharacters.entries()) {
-          expect(resolveFromTagLink(`test+symbol${encodedCharacter}without+spaces`)).toBe(`test symbol${decodedCharacter}without spaces`);
-          expect(resolveFromTagLink(`test+symbol+${encodedCharacter}+with+spaces`)).toBe(`test symbol ${decodedCharacter} with spaces`);
-        }
-      });
-    });
+    const warn = vi.spyOn(console, 'warn');
 
-    it('should return null for unsupported URLs', () => {
-      expect(resolveTagNameFromLink(new URL('/pages/example', origin))).toBe(null);
-    });
+    expect(buildTagsAndAliasesMap(realAndAliasesTags, realTags)).toMatchInlineSnapshot(`
+      Map {
+        "avali" => "avali",
+        "experiment (casualties unknown)" => "experiment (casualties unknown)",
+        "fictional species" => "fictional species",
+        "experiment (gunsaw)" => "experiment (casualties unknown)",
+      }
+    `);
+
+    expect(warn).toHaveBeenCalledWith(`No real tag found for the alias:`, outOfOrderTag);
+  });
+});
+
+describe('resolveTagNameFromLink', () => {
+  function resolveFromSearchQuery(encodedQuery: string): string | null {
+    return resolveTagNameFromLink(new URL(`/search?q=${encodedQuery}`, origin));
+  }
+
+  describe('Parsing from /search/?q=tag links', () => {
+    it('should resolve a single tag from /search URLs', () => {
+      expect(resolveFromSearchQuery('safe')).toBe('safe');
+    });
+
+    it('should return null for queries with multiple comma-separated tags', () => {
+      // Comma acts as a separator in the query, resulting in multiple tokens
+      expect(resolveFromSearchQuery('safe, suggestive')).toBe(null);
+    });
+
+    it('should return null if query is empty or not a term', () => {
+      expect(resolveFromSearchQuery('')).toBe(null);
+      expect(resolveFromSearchQuery('!')).toBe(null);
+    });
+
+    it('should properly treat parentheses in the query with single tag', () => {
+      // Parentheses are operators in the query language, but when inside the tag name, they should still be properly
+      // working.
+      expect(resolveFromSearchQuery('experiment (casualties unknown)')).toBe('experiment (casualties unknown)');
+    });
+
+    it('should properly resolve queries with encoded characters', () => {
+      expect(resolveFromSearchQuery('pok%C3%A9mon')).toBe('pokémon');
+    });
+
+    it('should unquote quoted term', () => {
+      expect(resolveFromSearchQuery('"experiment (casualties unknown)"')).toBe('experiment (casualties unknown)')
+      expect(resolveFromSearchQuery('"single tag, really"')).toBe('single tag, really');
+    });
+  })
+
+  describe('Parsing from /tags/name links', () => {
+    function resolveFromTagLink(encodedTagName: string): string | null {
+      return resolveTagNameFromLink(new URL(`/tags/${encodedTagName}`, origin));
+    }
+
+    it('should resolve a single tag', () => {
+      expect(resolveFromTagLink('safe')).toBe('safe');
+    });
+
+    it('should only read the tag page even if query is provided', () => {
+      expect(resolveFromTagLink('grotesque?q=explicit')).toBe('grotesque');
+    });
+
+    it('should properly resolve links with encoded characters', () => {
+      expect(resolveFromTagLink('pok%C3%A9mon')).toBe('pokémon');
+    });
+
+    it('should decoded slug-encoded characters', () => {
+      // More common example where tag is.
+      expect(resolveFromTagLink(`namespace-colon-tag+name`)).toBe('namespace:tag name');
+
+      // Testing the whole list of encoded characters.
+      for (const [encodedCharacter, decodedCharacter] of slugEncodedCharacters.entries()) {
+        expect(resolveFromTagLink(`test+symbol${encodedCharacter}without+spaces`)).toBe(`test symbol${decodedCharacter}without spaces`);
+        expect(resolveFromTagLink(`test+symbol+${encodedCharacter}+with+spaces`)).toBe(`test symbol ${decodedCharacter} with spaces`);
+      }
+    });
+  });
+
+  it('should return null for unsupported URLs', () => {
+    expect(resolveTagNameFromLink(new URL('/pages/example', origin))).toBe(null);
+  });
+});
+
+describe('resolveTagCategoryFromTagName', () => {
+  it('should resolve any known namespace into its known category', () => {
+    for (const [namespace, category] of namespaceCategories) {
+      expect(resolveTagCategoryFromTagName(`${namespace}:${randomString()}`)).toBe(category);
+    }
+  });
+
+  it('should ignore any namespace not listed in config', () => {
+    expect(resolveTagCategoryFromTagName(`${randomString()}:${randomString()}`)).toBeNull();
   });
 });

tests/stubs/Entity.ts

@@ -0,0 +1,17 @@
+import StorageEntity from "$lib/extension/base/StorageEntity";
+
+export interface TestedSettings {
+  stringField: string;
+  numberField: number;
+  nested?: {
+    field: boolean;
+  };
+}
+
+export class TestedEntity extends StorageEntity<TestedSettings> {
+  static readonly _entityName = "entity";
+
+  constructor(id: string, settings: TestedSettings) {
+    super(id, settings);
+  }
+}

tests/stubs/Preferences.ts

@@ -0,0 +1,45 @@
+import CacheablePreferences, { PreferenceField, type WithFields } from "$lib/extension/base/CacheablePreferences";
+import ChromeStorageArea from "$tests/mocks/ChromeStorageArea";
+import StorageHelper from "$lib/browser/StorageHelper";
+import ConfigurationController from "$lib/extension/ConfigurationController";
+
+export interface TestedFields {
+  numberField: number;
+  stringField: string;
+}
+
+export class TestedPreferences extends CacheablePreferences<TestedFields> implements WithFields<TestedFields> {
+  readonly defaults: TestedFields;
+  readonly mockedSettingsNamespace: string;
+  readonly mockedStorageArea: ChromeStorageArea;
+  readonly mockedStorageHelper: StorageHelper;
+
+  numberField;
+  stringField;
+
+  constructor(settingsNamespace: string, mockedDefaults: TestedFields) {
+    const mockedStorageArea = new ChromeStorageArea();
+    const mockedStorageHelper = new StorageHelper(mockedStorageArea);
+    const mockedConfigurationController = new ConfigurationController(
+      settingsNamespace,
+      mockedStorageHelper,
+    );
+
+    super(settingsNamespace, mockedConfigurationController);
+
+    this.mockedSettingsNamespace = settingsNamespace;
+    this.mockedStorageArea = mockedStorageArea;
+    this.mockedStorageHelper = mockedStorageHelper;
+    this.defaults = mockedDefaults;
+
+    this.numberField = new PreferenceField(this, {
+      field: 'numberField',
+      defaultValue: this.defaults.numberField,
+    });
+
+    this.stringField = new PreferenceField(this, {
+      field: 'stringField',
+      defaultValue: this.defaults.stringField,
+    });
+  }
+}