[ { "path": ".eslintignore", "content": "node_modules/\ndist/\npublic/\n*.min.js\npackage-lock.json " }, { "path": ".eslintrc.cjs", "content": "module.exports = {\n env: {\n browser: true,\n es2021: true,\n webextensions: true,\n node: true,\n },\n extends: ['plugin:vue/recommended', 'airbnb-base', 'plugin:jsdoc/recommended', 'plugin:vuejs-accessibility/recommended'],\n parserOptions: {\n ecmaVersion: 'latest',\n sourceType: 'module',\n },\n plugins: ['vue', 'import', 'jsdoc', 'vuejs-accessibility'],\n rules: {\n 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',\n 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',\n 'max-len': 'off',\n 'vue/no-v-model-argument': 'off',\n 'no-plusplus': 'off',\n 'no-continue': 'off',\n 'class-methods-use-this': 'off',\n 'no-unused-expressions': 'off',\n 'object-curly-newline': 'off',\n 'no-new': 'off',\n 'no-bitwise': 'off',\n 'no-restricted-syntax': [\n 'error',\n 'ForInStatement',\n 'LabeledStatement',\n 'WithStatement',\n ],\n 'no-use-before-define': ['error', { functions: false }],\n 'no-param-reassign': ['error', { props: false }],\n 'import/no-unresolved': ['error', { ignore: ['^~icons/', '^floating-vue', '^floating-vue/dist/style', '^floating-vue/style', '\\\\.css$', '\\\\.scss$', '\\\\.sass$'] }],\n 'import/extensions': ['error', { ignore: ['^~icons/', '^floating-vue', '^floating-vue/dist/style', '^floating-vue/style', '\\\\.css$', '\\\\.scss$', '\\\\.sass$'] }],\n // JSDoc rules\n 'jsdoc/require-jsdoc': 'off',\n 'jsdoc/require-param-description': 'off',\n 'jsdoc/require-returns-description': 'off',\n 'jsdoc/require-param': 'off',\n 'jsdoc/require-returns': 'off',\n 'no-await-in-loop': 'off',\n // Accessibility rules\n 'vuejs-accessibility/alt-text': 'error',\n 'vuejs-accessibility/anchor-has-content': 'error',\n 'vuejs-accessibility/aria-props': 'error',\n 'vuejs-accessibility/aria-unsupported-elements': 'error',\n 'vuejs-accessibility/click-events-have-key-events': 'error',\n 'vuejs-accessibility/heading-has-content': 'error',\n 'vuejs-accessibility/iframe-has-title': 'error',\n 'vuejs-accessibility/interactive-supports-focus': 'error',\n 'vuejs-accessibility/label-has-for': 'error',\n 'vuejs-accessibility/media-has-caption': 'warn',\n 'vuejs-accessibility/mouse-events-have-key-events': 'error',\n 'vuejs-accessibility/no-access-key': 'error',\n 'vuejs-accessibility/no-autofocus': 'error',\n 'vuejs-accessibility/no-distracting-elements': 'error',\n 'vuejs-accessibility/no-redundant-roles': 'error',\n 'vuejs-accessibility/role-has-required-aria-props': 'error',\n 'vuejs-accessibility/tabindex-no-positive': 'error',\n 'vuejs-accessibility/no-static-element-interactions': 'error',\n 'vuejs-accessibility/form-control-has-label': 'error',\n },\n settings: {\n 'import/resolver': {\n alias: {\n map: [['@', './src']],\n extensions: ['.ts', '.js', '.jsx', '.tsx', '.json'],\n },\n },\n 'import/ignore': [\n ],\n },\n ignorePatterns: ['vite.config.js', 'vite.config.firefox.js', 'src/ext/browser/app.js'],\n};\n" }, { "path": ".gitignore", "content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\npnpm-debug.log*\nlerna-debug.log*\n\nnode_modules\n.DS_Store\ndist\ndist-ssr\ncoverage\n*.local\n\n/cypress/videos/\n/cypress/screenshots/\n\n# Editor directories and files\n.vscode/*\n!.vscode/extensions.json\n.idea\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n*.sw?\n" }, { "path": "LICENSE", "content": "MIT License\n\nCopyright (c) 2025 Magalyas Dmitry\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n" }, { "path": "README.md", "content": "# FavBox\n\n

\n\"issues\"\n\"ver\"\n\"license\"\n\"love\"\n

\n\n

\n \"FavBox\n \"FavBox\n

\n\n

\n\n\n\n

\n\n\nFavBox is a local-first **experimental** browser extension that enhances and simplifies bookmark management without cloud storage or third-party services. It extends your browser's native bookmarking features.\n\nKey features:\n\nπŸ”„ Syncs with your browser profile \\\nπŸ”’ No third‑party data sharing. No ads. No tracking. \\\n🎨 Minimalist, clean UI\\\n🏷️ Tag support for easy organization\\\nπŸ” Advanced search, sorting, and filtering by tags, domains, folders, and keywords\\\n🌁 Multiple display modes\\\nπŸŒ— Light and dark themes\\\nπŸ—‘οΈ Detects broken and duplicate bookmarks\\\n⌨️ Hotkeys for quick search access\\\nπŸ—’οΈ Local notes support\\\n❀️ Free and open source\n\n### Concept\n\n![image](concept.png) \n\n### Implementation\n\nFavBox scans all bookmarks in the browser, then makes requests to the saved pages and extracts data from them such as title, description, image, and meta tags to improve the search. All the data is stored in local storage IndexedDB. The extension also tracks all browser events related to bookmarks and synchronizes the data. It only extends the standard functionality and does not attempt to replace it. You can work with bookmarks both through the extension and the native browser’s built-in bookmark features.\n\n\nFavBox is a fully local application. To keep tags synced across devices, it uses a trick. Since bookmarks are synchronized between devices, to keep tags synchronized, the app adds them to the page title.\n\nFor example, if you have a bookmark titled `Google Chrome β€” Wikipedia`, to save tags across devices, extension appends them to the title like this:\n`Google Chrome β€” Wikipedia 🏷 #wiki #browser`\n\nThis way, your tags become available on other devices without using any cloud services β€” only through the standard Google Chrome profile sync.\n\n\n```\nβ”œβ”€β”€ public # Static assets (icons, etc.)\nβ”‚ └── icons\nβ”œβ”€β”€ src # Source code\nβ”‚ β”œβ”€β”€ assets # Global styles\nβ”‚ β”œβ”€β”€ components # Shared UI components\nβ”‚ β”‚ └── app\nβ”‚ β”œβ”€β”€ composables # Vue composables\nβ”‚ β”œβ”€β”€ constants # Application constants\nβ”‚ β”œβ”€β”€ ext # Browser extension\nβ”‚ β”‚ β”œβ”€β”€ browser # FavBox main app\nβ”‚ β”‚ β”‚ β”œβ”€β”€ components\nβ”‚ β”‚ β”‚ β”œβ”€β”€ layouts\nβ”‚ β”‚ β”‚ └── views\nβ”‚ β”‚ β”œβ”€β”€ content # Content scripts\nβ”‚ β”‚ β”œβ”€β”€ popup # Extension popup\nβ”‚ β”‚ └── sw # Service worker\nβ”‚ β”œβ”€β”€ parser # HTML metadata parser\nβ”‚ β”œβ”€β”€ services # Utility services (HTTP client, bookmarks API, tags, hash)\nβ”‚ └── storage # IndexedDB storage\nβ”‚ └── idb\n└── tests\n β”œβ”€β”€ integration\n └── unit\n```\n\n### Permissions\n\n| Permission | Why needed |\n|------------|------------|\n| `bookmarks` | Read and manage bookmarks|\n| `activeTab` | Capture page screenshot for visual previews |\n| `tabs` | Get current tab info when saving bookmarks |\n| `storage` | Store sync status and extension settings |\n| `alarms` | Keep service worker alive for background sync |\n| `contextMenus` | Add \"Save to FavBox\" to right-click menu |\n| `` | Fetch page metadata (title, description, favicon) |\n\n\n### Building\n1. `pnpm run build` to build into `dist`\n2. Enable dev mode in `chrome://extensions/` and `Load unpacked` extension\n\n### Commands\n\n- **`dev`** Start development server \n- **`dev:firefox`** Firefox development build (WIP)\n- **`build`** Production build \n- **`test:unit`** Run unit tests \n- **`test:integration`** Run integration tests \n\n### TODO\n- Use SQLite Wasm for storage (ideal for future experiments)\n- Improve transaction implementation (ensure reliability & better performance)\n- The extension already uses a polyfill to maintain compatibility with other browsers. It would be good to test this in Firefox. (WIP)" }, { "path": "manifest.chrome.json", "content": "{\n \"manifest_version\": 3,\n \"name\": \"FavBox\",\n \"description\": \"A clean, modern bookmark app β€” local-first by design.\",\n \"version\": \"2.1.5\",\n \"permissions\": [\n \"bookmarks\",\n \"activeTab\",\n \"tabs\",\n \"storage\",\n \"alarms\",\n \"contextMenus\"\n ],\n \"host_permissions\": [\n \"\"\n ],\n \"icons\": {\n \"16\": \"icons/icon16.png\",\n \"32\": \"icons/icon32.png\",\n \"48\": \"icons/icon48.png\",\n \"128\": \"icons/icon128.png\"\n },\n \"action\": {\n \"default_popup\": \"ext/popup/index.html\"\n },\n \"commands\": {\n \"_execute_action\": {\n \"suggested_key\": {\n \"windows\": \"Ctrl+Shift+Y\",\n \"mac\": \"Command+Shift+Y\",\n \"chromeos\": \"Ctrl+Shift+U\",\n \"linux\": \"Ctrl+Shift+J\"\n }\n }\n },\n \"background\": {\n \"service_worker\": \"ext/sw/index.js\",\n \"type\": \"module\"\n },\n \"content_scripts\": [\n {\n \"matches\": [\n \"\"\n ],\n \"js\": [\n \"ext/content/content.js\"\n ],\n \"run_at\": \"document_end\"\n }\n ],\n \"web_accessible_resources\": [\n {\n \"resources\": [\n \"ext/browser/index.html\"\n ],\n \"matches\": [\n \"\"\n ]\n }\n ]\n}" }, { "path": "manifest.firefox.json", "content": "{\n \"manifest_version\": 3,\n \"name\": \"FavBox\",\n \"description\": \"A clean, modern bookmark app β€” local-first by design.\",\n \"version\": \"2.1.5\",\n \"permissions\": [\n \"bookmarks\",\n \"activeTab\",\n \"tabs\",\n \"storage\",\n \"alarms\",\n \"contextMenus\"\n ],\n \"host_permissions\": [\n \"\"\n ],\n \"icons\": {\n \"16\": \"icons/icon16.png\",\n \"32\": \"icons/icon32.png\",\n \"48\": \"icons/icon48.png\",\n \"128\": \"icons/icon128.png\"\n },\n \"action\": {\n \"default_icon\": {\n \"16\": \"icons/icon16.png\",\n \"32\": \"icons/icon32.png\"\n },\n \"default_title\": \"FavBox\",\n \"default_popup\": \"ext/popup/index.html\",\n \"theme_icons\": [\n {\n \"light\": \"icons/icon16.png\",\n \"dark\": \"icons/icon16.png\",\n \"size\": 16\n },\n {\n \"light\": \"icons/icon32.png\",\n \"dark\": \"icons/icon32.png\",\n \"size\": 32\n }\n ]\n },\n \"background\": {\n \"scripts\": [\n \"ext/sw/index.js\"\n ],\n \"persistent\": false\n },\n \"content_scripts\": [\n {\n \"matches\": [\n \"\"\n ],\n \"js\": [\n \"ext/content/content.js\"\n ],\n \"run_at\": \"document_end\"\n }\n ],\n \"web_accessible_resources\": [\n {\n \"resources\": [\n \"ext/browser/index.html\"\n ],\n \"matches\": [\n \"\"\n ]\n }\n ]\n}" }, { "path": "package.json", "content": "{\n \"name\": \"favbox\",\n \"version\": \"2.1.5\",\n \"private\": false,\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"dev:firefox\": \"vite build --mode development -c vite.config.firefox.js\",\n \"build\": \"vite build\",\n \"test:unit\": \"vitest --environment jsdom --root tests/unit --disableConsoleIntercept\",\n \"test:integration\": \"vitest --environment jsdom --root tests/integration --disableConsoleIntercept\",\n \"lint\": \"eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix\"\n },\n \"dependencies\": {\n \"@fontsource/sn-pro\": \"^5.2.5\",\n \"@headlessui/vue\": \"^1.7.21\",\n \"@number-flow/vue\": \"^0.4.3\",\n \"@tailwindcss/vite\": \"^4.1.11\",\n \"@tiptap/extension-bold\": \"^2.9.1\",\n \"@tiptap/extension-highlight\": \"^2.9.1\",\n \"@tiptap/extension-italic\": \"^2.9.1\",\n \"@tiptap/extension-typography\": \"^2.9.1\",\n \"@tiptap/extension-underline\": \"^2.9.1\",\n \"@tiptap/pm\": \"^2.9.1\",\n \"@tiptap/starter-kit\": \"^2.9.1\",\n \"@tiptap/vue-3\": \"^2.9.1\",\n \"@vuepic/vue-datepicker\": \"^11.0.2\",\n \"@vueuse/core\": \"^13.5.0\",\n \"@zanmato/vue3-treeselect\": \"^0.4.1\",\n \"fast-average-color\": \"^9.5.0\",\n \"floating-vue\": \"^5.2.2\",\n \"jsstore\": \"^4.9.0\",\n \"linkedom\": \"^0.18.11\",\n \"node-vibrant\": \"^4.0.3\",\n \"notiwind\": \"^2.0.2\",\n \"vue\": \"^3.5.13\",\n \"vue-next-masonry\": \"^1.1.3\",\n \"vue-router\": \"^4.5.0\",\n \"webextension-polyfill\": \"^0.12.0\"\n },\n \"devDependencies\": {\n \"@babel/eslint-parser\": \"^7.28.0\",\n \"@crxjs/vite-plugin\": \"^2.0.0-beta.26\",\n \"@iconify/json\": \"^2.2.356\",\n \"@rushstack/eslint-patch\": \"^1.10.2\",\n \"@tailwindcss/forms\": \"^0.5.7\",\n \"@tailwindcss/typography\": \"^0.5.13\",\n \"@types/dompurify\": \"^3.0.5\",\n \"@vitejs/plugin-vue\": \"^6.0.0\",\n \"@vue/test-utils\": \"^2.4.5\",\n \"autoprefixer\": \"^10.4.21\",\n \"eslint\": \"^8.57.1\",\n \"eslint-config-airbnb-base\": \"^15.0.0\",\n \"eslint-import-resolver-alias\": \"^1.1.2\",\n \"eslint-plugin-import\": \"^2.32.0\",\n \"eslint-plugin-jsdoc\": \"^48.11.0\",\n \"eslint-plugin-vue\": \"^9.33.0\",\n \"eslint-plugin-vuejs-accessibility\": \"^2.4.1\",\n \"file-loader\": \"^6.2.0\",\n \"globals\": \"^16.3.0\",\n \"jsdom\": \"^26.1.0\",\n \"postcss\": \"^8.5.6\",\n \"tailwindcss\": \"^4.1.11\",\n \"terser\": \"^5.31.0\",\n \"unplugin-auto-import\": \"^19.3.0\",\n \"unplugin-icons\": \"^22.1.0\",\n \"vite\": \"^7.1.11\",\n \"vite-plugin-eslint\": \"^1.8.1\",\n \"vitest\": \"^3.0.5\",\n \"vue-eslint-parser\": \"^10.2.0\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/dd3v/favbox.git\"\n },\n \"keywords\": [\n \"chrome extension\",\n \"bookmarks\"\n ],\n \"author\": \"Magalyas Dmitry\",\n \"license\": \"MIT\",\n \"bugs\": {\n \"url\": \"https://github.com/dd3v/favbox/issues\"\n },\n \"homepage\": \"https://github.com/dd3v/favbox#readme\"\n}\n" }, { "path": "public/site.webmanifest", "content": "{\"name\":\"\",\"short_name\":\"\",\"icons\":[{\"src\":\"/android-chrome-192x192.png\",\"sizes\":\"192x192\",\"type\":\"image/png\"},{\"src\":\"/android-chrome-512x512.png\",\"sizes\":\"512x512\",\"type\":\"image/png\"}],\"theme_color\":\"#ffffff\",\"background_color\":\"#ffffff\",\"display\":\"standalone\"}" }, { "path": "src/assets/app.css", "content": "@import \"tailwindcss\";\n@plugin \"@tailwindcss/forms\";\n@plugin \"@tailwindcss/typography\";\n\n@custom-variant dark (&:where(.dark, .dark *));\n\n@layer base {\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n *,\n ::after,\n ::before,\n ::backdrop,\n ::file-selector-button {\n border-color: var(--color-gray-200, currentColor);\n }\n}\n\n@theme {\n --font-sans: \"SN Pro\", sans-serif; \n --color-soft-50: oklch(0.999 0.001 0);\n --color-soft-100: oklch(0.995 0.002 0);\n --color-soft-200: oklch(0.99 0.003 0);\n --color-soft-300: oklch(0.98 0.004 0);\n --color-soft-400: oklch(0.95 0.005 0);\n --color-soft-500: oklch(0.9 0.006 0);\n --color-soft-600: oklch(0.85 0.007 0);\n --color-soft-700: oklch(0.8 0.008 0);\n --color-soft-800: oklch(0.75 0.009 0);\n --color-soft-900: oklch(0.7 0.01 0);\n\n --color-gray-50: oklch(0.985 0 0);\n --color-gray-100: oklch(0.967 0.001 286.375);\n --color-gray-200: oklch(0.92 0.004 286.32);\n --color-gray-300: oklch(0.871 0.006 286.286);\n --color-gray-400: oklch(0.705 0.015 286.067);\n --color-gray-500: oklch(0.552 0.016 285.938);\n --color-gray-600: oklch(0.442 0.017 285.786);\n --color-gray-700: oklch(0.37 0.013 285.805);\n --color-gray-800: oklch(0.274 0.006 286.033);\n --color-gray-900: oklch(0.21 0.006 285.885);\n --color-gray-950: oklch(0.141 0.005 285.823);\n}\n\n\n@layer utilities {\n\n :root {\n --scrollbar-thumb: rgba(0, 0, 0, 0.2);\n --scrollbar-thumb-hover: rgba(0, 0, 0, 0.2);\n }\n\n .dark {\n --scrollbar-thumb: rgba(255, 255, 255, 0.2);\n --scrollbar-thumb-hover: rgba(255, 255, 255, 0.3);\n }\n\n ::-webkit-scrollbar {\n width: 1px;\n height: 1px;\n }\n\n ::-webkit-scrollbar-track {\n background: transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n background: var(--scrollbar-thumb);\n border-radius: 2px;\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background: var(--scrollbar-thumb-hover);\n }\n}\n@supports(animation-timeline: view()) {\n @keyframes fade-in-on-enter--fade-out-on-exit {\n entry 0% {\n opacity: 0;\n transform: translateY(100%);\n }\n\n entry 100% {\n opacity: 1;\n transform: translateY(0);\n }\n\n exit 0% {\n opacity: 1;\n transform: translateY(0);\n }\n\n exit 100% {\n opacity: 0;\n transform: translateY(-100%);\n }\n }\n\n .list-view>ul>li {\n animation: linear fade-in-on-enter--fade-out-on-exit;\n animation-timeline: view();\n }\n}\n\n.vue3-treeselect__single-value {\n @apply!text-black dark: !text-white;\n}\n\n.vue3-treeselect:not(.vue3-treeselect--disabled):not(.vue3-treeselect--focused) .vue3-treeselect__control:hover {\n @apply !border-gray-200 dark:!border-neutral-700;\n}\n\n.vue3-treeselect__control {\n @apply w-full !border-gray-200 !text-xs !text-black !shadow-sm !outline-none focus:!border-gray-300 focus:!ring-0 dark:!border-neutral-800 dark:!bg-neutral-900 dark:!text-white dark:focus:!border-neutral-700;\n}\n\n.vue3-treeselect__input {\n @apply !text-xs !text-black dark:!text-white;\n}\n\n.vue3-treeselect__input:focus {\n @apply !ring-0 !outline-none !shadow-none !text-xs;\n}\n\n.vue3-treeselect__menu {\n @apply !bg-white !shadow-sm !text-xs !border-t-0 !border-solid !border-gray-200 dark:!border-neutral-700 !ring-0 focus:!outline-none dark:!bg-neutral-900 dark:!text-white;\n}\n\n.vue3-treeselect .vue3-treeselect__list div {\n @apply !leading-[2.5] !py-0 !my-0;\n}\n\n.vue3-treeselect__option--highlight {\n @apply !bg-gray-100 dark:!bg-neutral-800;\n}\n\n.vue3-treeselect__option vue3-treeselect__option--highlight {\n @apply !bg-gray-100 dark:!bg-neutral-800;\n}\n\n.vue3-treeselect--open .vue3-treeselect__control {\n @apply dark:!border-neutral-700;\n}\n\n.vue3-treeselect--single .vue3-treeselect__option--selected {\n @apply !bg-gray-100 dark:!bg-neutral-800;\n}\n\n.vue3-treeselect--focused:not(.vue3-treeselect--open) .vue3-treeselect__control {\n @apply !border-gray-200 dark:!border-neutral-700 !shadow-none;\n}\n\n.vue3-treeselect__single-value {\n @apply !text-black dark:!text-white;\n}\n\n:root .dp__theme_light {\n --dp-background-color: #fff;\n --dp-text-color: var(--color-gray-900);\n --dp-hover-color: var(--color-gray-100);\n --dp-hover-text-color: var(--color-gray-900);\n --dp-primary-color: var(--color-gray-600);\n --dp-primary-text-color: #fff;\n --dp-border-color: var(--color-gray-200);\n --dp-menu-border-color: var(--color-gray-200);\n --dp-font-family: \"SN Pro\", sans-serif;\n --dp-font-size: 0.75rem;\n}\n\n:root .dp__theme_dark {\n --dp-background-color: var(--color-gray-950);\n --dp-text-color: var(--color-gray-100);\n --dp-hover-color: var(--color-gray-800);\n --dp-hover-text-color: var(--color-gray-100);\n --dp-primary-color: var(--color-gray-400);\n --dp-primary-text-color: var(--color-gray-900);\n --dp-border-color: var(--color-gray-700);\n --dp-menu-border-color: var(--color-gray-700);\n --dp-font-family: \"SN Pro\", sans-serif;\n --dp-font-size: 0.75rem;\n}\n" }, { "path": "src/components/app/AppBadge.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppBullet.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppButton.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppConfirmation.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppDrawer.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppInfiniteScroll.vue", "content": "\n\n" }, { "path": "src/components/app/AppNotifications.vue", "content": "\n" }, { "path": "src/components/app/AppProgress.vue", "content": "\n\n\n" }, { "path": "src/components/app/AppRadio.vue", "content": "\n\n" }, { "path": "src/components/app/AppSpinner.vue", "content": "\n\n" }, { "path": "src/components/app/AppTagInput.vue", "content": "\n\n\n" }, { "path": "src/composables/useColorExtraction.js", "content": "import { FastAverageColor } from 'fast-average-color';\nimport { ref } from 'vue';\n\nexport default function useColorExtraction() {\n const placeholder = ref({\n background: 'radial-gradient(ellipse at 50% 40%, rgba(200, 200, 220, 0.5) 0%, rgba(180, 180, 200, 0.3) 50%, rgba(160, 160, 180, 0.15) 100%)',\n transition: 'background 0.8s ease',\n });\n\n const extract = async (url, cacheKey) => {\n if (!url) return;\n const cached = localStorage.getItem(cacheKey);\n if (cached) {\n const style = JSON.parse(cached);\n placeholder.value = style.placeholder;\n return;\n }\n try {\n const fac = new FastAverageColor();\n const color = await fac.getColorAsync(url);\n const [r, g, b] = color.value;\n const saturate = (v) => Math.min(255, Math.round(v * 1.2));\n const style = {\n placeholder: {\n background: `radial-gradient(ellipse at 50% 40%, rgba(${saturate(r)}, ${saturate(g)}, ${saturate(b)}, 0.5) 0%, rgba(${r}, ${g}, ${b}, 0.3) 50%, rgba(${r}, ${g}, ${b}, 0.15) 100%)`,\n transition: 'background 0.8s ease',\n },\n };\n localStorage.setItem(cacheKey, JSON.stringify(style));\n placeholder.value = style.placeholder;\n } catch (e) {\n console.warn('Color extraction failed, using default', e);\n }\n };\n\n return { placeholder, extract };\n}\n" }, { "path": "src/constants/app.js", "content": "export const PAGINATION_LIMIT = 100;\nexport const NOTIFICATION_DURATION = 3000;\n" }, { "path": "src/constants/httpStatus.js", "content": "export const HTTP_STATUS = {\n CONTINUE: 100,\n SWITCHING_PROTOCOLS: 101,\n PROCESSING: 102,\n EARLY_HINTS: 103,\n\n OK: 200,\n CREATED: 201,\n ACCEPTED: 202,\n NON_AUTHORITATIVE_INFORMATION: 203,\n NO_CONTENT: 204,\n RESET_CONTENT: 205,\n PARTIAL_CONTENT: 206,\n MULTI_STATUS: 207,\n ALREADY_REPORTED: 208,\n IM_USED: 226,\n\n MULTIPLE_CHOICES: 300,\n MOVED_PERMANENTLY: 301,\n FOUND: 302,\n SEE_OTHER: 303,\n NOT_MODIFIED: 304,\n USE_PROXY: 305,\n TEMPORARY_REDIRECT: 307,\n PERMANENT_REDIRECT: 308,\n\n BAD_REQUEST: 400,\n UNAUTHORIZED: 401,\n PAYMENT_REQUIRED: 402,\n FORBIDDEN: 403,\n NOT_FOUND: 404,\n METHOD_NOT_ALLOWED: 405,\n NOT_ACCEPTABLE: 406,\n PROXY_AUTHENTICATION_REQUIRED: 407,\n REQUEST_TIMEOUT: 408,\n CONFLICT: 409,\n GONE: 410,\n LENGTH_REQUIRED: 411,\n PRECONDITION_FAILED: 412,\n CONTENT_TOO_LARGE: 413,\n URI_TOO_LONG: 414,\n UNSUPPORTED_MEDIA_TYPE: 415,\n RANGE_NOT_SATISFIABLE: 416,\n EXPECTATION_FAILED: 417,\n IM_A_TEAPOT: 418,\n MISDIRECTED_REQUEST: 421,\n UNPROCESSABLE_ENTITY: 422,\n LOCKED: 423,\n FAILED_DEPENDENCY: 424,\n TOO_EARLY: 425,\n UPGRADE_REQUIRED: 426,\n PRECONDITION_REQUIRED: 428,\n TOO_MANY_REQUESTS: 429,\n REQUEST_HEADER_FIELDS_TOO_LARGE: 431,\n\n INTERNAL_SERVER_ERROR: 500,\n NOT_IMPLEMENTED: 501,\n BAD_GATEWAY: 502,\n SERVICE_UNAVAILABLE: 503,\n GATEWAY_TIMEOUT: 504,\n HTTP_VERSION_NOT_SUPPORTED: 505,\n VARIANT_ALSO_NEGOTIATES: 506,\n INSUFFICIENT_STORAGE: 507,\n LOOP_DETECTED: 508,\n NOT_EXTENDED: 510,\n NETWORK_AUTHENTICATION_REQUIRED: 511,\n UNKNOWN_ERROR: 520,\n WEB_SERVER_IS_DOWN: 521,\n NETWORK_TIMEOUT_ERROR: 599,\n};\n\nexport const STATUS_MESSAGE = new Map([\n [HTTP_STATUS.CONTINUE, 'Continue'],\n [HTTP_STATUS.SWITCHING_PROTOCOLS, 'Switching Protocols'],\n [HTTP_STATUS.PROCESSING, 'Processing'],\n [HTTP_STATUS.EARLY_HINTS, 'Early Hints'],\n\n [HTTP_STATUS.OK, 'OK'],\n [HTTP_STATUS.CREATED, 'Created'],\n [HTTP_STATUS.ACCEPTED, 'Accepted'],\n [HTTP_STATUS.NON_AUTHORITATIVE_INFORMATION, 'Non-Authoritative Information'],\n [HTTP_STATUS.NO_CONTENT, 'No Content'],\n [HTTP_STATUS.RESET_CONTENT, 'Reset Content'],\n [HTTP_STATUS.PARTIAL_CONTENT, 'Partial Content'],\n [HTTP_STATUS.MULTI_STATUS, 'Multi-Status'],\n [HTTP_STATUS.ALREADY_REPORTED, 'Already Reported'],\n [HTTP_STATUS.IM_USED, 'IM Used'],\n\n [HTTP_STATUS.MULTIPLE_CHOICES, 'Multiple Choices'],\n [HTTP_STATUS.MOVED_PERMANENTLY, 'Moved Permanently'],\n [HTTP_STATUS.FOUND, 'Found'],\n [HTTP_STATUS.SEE_OTHER, 'See Other'],\n [HTTP_STATUS.NOT_MODIFIED, 'Not Modified'],\n [HTTP_STATUS.USE_PROXY, 'Use Proxy'],\n [HTTP_STATUS.TEMPORARY_REDIRECT, 'Temporary Redirect'],\n [HTTP_STATUS.PERMANENT_REDIRECT, 'Permanent Redirect'],\n\n [HTTP_STATUS.BAD_REQUEST, 'Bad Request'],\n [HTTP_STATUS.UNAUTHORIZED, 'Unauthorized'],\n [HTTP_STATUS.PAYMENT_REQUIRED, 'Payment Required'],\n [HTTP_STATUS.FORBIDDEN, 'Forbidden'],\n [HTTP_STATUS.NOT_FOUND, 'Not Found'],\n [HTTP_STATUS.METHOD_NOT_ALLOWED, 'Method Not Allowed'],\n [HTTP_STATUS.NOT_ACCEPTABLE, 'Not Acceptable'],\n [HTTP_STATUS.PROXY_AUTHENTICATION_REQUIRED, 'Proxy Authentication Required'],\n [HTTP_STATUS.REQUEST_TIMEOUT, 'Request Timeout'],\n [HTTP_STATUS.CONFLICT, 'Conflict'],\n [HTTP_STATUS.GONE, 'Gone'],\n [HTTP_STATUS.LENGTH_REQUIRED, 'Length Required'],\n [HTTP_STATUS.PRECONDITION_FAILED, 'Precondition Failed'],\n [HTTP_STATUS.CONTENT_TOO_LARGE, 'Content Too Large'],\n [HTTP_STATUS.URI_TOO_LONG, 'URI Too Long'],\n [HTTP_STATUS.UNSUPPORTED_MEDIA_TYPE, 'Unsupported Media Type'],\n [HTTP_STATUS.RANGE_NOT_SATISFIABLE, 'Range Not Satisfiable'],\n [HTTP_STATUS.EXPECTATION_FAILED, 'Expectation Failed'],\n [HTTP_STATUS.IM_A_TEAPOT, 'I\\'m a teapot'],\n [HTTP_STATUS.MISDIRECTED_REQUEST, 'Misdirected Request'],\n [HTTP_STATUS.UNPROCESSABLE_ENTITY, 'Unprocessable Entity'],\n [HTTP_STATUS.LOCKED, 'Locked'],\n [HTTP_STATUS.FAILED_DEPENDENCY, 'Failed Dependency'],\n [HTTP_STATUS.TOO_EARLY, 'Too Early'],\n [HTTP_STATUS.UPGRADE_REQUIRED, 'Upgrade Required'],\n [HTTP_STATUS.PRECONDITION_REQUIRED, 'Precondition Required'],\n [HTTP_STATUS.TOO_MANY_REQUESTS, 'Too Many Requests'],\n [HTTP_STATUS.REQUEST_HEADER_FIELDS_TOO_LARGE, 'Request Header Fields Too Large'],\n\n [HTTP_STATUS.INTERNAL_SERVER_ERROR, 'Internal Server Error'],\n [HTTP_STATUS.NOT_IMPLEMENTED, 'Not Implemented'],\n [HTTP_STATUS.BAD_GATEWAY, 'Bad Gateway'],\n [HTTP_STATUS.SERVICE_UNAVAILABLE, 'Service Unavailable'],\n [HTTP_STATUS.GATEWAY_TIMEOUT, 'Gateway Timeout'],\n [HTTP_STATUS.HTTP_VERSION_NOT_SUPPORTED, 'HTTP Version Not Supported'],\n [HTTP_STATUS.VARIANT_ALSO_NEGOTIATES, 'Variant Also Negotiates'],\n [HTTP_STATUS.INSUFFICIENT_STORAGE, 'Insufficient Storage'],\n [HTTP_STATUS.LOOP_DETECTED, 'Loop Detected'],\n [HTTP_STATUS.NOT_EXTENDED, 'Not Extended'],\n [HTTP_STATUS.NETWORK_AUTHENTICATION_REQUIRED, 'Network Authentication Required'],\n [HTTP_STATUS.UNKNOWN_ERROR, 'Unknown error. Data retrieval failed. Check bookmarks manually; data may be incomplete.'],\n [HTTP_STATUS.WEB_SERVER_IS_DOWN, ' Web server is down'],\n [HTTP_STATUS.NETWORK_TIMEOUT_ERROR, 'Network Timeout Error'],\n]);\n" }, { "path": "src/ext/browser/app.js", "content": "import { createApp } from 'vue';\nimport masonry from 'vue-next-masonry';\nimport Notifications from 'notiwind';\nimport FloatingVue from 'floating-vue';\nimport router from './router';\nimport AppLayout from './layouts/AppLayout.vue';\nimport 'floating-vue/dist/style.css';\nimport '@zanmato/vue3-treeselect/dist/vue3-treeselect.min.css';\nimport '@fontsource/sn-pro';\nimport '@vuepic/vue-datepicker/dist/main.css';\nimport '@/assets/app.css';\n\nconst app = createApp(AppLayout)\n .use(router)\n .use(masonry)\n .use(Notifications)\n .use(FloatingVue);\n\napp.mount('#app');\n" }, { "path": "src/ext/browser/components/ASide.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/AttributeList.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/BookmarkFavicon.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/BookmarkForm.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/BookmarkLayout.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/BookmarksSync.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/CommandPalette.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/DatePicker.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/FolderTree.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/FolderTreeItem.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/SearchTerm.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/SortDirection.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/TextEditor.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/ThemeMode.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/ViewMode.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/card/BookmarkCard.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/card/DuplicateCard.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/card/HealthCheckCard.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/card/PinnedCard.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/card/type/CardView.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/components/card/type/ListView.vue", "content": "\n\n" }, { "path": "src/ext/browser/components/card/type/MasonryView.vue", "content": "\n\n\n\n\n" }, { "path": "src/ext/browser/index.html", "content": "\n\n \n \n \n \n FavBox\n \n \n
\n \n \n\n" }, { "path": "src/ext/browser/layouts/AppLayout.vue", "content": "\n\n\n\n\n" }, { "path": "src/ext/browser/router.js", "content": "import { createWebHashHistory, createRouter } from 'vue-router';\n\nconst routes = [\n {\n path: '/bookmarks',\n alias: '/ext/browser/index.html',\n name: 'BookmarksView',\n component: () => import('./views/BookmarksView.vue'),\n meta: {\n page: 1,\n },\n },\n {\n path: '/bookmarks/:id',\n name: 'BookmarkDetailView',\n component: () => import('./views/BookmarksView.vue'),\n meta: {\n page: 1,\n },\n },\n {\n path: '/notes',\n name: 'NotesView',\n component: () => import('./views/NotesView.vue'),\n meta: { page: 2 },\n },\n {\n path: '/health-check',\n name: 'HealthCheckView',\n component: () => import('./views/HealthCheckView.vue'),\n meta: { page: 3 },\n },\n {\n path: '/duplicates',\n name: 'DuplicatesView',\n component: () => import('./views/DuplicatesView.vue'),\n meta: { page: 4 },\n },\n {\n path: '/',\n redirect: '/bookmarks',\n },\n {\n path: '/:catchAll(.*)',\n redirect: '/bookmarks',\n },\n];\n\nconst router = createRouter({\n history: createWebHashHistory(),\n routes,\n});\n\nexport default router;\n" }, { "path": "src/ext/browser/views/BookmarksView.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/views/DuplicatesView.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/views/HealthCheckView.vue", "content": "\n\n\n" }, { "path": "src/ext/browser/views/NotesView.vue", "content": "\n\n\n" }, { "path": "src/ext/content/content.js", "content": "let port;\n/**\n *\n */\nfunction connect() {\n console.warn('Keep alive connection..');\n port = browser.runtime.connect({ name: 'favbox' });\n port.onDisconnect.addListener(connect);\n port.onMessage.addListener((msg) => {\n console.log('received', msg, 'from bg');\n });\n port.postMessage({ action: 'ping' });\n}\ntry {\n connect();\n} catch (e) {\n console.error('Content script error', e);\n}\n\nbrowser.runtime.onMessage.addListener((message, sender, sendResponse) => {\n if (message.action === 'getHTML') {\n const headElement = document.head;\n const headHTML = headElement ? headElement.outerHTML : '';\n const completeHTML = `${headHTML}`;\n sendResponse({ html: completeHTML });\n }\n});\n\nconsole.log(' Content script loaded');\n" }, { "path": "src/ext/popup/App.vue", "content": "\n\n" }, { "path": "src/ext/popup/PopupView.vue", "content": "\n\n\n" }, { "path": "src/ext/popup/components/BookmarkForm.vue", "content": "\n\n" }, { "path": "src/ext/popup/index.html", "content": "\n\n\n\n \n \n \n Vite App\n\n\n\n
\n \n\n\n" }, { "path": "src/ext/popup/main.js", "content": "import { createApp } from 'vue';\nimport App from './App.vue';\nimport '@/assets/app.css';\nimport '@zanmato/vue3-treeselect/dist/vue3-treeselect.min.css';\nimport '@fontsource/sn-pro';\n\ncreateApp(App).mount('#app');\n" }, { "path": "src/ext/sw/index.js", "content": "import BookmarkStorage from '@/storage/bookmark';\nimport AttributeStorage from '@/storage/attribute';\nimport MetadataParser from '@/parser/metadata';\nimport { fetchUrl } from '@/services/httpClient';\nimport { extractTitle, extractTags } from '@/services/tags';\nimport { getFoldersMap, getBookmarksFromNode } from '@/services/browserBookmarks';\nimport sync from './sync';\nimport ping from './ping';\n\nconst bookmarkStorage = new BookmarkStorage();\nconst attributeStorage = new AttributeStorage();\n\n// https://developer.chrome.com/docs/extensions/develop/migrate/to-service-workers\nconst waitUntil = async (promise) => {\n const keepAlive = setInterval(browser.runtime.getPlatformInfo, 25 * 1000);\n try {\n await promise;\n } finally {\n clearInterval(keepAlive);\n }\n};\n\nbrowser.runtime.onInstalled.addListener(async () => {\n browser.contextMenus.create({ id: 'openPopup', title: 'Bookmark this page', contexts: ['all'] });\n await browser.alarms.create('healthcheck', { periodInMinutes: 0.5 });\n await browser.storage.session.set({ nativeImport: false });\n waitUntil(sync());\n});\n\nbrowser.runtime.onStartup.addListener(async () => {\n console.warn('Wake up..');\n await browser.storage.session.set({ nativeImport: false });\n const alarm = await browser.alarms.get('healthcheck');\n if (!alarm) {\n await browser.alarms.create('healthcheck', { periodInMinutes: 0.5 });\n }\n waitUntil(sync());\n});\n\nbrowser.alarms.onAlarm.addListener(async (alarm) => {\n if (alarm.name === 'healthcheck') {\n console.log('health check');\n await browser.storage.local.set({ lastHealthCheck: Date.now() });\n }\n});\n\nbrowser.contextMenus.onClicked.addListener((info) => {\n if (info.menuItemId === 'openPopup') {\n browser.action.openPopup();\n }\n});\n\n// https:// developer.browser.com/docs/extensions/reference/bookmarks/#event-onCreated\nbrowser.bookmarks.onCreated.addListener(async (id, bookmark) => {\n const { nativeImport } = await browser.storage.session.get('nativeImport');\n if (nativeImport === true) {\n return;\n }\n console.time(`bookmark-created-${id}`);\n console.warn('πŸŽ‰ Handle bookmark create..', id, bookmark);\n if (bookmark.url === undefined) {\n console.warn('bad bookmark data', bookmark);\n return;\n }\n let response = null;\n let activeTab = null;\n\n // fetch HTML from active tab (content script)\n [activeTab] = await browser.tabs.query({ active: true });\n try {\n console.warn('activeTab', activeTab);\n console.warn('requesting html from tab', activeTab);\n const content = await browser.tabs.sendMessage(activeTab.id, { action: 'getHTML' });\n response = { html: content?.html, error: 0 };\n console.warn('response from tab', response);\n } catch (e) {\n console.error('No tabs. It is weird. Fetching data from internet.. 🌎', e);\n response = await fetchUrl(bookmark.url, 15000);\n }\n\n try {\n if (response === null) {\n throw new Error('No page data: response is null');\n }\n const foldersMap = await getFoldersMap();\n const entity = await (new MetadataParser(bookmark, response, foldersMap)).getFavboxBookmark();\n if (entity.image === null && activeTab) {\n try {\n console.warn('πŸ“Έ No image, take a screenshot', activeTab);\n const screenshot = await browser.tabs.captureVisibleTab(activeTab.windowId, { format: 'jpeg', quality: 10 });\n entity.image = screenshot;\n } catch (e) {\n console.error('πŸ“Έ', e);\n }\n }\n console.log('πŸ”– Entity', entity);\n await bookmarkStorage.create(entity);\n await attributeStorage.create(entity);\n refreshUserInterface();\n console.log('πŸŽ‰ Bookmark has been created..');\n } catch (e) {\n console.error('πŸŽ‰', e, id, bookmark);\n } finally {\n response = null;\n activeTab = null;\n }\n console.timeEnd(`bookmark-created-${id}`);\n});\n\n// https://developer.chrome.com/docs/extensions/reference/bookmarks/#event-onChanged\nbrowser.bookmarks.onChanged.addListener(async (id, changeInfo) => {\n console.time(`bookmark-changed-${id}`);\n try {\n const [bookmark] = await browser.bookmarks.get(id);\n // folder\n if (!bookmark.url) {\n // Only update if title actually changed\n if (changeInfo.title !== undefined) {\n await bookmarkStorage.updateBookmarksFolderName(bookmark.id, changeInfo.title);\n console.log('πŸ”„ Folder has been updated..', id, changeInfo);\n }\n }\n // bookmark\n if (bookmark.url) {\n const oldBookmark = await bookmarkStorage.getById(id);\n // Only update if title actually changed (changeInfo.title contains new value)\n if (changeInfo.title !== undefined) {\n await bookmarkStorage.update(id, {\n title: extractTitle(changeInfo.title),\n tags: extractTags(changeInfo.title),\n url: bookmark.url,\n updatedAt: new Date().toISOString(),\n });\n const newBookmark = await bookmarkStorage.getById(id);\n if (oldBookmark && newBookmark) {\n await attributeStorage.update(newBookmark, oldBookmark);\n }\n } else {\n // Title didn't change, but url or other fields might have - update only url\n await bookmarkStorage.update(id, {\n url: bookmark.url,\n updatedAt: new Date().toISOString(),\n });\n }\n console.log('πŸ”„ Bookmark has been updated..', id, changeInfo);\n }\n } catch (e) {\n console.error('πŸ”„', e, id, changeInfo);\n }\n refreshUserInterface();\n console.timeEnd(`bookmark-changed-${id}`);\n});\n\n// https://developer.chrome.com/docs/extensions/reference/bookmarks/#event-onMoved\nbrowser.bookmarks.onMoved.addListener(async (id, moveInfo) => {\n console.time(`bookmark-moved-${id}`);\n try {\n const [item] = await browser.bookmarks.get(id);\n // Only process bookmarks (with url), not folders\n if (item.url) {\n const [folder] = await browser.bookmarks.get(moveInfo.parentId);\n console.log('πŸ—‚ Bookmark has been moved..', id, moveInfo, folder);\n await bookmarkStorage.update(id, {\n folderName: folder.title,\n folderId: folder.id,\n updatedAt: new Date().toISOString(),\n });\n refreshUserInterface();\n } else {\n // Folder moved - update folderName for all bookmarks in this folder\n console.log('πŸ—‚ Folder has been moved..', id, moveInfo);\n await bookmarkStorage.updateBookmarksFolderName(id, item.title);\n refreshUserInterface();\n }\n } catch (e) {\n console.error('πŸ—‚', e, id, moveInfo);\n }\n console.timeEnd(`bookmark-moved-${id}`);\n});\n\n// https://developer.chrome.com/docs/extensions/reference/bookmarks/#event-onRemoved\nbrowser.bookmarks.onRemoved.addListener(async (id, removeInfo) => {\n console.time(`bookmark-removed-${id}`);\n console.log('πŸ—‘οΈ Handle remove bookmark..', id, removeInfo);\n // folder has been deleted..\n if (removeInfo.node.children !== undefined) {\n try {\n const items = getBookmarksFromNode(removeInfo.node);\n const bookmarksToRemove = items.map((bookmark) => bookmark.id);\n if (bookmarksToRemove.length) {\n await bookmarkStorage.removeByIds(bookmarksToRemove);\n // Full refresh after folder deletion\n const [domains, tags, keywords] = await Promise.all([\n bookmarkStorage.aggregateDomains(),\n bookmarkStorage.aggregateTags(),\n bookmarkStorage.aggregateKeywords(),\n ]);\n await attributeStorage.refreshFromAggregated(domains, tags, keywords, true);\n console.log('πŸ—‘οΈ Folder has been removed..', bookmarksToRemove.length, id, removeInfo);\n }\n refreshUserInterface();\n } catch (e) {\n console.error('πŸ—‘οΈ Remove err', e);\n }\n return;\n }\n // single bookmark has been deleted..\n try {\n const bookmark = await bookmarkStorage.getById(id);\n if (!bookmark) {\n // Bookmark not found in storage - might have been deleted already or never synced\n console.warn(`Bookmark with ID ${id} not found in storage, skipping removal.`);\n return;\n }\n await bookmarkStorage.removeById(id);\n await attributeStorage.remove(bookmark);\n console.log('πŸ—‘οΈ Bookmark has been removed..', id, removeInfo);\n } catch (e) {\n console.error('πŸ—‘οΈ', e);\n }\n console.timeEnd(`bookmark-removed-${id}`);\n});\n\n// https://developer.chrome.com/docs/extensions/reference/api/bookmarks#event-onImportBegan\nbrowser.bookmarks.onImportBegan.addListener(async () => {\n console.log('πŸ“„ Import bookmarks started');\n await browser.storage.session.set({ nativeImport: true });\n await browser.storage.session.set({ status: false });\n});\n\n// https://developer.chrome.com/docs/extensions/reference/api/bookmarks#event-onImportEnded\nbrowser.bookmarks.onImportEnded.addListener(async () => {\n console.log('πŸ“„ Import bookmarks ended');\n await browser.storage.session.set({ nativeImport: false });\n waitUntil(sync());\n});\n\nfunction refreshUserInterface() {\n try {\n browser.runtime.sendMessage({ action: 'refresh' });\n } catch (e) {\n console.error('Refresh UI listener not available', e);\n }\n}\nping();\n" }, { "path": "src/ext/sw/ping.js", "content": "const ping = () => {\n const onMessage = (msg, port) => {\n console.log('received', msg, 'from', port.sender);\n };\n const deleteTimer = (port) => {\n if (port.timer) {\n clearTimeout(port.timer);\n delete port.timer;\n }\n };\n const forceReconnect = (port) => {\n console.warn('Reconnect...');\n deleteTimer(port);\n port.disconnect();\n };\n\n // https://bugs.chromium.org/p/chromium/issues/detail?id=1152255\n // https://bugs.chromium.org/p/chromium/issues/detail?id=1189678\n browser.runtime.onConnect.addListener((port) => {\n if (port.name !== 'favbox') return;\n port.onMessage.addListener(onMessage);\n port.onDisconnect.addListener(deleteTimer);\n port.timer = setTimeout(forceReconnect, 30000, port);\n });\n};\n\nexport default ping;\n" }, { "path": "src/ext/sw/sync.js", "content": "import { fetchUrl } from '@/services/httpClient';\nimport BookmarkStorage from '@/storage/bookmark';\nimport AttributeStorage from '@/storage/attribute';\nimport MetadataParser from '@/parser/metadata';\nimport { getBookmarksCount, getFoldersMap, getBookmarksIterator } from '@/services/browserBookmarks';\nimport hashCode from '@/services/hash';\n\nconst MAX_CONCURRENT = 50;\nconst BATCH_SIZE = 100;\nconst PROGRESS_UPDATE_INTERVAL = 3000;\n\nconst bookmarkStorage = new BookmarkStorage();\nconst attributeStorage = new AttributeStorage();\n\nconst sendProgress = (progress, savedCount) => {\n browser.storage.session.set({ progress });\n browser.runtime.sendMessage({ action: 'sync', data: { progress, savedCount } }).catch(() => {});\n};\n\nconst fetchPageMetadata = async (bookmark, foldersMap) => {\n const response = await fetchUrl(bookmark.url);\n return (new MetadataParser(bookmark, response, foldersMap)).getFavboxBookmark();\n};\n\nconst toAttribute = (key, { value, count }) => ({\n key,\n value: String(value).trim(),\n id: hashCode(key, String(value).trim()),\n count,\n});\n\nexport const refreshAttributes = async () => {\n console.time('refreshAttributes');\n\n await attributeStorage.clear();\n\n const [domains, tags, keywords] = await Promise.all([\n bookmarkStorage.aggregateDomains(),\n bookmarkStorage.aggregateTags(),\n bookmarkStorage.aggregateKeywords(),\n ]);\n\n const attributes = [\n ...domains.map((r) => toAttribute('domain', r)),\n ...tags.map((r) => toAttribute('tag', r)),\n ...keywords.map((r) => toAttribute('keyword', r)),\n ];\n\n await attributeStorage.saveMany(attributes);\n console.timeEnd('refreshAttributes');\n};\n\nconst sync = async () => {\n console.time('Sync time');\n\n const browserTotal = await getBookmarksCount();\n const idbTotal = await bookmarkStorage.total();\n const { status } = await browser.storage.session.get('status');\n\n await browser.storage.session.set({ browserTotal, idbTotal });\n console.log(`Browser: ${browserTotal}, IDB: ${idbTotal}, Status: ${status}`);\n\n if (browserTotal === idbTotal || status) {\n await browser.storage.session.set({ status: true });\n console.log('Already in sync');\n return;\n }\n\n await browser.storage.session.set({ status: false });\n const [foldersMap, existingIds] = await Promise.all([\n getFoldersMap(),\n bookmarkStorage.getAllIds().then((ids) => new Set(ids)),\n ]);\n\n const browserIds = new Set();\n const batch = [];\n let processed = 0;\n let savedCount = 0;\n let lastProgressUpdate = Date.now();\n\n const bookmarksToProcess = [];\n for await (const bookmark of getBookmarksIterator()) {\n browserIds.add(bookmark.id);\n if (!existingIds.has(bookmark.id)) {\n bookmarksToProcess.push(bookmark);\n }\n }\n bookmarksToProcess.sort((a, b) => String(a.id).localeCompare(String(b.id)));\n\n console.log(`To process: ${bookmarksToProcess.length}`);\n\n const active = new Set();\n\n const handleBookmark = async (bookmark) => {\n try {\n const result = await fetchPageMetadata(bookmark, foldersMap);\n batch.push(result);\n processed++;\n const now = Date.now();\n if (now - lastProgressUpdate > PROGRESS_UPDATE_INTERVAL) {\n const progress = Math.round((processed / bookmarksToProcess.length) * 100);\n sendProgress(progress, savedCount);\n lastProgressUpdate = now;\n }\n } catch (error) {\n console.error(`Error processing ${bookmark.url}:`, error.message);\n }\n };\n\n for (const bookmark of bookmarksToProcess) {\n const promise = handleBookmark(bookmark);\n\n active.add(promise);\n promise.finally(() => active.delete(promise));\n\n if (active.size >= MAX_CONCURRENT) {\n await Promise.race(active);\n }\n\n if (batch.length >= BATCH_SIZE) {\n const itemsToSave = batch.splice(0, batch.length);\n await bookmarkStorage.createMany(itemsToSave);\n savedCount += itemsToSave.length;\n console.log(`Saved batch: ${itemsToSave.length}, total: ${savedCount}`);\n }\n }\n\n await Promise.all(active);\n if (batch.length > 0) {\n await bookmarkStorage.createMany(batch);\n savedCount += batch.length;\n console.log(`Saved final batch: ${batch.length}, total: ${savedCount}`);\n }\n\n const idbIds = await bookmarkStorage.getAllIds();\n const toDelete = idbIds.filter((id) => !browserIds.has(id));\n if (toDelete.length > 0) {\n console.log(`Removing ${toDelete.length} outdated bookmarks`);\n await bookmarkStorage.removeByIds(toDelete);\n }\n\n await refreshAttributes();\n await browser.storage.session.set({ status: true });\n sendProgress(100, savedCount);\n\n console.timeEnd('Sync time');\n console.log(`Saved: ${savedCount}`);\n};\n\nexport default sync;\n" }, { "path": "src/index.html", "content": "\n\n\n\n \n \n \n \n \n \n \n \n FavBox\n \n \n\n\n\n

FavBox

\n\n\n" }, { "path": "src/parser/metadata.js", "content": "import { parseHTML } from 'linkedom';\nimport { extractTitle, extractTags } from '@/services/tags';\n\n/**\n * Class for parsing bookmark metadata from HTML documents.\n */\nexport default class MetadataParser {\n #bookmark;\n\n #httpResponse;\n\n #dom;\n\n #folders;\n\n /**\n * Creates an instance of MetadataParser.\n * @param {object} bookmark - The bookmark object from browser.\n * @param {object} httpResponse - The HTTP response object containing HTML.\n * @param {Map} [folders] - Cache map of folder IDs to names.\n */\n constructor(bookmark, httpResponse, folders = new Map()) {\n const { document } = parseHTML(httpResponse.html);\n this.#bookmark = bookmark;\n this.#dom = document;\n this.#httpResponse = httpResponse;\n this.#folders = folders;\n }\n\n /**\n * Retrieves the title from various sources in the HTML document.\n * @returns {string} The document title, or an empty string if not found.\n */\n getTitle() {\n // Check if bookmark title is empty or whitespace\n if (!this.#bookmark.title?.trim()) {\n // Try document title first\n if (this.#dom.title) {\n return this.#dom.title;\n }\n const metaSelectors = [\n 'meta[property=\"og:title\"]',\n 'meta[name=\"twitter:title\"]',\n ];\n for (const selector of metaSelectors) {\n const element = this.#dom.querySelector(selector);\n if (element?.getAttribute('content')) {\n return element.getAttribute('content');\n }\n }\n const headingSelectors = ['h1', 'h2'];\n for (const selector of headingSelectors) {\n const element = this.#dom.querySelector(selector);\n if (element?.textContent?.trim()) {\n return element.textContent.trim();\n }\n }\n return '';\n }\n return this.#bookmark.title;\n }\n\n /**\n * Retrieves the description from various meta tags in the HTML document.\n * @returns {string|null} The document description, or null if not found.\n */\n getDescription() {\n const selectors = [\n 'meta[property=\"og:description\"]',\n 'meta[name=\"twitter:description\"]',\n 'meta[name=\"description\"]',\n ];\n\n for (const selector of selectors) {\n const element = this.#dom.querySelector(selector);\n if (element) {\n return element.getAttribute('content') ?? null;\n }\n }\n\n return null;\n }\n\n /**\n * Searches for preview image on the page.\n * @returns {string|null} The image URL, or null if not found.\n * @private\n */\n #searchPagePreview() {\n const htmlElem = this.#dom.querySelector([\n 'img[class*=\"hero\"]',\n 'img[class*=\"banner\"]',\n 'img[class*=\"cover\"]',\n 'img[class*=\"featured\"]',\n 'img[class*=\"preview\"]',\n 'img[id*=\"post-image\"]',\n 'article img:first-of-type',\n 'main img:first-of-type',\n '.content img:first-of-type',\n ].join(','));\n const src = (htmlElem?.getAttribute('content') || htmlElem?.getAttribute('href') || htmlElem?.getAttribute('src')) ?? null;\n return src;\n }\n\n /**\n * Retrieves the Open Graph/Meta image URL from the HTML document.\n * @returns {string|null} The URL of the Open Graph image, or null if not found.\n * @private\n */\n #getImageFromMeta() {\n const selectors = [\n 'meta[property=\"og:image\"]',\n 'meta[property=\"og:image:url\"]',\n 'meta[property=\"og:image:secure_url\"]',\n 'meta[name=\"twitter:image\"]',\n 'meta[name=\"twitter:image:src\"]',\n 'meta[name=\"image\"]',\n 'meta[name=\"og:image\"]',\n 'link[rel=\"image_src\"]',\n 'link[rel=\"preload\"][as=\"image\"]',\n 'meta[property=\"forem:logo\"]',\n ];\n\n for (const selector of selectors) {\n const element = this.#dom.querySelector(selector);\n if (element) {\n const imageUrl = element.getAttribute('content') || element.getAttribute('href') || element.getAttribute('src') || null;\n if (imageUrl) {\n return imageUrl;\n }\n }\n }\n\n return null;\n }\n\n /**\n * Extracts YouTube video ID from URL.\n * @returns {string|null} The video ID, or null if not found.\n * @private\n */\n #getYouTubeVideoId() {\n const { url } = this.#bookmark;\n if (!url) return null;\n\n // Match various YouTube URL formats\n const patterns = [\n /(?:youtube\\.com\\/watch\\?v=|youtu\\.be\\/|youtube\\.com\\/embed\\/|youtube\\.com\\/v\\/)([^&\\n?#]+)/,\n ];\n\n for (const pattern of patterns) {\n const match = url.match(pattern);\n if (match?.[1]) {\n return match[1];\n }\n }\n\n return null;\n }\n\n /**\n * Retrieves the main image URL from the HTML document.\n * @returns {string|null} The URL of the main image, or null if not found.\n */\n getImage() {\n const videoId = this.#getYouTubeVideoId();\n if (videoId) {\n return `https://img.youtube.com/vi/${videoId}/mqdefault.jpg`;\n }\n\n const metaImage = this.#getImageFromMeta();\n if (metaImage) {\n return new URL(metaImage, this.#bookmark.url).href;\n }\n const src = this.#searchPagePreview();\n return src ? new URL(src, this.#bookmark.url).href : null;\n }\n\n /**\n * Retrieves the domain from the bookmark URL.\n * @returns {string} The domain of the bookmark URL.\n */\n getDomain() {\n return new URL(this.#bookmark.url).hostname.replace(/^www\\./, '');\n }\n\n /**\n * Retrieves the favicon URL from the HTML document.\n * @returns {string} The URL of the favicon or a default favicon URL if not found.\n */\n getFavicon() {\n let link = this.#dom.querySelector('link[rel=\"icon\"][type=\"image/svg+xml\"]')?.getAttribute('href');\n if (!link) {\n link = this.#dom.querySelector('link[rel=\"shortcut icon\"], link[rel=\"icon\"]')?.getAttribute('href');\n }\n return link ? new URL(link, this.#bookmark.url).href : `https://${this.getDomain()}/favicon.ico`;\n }\n\n /**\n * Retrieves the URL of the bookmark.\n * @returns {string} The URL of the bookmark.\n */\n getUrl() {\n return this.#bookmark.url;\n }\n\n /**\n * Retrieves the keywords from the HTML document's meta tags.\n * @returns {string[]} An array of keywords or an empty array if no keywords are found.\n */\n getKeywords() {\n const keywords = this.#dom.querySelector('meta[name=\"keywords\"]')?.getAttribute('content');\n if (!keywords) return [];\n return keywords.split(',').map((keyword) => keyword.trim().toLowerCase()).filter((keyword) => keyword.length > 0);\n }\n\n /**\n * Gets folder name from cache instead of making API call.\n * @returns {string} The folder name or 'Unknown' if not found.\n * @private\n */\n #getFolderName() {\n return this.#folders.get(this.#bookmark.parentId.toString()) || 'Unknown';\n }\n\n /**\n * Builds a bookmark entity for Favbox.\n * @returns {Promise} A promise that resolves to the bookmark entity object.\n */\n async getFavboxBookmark() {\n console.warn(this.getImage());\n const entity = {\n id: this.#bookmark.id,\n folderId: this.#bookmark.parentId,\n folderName: this.#getFolderName(),\n title: extractTitle(this.#bookmark.title),\n description: this.getDescription(),\n favicon: this.getFavicon(),\n image: this.getImage(),\n domain: this.getDomain(),\n keywords: this.getKeywords(),\n url: this.#bookmark.url,\n tags: extractTags(this.#bookmark.title),\n pinned: 0,\n notes: '',\n httpStatus: this.#httpResponse.httpStatus,\n dateAdded: this.#bookmark.dateAdded,\n createdAt: new Date().toISOString(),\n updatedAt: new Date().toISOString(),\n };\n return entity;\n }\n}\n" }, { "path": "src/services/browserBookmarks.js", "content": "/**\n * Counts the total number of bookmarks.\n * @returns {Promise}\n */\nexport async function getBookmarksCount() {\n const tree = await browser.bookmarks.getTree();\n let count = 0;\n const countBookmarks = (nodes) => {\n nodes.forEach((node) => {\n if (node.url) {\n count += 1;\n }\n if (node.children) {\n countBookmarks(node.children);\n }\n });\n };\n countBookmarks(tree);\n return count;\n}\n\n/**\n * Recursively collects all bookmarks from the given node.\n * @param {object} node - The bookmark node.\n * @returns {Array<{id: string, url: string}>}\n */\nexport function getBookmarksFromNode(node) {\n if (!node) {\n return [];\n }\n const items = [];\n if (node.url) {\n items.push({ id: node.id, url: node.url });\n }\n if (node.children) {\n for (const child of node.children) {\n items.push(...getBookmarksFromNode(child));\n }\n }\n return items;\n}\n\n/**\n * Retrieves the tree of all folders with bookmark counts.\n * @returns {Promise>}\n */\nexport async function getFolderTree() {\n const tree = await browser.bookmarks.getTree();\n const buildFolders = (nodes) => nodes\n .filter((node) => node.children && !node.url)\n .map((node) => {\n const children = buildFolders(node.children);\n const ownCount = node.children.filter((n) => n.url).length;\n const childrenCount = children.reduce((sum, c) => sum + c.count, 0);\n return {\n id: node.id,\n label: node.title,\n count: ownCount + childrenCount,\n ...(children.length > 0 && { children }),\n };\n });\n return buildFolders(tree[0].children);\n}\n\n/**\n * Retrieves all browser bookmarks.\n * @yields {browser.bookmarks.BookmarkTreeNode}\n */\nexport async function* getBookmarksIterator() {\n const bookmarksTree = await browser.bookmarks.getTree();\n function* processNode(node) {\n if (node.url) {\n yield node;\n }\n if (node.children) {\n for (const child of node.children) {\n yield* processNode(child);\n }\n }\n }\n for (const rootNode of bookmarksTree) {\n yield* processNode(rootNode);\n }\n}\n\n/**\n * @returns {Promise>}\n */\nexport async function getFoldersMap() {\n const foldersMap = new Map();\n const traverseTree = (nodes) => {\n for (const node of nodes) {\n if (node.children) {\n foldersMap.set(node.id, node.title);\n traverseTree(node.children);\n }\n }\n };\n const tree = await browser.bookmarks.getTree();\n traverseTree(tree);\n return foldersMap;\n}\n" }, { "path": "src/services/hash.js", "content": "export default function hashCode(...str) {\n if (!str.length || !str.every((s) => typeof s === 'string')) {\n return '0';\n }\n const s = str.map((v) => v.trim()).filter((v) => v).join('');\n if (!s) {\n return '0';\n }\n let h = 0;\n for (let i = 0; i < s.length; i++) {\n h = Math.imul(31, h) + s.charCodeAt(i) | 0;\n }\n return Math.abs(h).toString();\n}\n" }, { "path": "src/services/httpClient.js", "content": "import { HTTP_STATUS } from '@/constants/httpStatus';\n\n/**\n * Makes an HTTP GET request with a timeout.\n * @param {string} url - The URL to fetch.\n * @param {number} [timeout] - Timeout in milliseconds (default: 20000).\n * @returns {Promise<{html: string|null, httpStatus: number}>}\n */\nexport async function fetchUrl(url, timeout = 20000) {\n const controller = new AbortController();\n const id = setTimeout(() => controller.abort(), timeout);\n try {\n const response = await fetch(url, {\n method: 'GET',\n mode: 'cors',\n redirect: 'follow',\n signal: controller.signal,\n });\n const text = await response.text();\n return {\n html: response.ok ? text : null,\n httpStatus: response.status,\n };\n } catch (e) {\n const errorCode = e.name === 'AbortError' ? HTTP_STATUS.REQUEST_TIMEOUT : HTTP_STATUS.UNKNOWN_ERROR;\n return {\n httpStatus: errorCode,\n html: null,\n };\n } finally {\n clearTimeout(id);\n }\n}\n\n/**\n * Makes a HEAD HTTP request with a timeout.\n * @param {string} url - The URL to make HEAD request to.\n * @param {number} [timeout] - Timeout in milliseconds (default: 20000).\n * @returns {Promise} The HTTP status code or error code (REQUEST_TIMEOUT, UNKNOWN_ERROR).\n */\nexport async function fetchHead(url, timeout = 20000) {\n const controller = new AbortController();\n const id = setTimeout(() => controller.abort(), timeout);\n try {\n const response = await fetch(url, {\n method: 'HEAD',\n mode: 'cors',\n redirect: 'follow',\n signal: controller.signal,\n });\n return response.status;\n } catch (e) {\n const errorCode = e.name === 'AbortError' ? HTTP_STATUS.REQUEST_TIMEOUT : HTTP_STATUS.UNKNOWN_ERROR;\n return errorCode;\n } finally {\n clearTimeout(id);\n }\n}\n" }, { "path": "src/services/tags.js", "content": "/**\n * Joins a title and tags into a single string.\n * @param {string} title\n * @param {Array} tags\n * @returns {string}\n */\nexport function joinTitleAndTags(title, tags = []) {\n const filteredTags = (tags || []).filter(Boolean);\n if (filteredTags.length === 0) {\n return title || '';\n }\n return `${title || ''} ${String.fromCodePoint(0x1f3f7)} ${filteredTags.map((tag) => `#${tag}`).join(' ')}`;\n}\n\n/**\n * Extracts the title from a string that may contain tags.\n * @param {string} string\n * @returns {string} The extracted title.\n */\nexport function extractTitle(string) {\n if (!string) return '';\n return string.split(String.fromCodePoint(0x1f3f7))[0]?.trim() || '';\n}\n\n/**\n * Extracts tags from a string.\n * @param {string} string\n * @returns {Array} An array of extracted tags.\n */\nexport function extractTags(string) {\n if (!string) return [];\n const parts = string.split(String.fromCodePoint(0x1f3f7)).map((part) => part.trim());\n if (parts.length < 2 || parts[1].length === 0) {\n return [];\n }\n return parts[1]\n .split(/(?=#)/)\n .map((tag) => tag.trim().replace(/^#/, ''))\n .filter((tag) => tag && tag.length > 0 && !/^\\uFE0F+$/.test(tag));\n}\n" }, { "path": "src/storage/attribute.js", "content": "import hashCode from '@/services/hash';\nimport useConnection from './idb/connection';\n\nexport default class AttributeStorage {\n async search(includes, sortColumn = 'count', sortDirection = 'desc', term = '', skip = 0, limit = 200) {\n const connection = await useConnection();\n const whereConditions = {};\n const keys = Object.entries(includes).reduce((acc, [key, value]) => {\n if (value === true) {\n acc.push(key);\n }\n return acc;\n }, []);\n\n if (keys.length === 0) {\n return [];\n }\n Object.assign(whereConditions, { key: { in: keys } });\n Object.assign(whereConditions, term ? { value: { like: `%${term}%` } } : {});\n\n return connection.select({\n from: 'attributes',\n where: Object.keys(whereConditions).length === 0 ? null : whereConditions,\n // distinct: true,\n skip,\n limit,\n order: {\n by: sortColumn,\n type: sortDirection,\n },\n });\n }\n\n async filterByKeyAndValue(key, value, skip, limit = 50) {\n const connection = await useConnection();\n const whereConditions = [{ key }];\n if (value) {\n whereConditions.push({\n value: { like: `%${value}%` },\n });\n }\n return connection.select({\n from: 'attributes',\n distinct: true,\n limit,\n skip,\n where: whereConditions,\n order: {\n by: 'value',\n type: 'asc',\n },\n });\n }\n\n getAttributesFromBookmark(bookmark) {\n const { domain = '', tags = [], keywords = [] } = bookmark;\n const isValid = (v) => typeof v === 'string' && v.trim().length > 0;\n return [\n isValid(domain) && { key: 'domain', value: domain.trim(), id: hashCode('domain', domain.trim()) },\n ...tags.filter(isValid).map((tag) => ({ key: 'tag', value: tag.trim(), id: hashCode('tag', tag.trim()) })),\n ...keywords.filter(isValid).map((keyword) => ({ key: 'keyword', value: keyword.trim(), id: hashCode('keyword', keyword.trim()) })),\n ].filter(Boolean);\n }\n\n async create(bookmark) {\n const connection = await useConnection();\n const allAttributes = this.getAttributesFromBookmark(bookmark);\n if (allAttributes.length === 0) return;\n const existing = await connection.select({\n from: 'attributes',\n where: { id: { in: allAttributes.map((attr) => attr.id) } },\n });\n const existingMap = new Map(existing.map((r) => [r.id, r.count || 0]));\n const updatedAttributes = allAttributes.map((attr) => ({\n ...attr,\n count: (existingMap.get(attr.id) || 0) + 1,\n }));\n await connection.insert({\n into: 'attributes',\n upsert: true,\n values: updatedAttributes,\n skipDataCheck: true,\n });\n }\n\n async remove(bookmark) {\n console.log('AttributeStorage.remove', bookmark);\n const connection = await useConnection();\n const allAttributes = this.getAttributesFromBookmark(bookmark);\n\n if (allAttributes.length === 0) return;\n\n const ids = allAttributes.map((attr) => attr.id);\n console.log(ids);\n const existing = await connection.select({\n from: 'attributes',\n where: { id: { in: ids } },\n });\n\n const toDelete = [];\n const toUpdate = [];\n\n existing.forEach((record) => {\n const newCount = (record.count || 0) - 1;\n\n if (newCount <= 0) {\n toDelete.push(record.id);\n } else {\n toUpdate.push({\n ...record,\n count: newCount,\n });\n }\n });\n\n if (toDelete.length > 0) {\n await connection.remove({\n from: 'attributes',\n where: { id: { in: toDelete } },\n });\n }\n\n if (toUpdate.length > 0) {\n await connection.insert({\n into: 'attributes',\n upsert: true,\n values: toUpdate,\n });\n }\n }\n\n /**\n * Update attributes when bookmark changes.\n * Removes old attributes and adds new ones incrementally.\n * @param {object} newBookmark - Updated bookmark\n * @param {object} oldBookmark - Previous bookmark state\n */\n async update(newBookmark, oldBookmark) {\n if (oldBookmark) {\n await this.remove(oldBookmark);\n }\n await this.create(newBookmark);\n }\n\n /**\n * Refresh attributes from aggregated data.\n * @param {Array} domains - Array of {field: 'domain', value: string, count: number}\n * @param {Array} tags - Array of {field: 'tags', value: string, count: number}\n * @param {Array} keywords - Array of {field: 'keywords', value: string, count: number}\n * @param {boolean} truncate - Whether to clear existing attributes before inserting\n */\n async refreshFromAggregated(domains = [], tags = [], keywords = [], truncate = true) {\n const connection = await useConnection();\n\n const toAttribute = (key, { value, count }) => ({\n key,\n value: String(value).trim(),\n id: hashCode(key, String(value).trim()),\n count,\n });\n\n const attributes = [\n ...domains.map((r) => toAttribute('domain', r)),\n ...tags.map((r) => toAttribute('tag', r)),\n ...keywords.map((r) => toAttribute('keyword', r)),\n ];\n\n if (truncate) {\n await connection.clear('attributes');\n }\n\n if (attributes.length > 0) {\n await connection.insert({\n into: 'attributes',\n values: attributes,\n validation: false,\n skipDataCheck: true,\n });\n }\n\n return attributes;\n }\n\n async clear() {\n const connection = await useConnection();\n await connection.clear('attributes');\n }\n\n async saveMany(attributes) {\n if (!attributes.length) return;\n const connection = await useConnection();\n await connection.insert({\n into: 'attributes',\n values: attributes,\n validation: false,\n skipDataCheck: true,\n });\n }\n}\n" }, { "path": "src/storage/bookmark.js", "content": "import useConnection from './idb/connection';\n\nexport default class BookmarkStorage {\n async createMany(data) {\n const connection = await useConnection();\n const result = await connection.insert({\n into: 'bookmarks',\n values: data,\n validation: false,\n skipDataCheck: true,\n ignore: true,\n });\n return result;\n }\n\n async findAfterId(id, limit) {\n const connection = await useConnection();\n const query = {\n from: 'bookmarks',\n limit,\n order: { by: 'id', type: 'asc' },\n where: id ? { id: { '>': id } } : null,\n };\n return connection.select(query);\n }\n\n async search(query, skip = 0, limit = 50, sortDirection = 'desc') {\n const connection = await useConnection();\n const queryParams = {};\n const whereConditions = [];\n query.forEach(({ key, value }) => {\n (queryParams[key] ??= []).push(value);\n });\n\n const conditions = [\n { key: 'folder', condition: { folderId: { in: queryParams.folder } } },\n { key: 'tag', condition: { tags: { in: queryParams.tag } } },\n { key: 'domain', condition: { domain: { in: queryParams.domain } } },\n { key: 'keyword', condition: { keywords: { in: queryParams.keyword } } },\n { key: 'id', condition: { id: { in: queryParams.id } } },\n ];\n\n conditions.forEach(({ key, condition }) => {\n if (queryParams[key]) {\n whereConditions.push(condition);\n }\n });\n if (queryParams?.term) {\n const [term] = queryParams.term;\n const regexPattern = term.split(/\\s+/).map((word) => `(?=.*${word})`).join('');\n const regex = new RegExp(`^${regexPattern}.*$`, 'i');\n whereConditions.push({\n title: { regex },\n or: {\n description: { regex },\n or: {\n url: { regex },\n or: {\n domain: { like: `%${term}%` },\n or: {\n keywords: { regex },\n },\n },\n },\n },\n });\n }\n if (queryParams?.dateAdded?.[0]) {\n const [startStr, endStr] = queryParams.dateAdded[0].split('~');\n const low = new Date(startStr).setHours(0, 0, 0, 0);\n const high = new Date(endStr).setHours(23, 59, 59, 999);\n whereConditions.push({\n dateAdded: { '-': { low, high } },\n });\n }\n return connection.select({\n from: 'bookmarks',\n distinct: true,\n limit,\n skip,\n order: {\n by: 'dateAdded',\n type: sortDirection,\n },\n where: whereConditions.length === 0 ? null : whereConditions,\n });\n }\n\n async total() {\n const connection = await useConnection();\n return connection.count({\n from: 'bookmarks',\n });\n }\n\n async create(entity) {\n const connection = await useConnection();\n return connection.insert({\n into: 'bookmarks',\n values: [entity],\n });\n }\n\n async updateHttpStatusById(id, status) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n httpStatus: parseInt(status, 10),\n updatedAt: new Date().toISOString(),\n },\n where: {\n id,\n },\n });\n }\n\n async setOK() {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: { httpStatus: 200 },\n });\n }\n\n async findPinned(skip = 0, limit = 50, term = '') {\n const connection = await useConnection();\n const whereConditions = [{ pinned: 1 }];\n if (term) {\n const regexPattern = term.split(/\\s+/).map((word) => `(?=.*${word})`).join('');\n const regex = new RegExp(`^${regexPattern}.*$`, 'i');\n whereConditions.push({\n notes: { regex },\n or: {\n title: { regex },\n or: {\n description: { regex },\n or: {\n domain: { like: `%${term}%` },\n },\n },\n },\n });\n }\n return connection.select({\n from: 'bookmarks',\n limit,\n skip,\n order: {\n by: 'updatedAt',\n type: 'desc',\n },\n where: whereConditions,\n });\n }\n\n async updatePinStatusById(id, status) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n pinned: parseInt(status, 10),\n updatedAt: new Date().toISOString(),\n },\n where: {\n id,\n },\n });\n }\n\n async update(id, data) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: data,\n where: {\n id,\n },\n });\n }\n\n async removeByIds(ids) {\n const connection = await useConnection();\n const result = await connection.remove({\n from: 'bookmarks',\n where: {\n id: {\n in: ids,\n },\n },\n });\n return result;\n }\n\n async removeById(id) {\n const connection = await useConnection();\n return connection.remove({\n from: 'bookmarks',\n where: { id },\n });\n }\n\n async getIds(ids) {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n where: {\n id: {\n in: ids,\n },\n },\n });\n return response.map((i) => i.id);\n }\n\n async getByFolderId(folderId) {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n limit: 1,\n where: {\n folderId,\n },\n });\n\n return response.length === 1 ? response.shift() : null;\n }\n\n async updateBookmarksFolderName(folderId, folderName) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n folderName,\n updatedAt: new Date().toISOString(),\n },\n where: {\n folderId,\n },\n });\n }\n\n async getById(id) {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n limit: 1,\n where: {\n id,\n },\n });\n\n return response.length === 1 ? response.shift() : null;\n }\n\n async getByUrl(url) {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n limit: 1,\n where: {\n url: String(url),\n },\n });\n\n return response.length === 1 ? response.shift() : null;\n }\n\n async getTags() {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n flatten: ['tags'],\n groupBy: 'tags',\n order: {\n by: 'tags',\n type: 'asc',\n },\n });\n return response.map((item) => item.tags);\n }\n\n async updateStatusByIds(status, ids) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n httpStatus: status,\n },\n where: {\n id: {\n in: ids,\n },\n },\n });\n }\n\n async updateNotesById(id, notes) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n notes,\n updatedAt: new Date().toISOString(),\n },\n where: {\n id,\n },\n });\n }\n\n async updateImageById(id, image) {\n const connection = await useConnection();\n return connection.update({\n in: 'bookmarks',\n set: {\n image,\n },\n where: {\n id,\n },\n });\n }\n\n async findByHttpStatus(statuses, skip = 0, limit = 50) {\n const connection = await useConnection();\n return connection.select({\n from: 'bookmarks',\n limit,\n skip,\n order: {\n by: 'id',\n type: 'desc',\n },\n where: {\n httpStatus: {\n in: statuses,\n },\n },\n });\n }\n\n async getTotalByHttpStatus(statuses) {\n const connection = await useConnection();\n return connection.count({\n from: 'bookmarks',\n where: {\n httpStatus: {\n in: statuses,\n },\n },\n });\n }\n\n async getAllIds() {\n const connection = await useConnection();\n const response = await connection.select({\n from: 'bookmarks',\n columns: ['id'],\n });\n return response.map((i) => i.id);\n }\n\n async getDuplicatesGrouped(skip = 0, limit = 50) {\n const connection = await useConnection();\n\n // Get all URLs with the number of duplicates\n const groupedResults = await connection.select({\n from: 'bookmarks',\n groupBy: 'url',\n aggregate: {\n count: ['id'],\n },\n });\n\n // Filter only groups with duplicates (2+ bookmarks)\n const duplicateGroups = groupedResults.filter((group) => group['count(id)'] > 1);\n\n // Sort by url (alphabetically)\n duplicateGroups.sort((a, b) => String(a.url).localeCompare(String(b.url)));\n\n // Apply pagination\n const paginatedGroups = duplicateGroups.slice(skip, skip + limit);\n\n // Get all bookmarks for the current page in one query\n const urls = paginatedGroups.map((group) => group.url);\n const allBookmarks = await connection.select({\n from: 'bookmarks',\n where: { url: { in: urls } },\n order: {\n by: 'dateAdded',\n type: 'desc',\n },\n });\n\n // Group bookmarks by URL\n const bookmarksByUrl = Object.groupBy(allBookmarks, (b) => b.url);\n\n // Form the result\n const groupsWithDetails = paginatedGroups.map((group) => {\n const bookmarks = bookmarksByUrl[group.url] || [];\n return {\n url: group.url,\n bookmarks,\n count: group['count(id)'],\n firstAdded: bookmarks[bookmarks.length - 1], // Oldest\n lastAdded: bookmarks[0], // Newest\n };\n });\n\n return {\n groups: groupsWithDetails,\n total: duplicateGroups.length,\n hasMore: skip + limit < duplicateGroups.length,\n };\n }\n\n async aggregateByField(field, flatten = false) {\n const connection = await useConnection();\n const query = {\n from: 'bookmarks',\n groupBy: field,\n aggregate: { count: ['id'] },\n };\n if (flatten) query.flatten = [field];\n\n const rows = await connection.select(query);\n return rows\n .filter((r) => r[field])\n .map((r) => ({ field, value: r[field], count: r['count(id)'] }));\n }\n\n async aggregateDomains() {\n return this.aggregateByField('domain');\n }\n\n async aggregateTags() {\n return this.aggregateByField('tags', true);\n }\n\n async aggregateKeywords() {\n return this.aggregateByField('keywords', true);\n }\n}\n" }, { "path": "src/storage/idb/connection.js", "content": "/* eslint-disable import/extensions */\n/* eslint-disable import/no-unresolved */\n/* eslint-disable new-cap */\nimport { Connection, DATA_TYPE } from 'jsstore';\nimport workerInjector from 'jsstore/dist/worker_injector';\nimport jsstoreWorker from 'jsstore/dist/jsstore.worker.min.js?worker';\n\nlet connection = null;\nlet isDbInitialized = false;\n\nconst createConnection = () => {\n if (typeof Worker === 'undefined') {\n connection = new Connection();\n connection.addPlugin(workerInjector);\n console.warn('Web Worker is not supported.');\n } else {\n console.warn('Web Worker is supported.');\n\n connection = new Connection(new jsstoreWorker());\n }\n if (import.meta.env.DEV) {\n console.warn('DEV MODE');\n connection.logStatus = true;\n }\n};\n\n// using string for primary key to save compatible between Firefox and Chrome\nconst getDb = () => {\n const tblBookmarks = {\n name: 'bookmarks',\n columns: {\n id: {\n primaryKey: true,\n autoIncrement: false,\n dataType: DATA_TYPE.String,\n },\n folderId: {\n dataType: DATA_TYPE.String,\n enableSearch: true,\n notNull: false,\n },\n folderName: {\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n title: {\n notNull: true,\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n description: {\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n domain: {\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n url: {\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n favicon: {\n dataType: DATA_TYPE.String,\n enableSearch: false,\n },\n keywords: {\n dataType: DATA_TYPE.Array,\n multiEntry: true,\n default: [],\n enableSearch: true,\n },\n image: {\n dataType: DATA_TYPE.String,\n enableSearch: false,\n },\n tags: {\n dataType: DATA_TYPE.Array,\n multiEntry: true,\n default: [],\n enableSearch: true,\n },\n pinned: {\n notNull: true,\n dataType: DATA_TYPE.Number,\n default: 0,\n },\n notes: {\n dataType: DATA_TYPE.String,\n notNull: false,\n },\n httpStatus: {\n notNull: true,\n dataType: DATA_TYPE.Number,\n default: 200,\n },\n createdAt: {\n dataType: DATA_TYPE.String,\n notNull: true,\n enableSearch: true,\n },\n updatedAt: {\n dataType: DATA_TYPE.String,\n notNull: true,\n enableSearch: true,\n },\n dateAdded: {\n notNull: true,\n dataType: DATA_TYPE.Number,\n enableSearch: true,\n },\n },\n };\n\n const tblAttributes = {\n name: 'attributes',\n columns: {\n id: {\n primaryKey: true,\n autoIncrement: false,\n dataType: DATA_TYPE.String,\n },\n key: {\n notNull: true,\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n value: {\n notNull: true,\n dataType: DATA_TYPE.String,\n enableSearch: true,\n },\n count: {\n notNull: true,\n dataType: DATA_TYPE.Number,\n enableSearch: true,\n },\n },\n };\n\n const database = {\n name: 'favbox_database_v2',\n tables: [tblBookmarks, tblAttributes],\n };\n return database;\n};\n\nconst useConnection = async () => {\n if (!connection) {\n createConnection();\n }\n\n if (!isDbInitialized) {\n await connection.initDb(getDb());\n isDbInitialized = true;\n }\n\n return connection;\n};\n\nexport default useConnection;\n" }, { "path": "tests/integration/fetch.spec.js", "content": "import { describe, expect, it } from 'vitest';\nimport { fetchUrl, fetchHead } from '@/services/httpClient';\nimport { HTTP_STATUS } from '@/constants/httpStatus';\n\ndescribe('HTTP Client', () => {\n it('fetch', async () => {\n const result = await fetchUrl('https://jsonplaceholder.typicode.com/posts/1');\n expect(result.httpStatus).toEqual(HTTP_STATUS.OK);\n expect(result.html).toBeTypeOf('string');\n });\n\n it('fetch with timeout', async () => {\n const result = await fetchUrl('https://jsonplaceholder.typicode.com/posts/1', 1);\n expect(result.httpStatus).toEqual(HTTP_STATUS.REQUEST_TIMEOUT);\n });\n\n it('head', async () => {\n const result = await fetchHead('https://jsonplaceholder.typicode.com/posts/1');\n expect(result).toEqual(HTTP_STATUS.OK);\n });\n\n it('head with timeout', async () => {\n const result = await fetchHead('https://jsonplaceholder.typicode.com/posts/1', 1);\n expect(result).toEqual(HTTP_STATUS.REQUEST_TIMEOUT);\n });\n\n it('head with bad request', async () => {\n const result = await fetchHead('https://jsonplaceholder.typicode.com/posts/1/123');\n expect(result).toEqual(HTTP_STATUS.NOT_FOUND);\n });\n});\n" }, { "path": "tests/unit/browserBookmarks.spec.js", "content": "import {\n getBookmarksCount,\n getBookmarksFromNode,\n getFolderTree,\n getFoldersMap,\n getBookmarksIterator,\n} from '@/services/browserBookmarks';\nimport { describe, expect, it, vi, beforeEach } from 'vitest';\nimport browser from 'webextension-polyfill';\n\nvi.mock('webextension-polyfill', () => ({\n default: {\n bookmarks: {\n getTree: vi.fn(),\n },\n },\n}));\nconst mockGetTree = vi.mocked(browser.bookmarks.getTree);\n\ndescribe('browserBookmarks', () => {\n beforeEach(() => {\n vi.clearAllMocks();\n mockGetTree.mockClear();\n });\n\n describe('getBookmarksCount', () => {\n it('should count bookmarks in tree', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n { id: '3', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n },\n {\n id: '4',\n title: 'Folder 2',\n children: [\n { id: '5', title: 'Bookmark 3', url: 'https://github.com' },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const count = await getBookmarksCount();\n expect(count).toBe(3);\n });\n\n it('should return 0 for empty tree', async () => {\n mockGetTree.mockResolvedValue([{ id: '0', children: [] }]);\n const count = await getBookmarksCount();\n expect(count).toBe(0);\n });\n\n it('should handle nested folders', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n {\n id: '2',\n title: 'Subfolder',\n children: [\n { id: '3', title: 'Bookmark 1', url: 'https://example.com' },\n ],\n },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n const count = await getBookmarksCount();\n expect(count).toBe(1);\n });\n });\n\n describe('getBookmarksFromNode', () => {\n it('should extract bookmarks from node', () => {\n const node = {\n id: '1',\n title: 'Folder',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n { id: '3', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n };\n const bookmarks = getBookmarksFromNode(node);\n expect(bookmarks).toHaveLength(2);\n expect(bookmarks[0]).toEqual({ id: '2', url: 'https://example.com' });\n expect(bookmarks[1]).toEqual({ id: '3', url: 'https://google.com' });\n });\n\n it('should handle node with url (bookmark itself)', () => {\n const node = {\n id: '1',\n title: 'Bookmark',\n url: 'https://example.com',\n };\n const bookmarks = getBookmarksFromNode(node);\n expect(bookmarks).toHaveLength(1);\n expect(bookmarks[0]).toEqual({ id: '1', url: 'https://example.com' });\n });\n\n it('should return empty array for null node', () => {\n expect(getBookmarksFromNode(null)).toEqual([]);\n });\n\n it('should return empty array for undefined node', () => {\n expect(getBookmarksFromNode(undefined)).toEqual([]);\n });\n\n it('should handle nested folders', () => {\n const node = {\n id: '1',\n title: 'Folder',\n children: [\n {\n id: '2',\n title: 'Subfolder',\n children: [\n { id: '3', title: 'Bookmark 1', url: 'https://example.com' },\n ],\n },\n { id: '4', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n };\n const bookmarks = getBookmarksFromNode(node);\n expect(bookmarks).toHaveLength(2);\n });\n\n it('should ignore folders without url', () => {\n const node = {\n id: '1',\n title: 'Folder',\n children: [\n { id: '2', title: 'Subfolder', children: [] },\n { id: '3', title: 'Bookmark', url: 'https://example.com' },\n ],\n };\n const bookmarks = getBookmarksFromNode(node);\n expect(bookmarks).toHaveLength(1);\n expect(bookmarks[0].id).toBe('3');\n });\n });\n\n describe('getFolderTree', () => {\n it('should build folder tree with counts', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n { id: '3', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n },\n {\n id: '4',\n title: 'Folder 2',\n children: [\n { id: '5', title: 'Bookmark 3', url: 'https://github.com' },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const tree = await getFolderTree();\n expect(tree).toHaveLength(2);\n expect(tree[0]).toMatchObject({\n id: '1',\n label: 'Folder 1',\n count: 2,\n });\n expect(tree[1]).toMatchObject({\n id: '4',\n label: 'Folder 2',\n count: 1,\n });\n });\n\n it('should handle nested folders with correct counts', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n {\n id: '3',\n title: 'Subfolder',\n children: [\n { id: '4', title: 'Bookmark 2', url: 'https://google.com' },\n { id: '5', title: 'Bookmark 3', url: 'https://github.com' },\n ],\n },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const tree = await getFolderTree();\n expect(tree).toHaveLength(1);\n expect(tree[0].count).toBe(3); // 1 direct + 2 from subfolder\n expect(tree[0].children).toHaveLength(1);\n expect(tree[0].children[0].count).toBe(2);\n });\n\n it('should filter out bookmarks (only folders)', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n { id: '1', title: 'Bookmark 1', url: 'https://example.com' },\n {\n id: '2',\n title: 'Folder',\n children: [\n { id: '3', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const tree = await getFolderTree();\n expect(tree).toHaveLength(1);\n expect(tree[0].id).toBe('2');\n });\n\n it('should not include children property when folder has no subfolders', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const tree = await getFolderTree();\n expect(tree[0].children).toBeUndefined();\n });\n });\n\n describe('getFoldersMap', () => {\n it('should create map of folder ids to titles', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark', url: 'https://example.com' },\n ],\n },\n {\n id: '3',\n title: 'Folder 2',\n children: [],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const map = await getFoldersMap();\n expect(map).toBeInstanceOf(Map);\n expect(map.get('1')).toBe('Folder 1');\n expect(map.get('3')).toBe('Folder 2');\n });\n\n it('should handle nested folders', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n {\n id: '2',\n title: 'Subfolder',\n children: [],\n },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const map = await getFoldersMap();\n expect(map.get('1')).toBe('Folder 1');\n expect(map.get('2')).toBe('Subfolder');\n });\n });\n\n describe('getBookmarksIterator', () => {\n it('should iterate over all bookmarks', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder 1',\n children: [\n { id: '2', title: 'Bookmark 1', url: 'https://example.com' },\n { id: '3', title: 'Bookmark 2', url: 'https://google.com' },\n ],\n },\n { id: '4', title: 'Bookmark 3', url: 'https://github.com' },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const bookmarks = [];\n for await (const bookmark of getBookmarksIterator()) {\n bookmarks.push(bookmark);\n }\n\n expect(bookmarks).toHaveLength(3);\n expect(bookmarks[0].id).toBe('2');\n expect(bookmarks[1].id).toBe('3');\n expect(bookmarks[2].id).toBe('4');\n });\n\n it('should handle empty tree', async () => {\n mockGetTree.mockResolvedValue([{ id: '0', children: [] }]);\n\n const bookmarks = [];\n for await (const bookmark of getBookmarksIterator()) {\n bookmarks.push(bookmark);\n }\n\n expect(bookmarks).toHaveLength(0);\n });\n\n it('should handle nested folders', async () => {\n const mockTree = [\n {\n id: '0',\n children: [\n {\n id: '1',\n title: 'Folder',\n children: [\n {\n id: '2',\n title: 'Subfolder',\n children: [\n { id: '3', title: 'Bookmark', url: 'https://example.com' },\n ],\n },\n ],\n },\n ],\n },\n ];\n mockGetTree.mockResolvedValue(mockTree);\n\n const bookmarks = [];\n for await (const bookmark of getBookmarksIterator()) {\n bookmarks.push(bookmark);\n }\n\n expect(bookmarks).toHaveLength(1);\n expect(bookmarks[0].id).toBe('3');\n });\n });\n});\n" }, { "path": "tests/unit/hash.spec.js", "content": "import { describe, expect, it } from 'vitest';\nimport hashCode from '@/services/hash';\n\ndescribe('hashCode', () => {\n it('should generate hash for single string', () => {\n const hash = hashCode('test');\n expect(hash).toBeTypeOf('string');\n expect(hash).not.toBe('0');\n });\n\n it('should generate same hash for same input', () => {\n const hash1 = hashCode('domain', 'example.com');\n const hash2 = hashCode('domain', 'example.com');\n expect(hash1).toBe(hash2);\n });\n\n it('should generate different hash for different inputs', () => {\n const hash1 = hashCode('domain', 'example.com');\n const hash2 = hashCode('domain', 'google.com');\n expect(hash1).not.toBe(hash2);\n });\n\n it('should generate different hash for different keys with same value', () => {\n const hash1 = hashCode('domain', 'test');\n const hash2 = hashCode('tag', 'test');\n expect(hash1).not.toBe(hash2);\n });\n\n it('should concatenate multiple strings', () => {\n const hash1 = hashCode('domain', 'example.com');\n const hash2 = hashCode('domainexample.com');\n expect(hash1).toBe(hash2);\n });\n\n it('should trim whitespace from strings', () => {\n const hash1 = hashCode('domain', 'example.com');\n const hash2 = hashCode('domain', ' example.com ');\n expect(hash1).toBe(hash2);\n });\n\n it('should filter out empty strings', () => {\n const hash1 = hashCode('domain', 'example.com');\n const hash2 = hashCode('domain', '', 'example.com', '');\n expect(hash1).toBe(hash2);\n });\n\n it('should return \"0\" for empty string', () => {\n expect(hashCode('')).toBe('0');\n });\n\n it('should return \"0\" for array of empty strings', () => {\n expect(hashCode('', '', '')).toBe('0');\n });\n\n it('should return \"0\" for no arguments', () => {\n expect(hashCode()).toBe('0');\n });\n\n it('should return \"0\" for non-string arguments', () => {\n expect(hashCode(123)).toBe('0');\n expect(hashCode(null)).toBe('0');\n expect(hashCode(undefined)).toBe('0');\n expect(hashCode({})).toBe('0');\n expect(hashCode([])).toBe('0');\n });\n\n it('should return \"0\" for mixed string and non-string arguments', () => {\n expect(hashCode('test', 123)).toBe('0');\n expect(hashCode('test', null)).toBe('0');\n expect(hashCode('test', undefined)).toBe('0');\n });\n\n it('should handle special characters', () => {\n const hash = hashCode('tag', 'test-tag_123');\n expect(hash).toBeTypeOf('string');\n expect(hash).not.toBe('0');\n });\n\n it('should handle unicode characters', () => {\n const hash = hashCode('tag', 'тСст');\n expect(hash).toBeTypeOf('string');\n expect(hash).not.toBe('0');\n });\n\n it('should always return positive number as string', () => {\n const hash = hashCode('test');\n expect(parseInt(hash, 10)).toBeGreaterThanOrEqual(0);\n });\n});\n" }, { "path": "tests/unit/metadataParser.spec.js", "content": "import { describe, expect, it, beforeEach } from 'vitest';\nimport MetadataParser from '@/parser/metadata';\n\ndescribe('MetadataParser', () => {\n let mockBookmark;\n let mockFolders;\n\n beforeEach(() => {\n mockBookmark = {\n id: '123',\n title: 'Test Bookmark',\n url: 'https://example.com',\n parentId: '1',\n dateAdded: Date.now(),\n };\n\n mockFolders = new Map([\n ['1', 'Test Folder'],\n ['2', 'Another Folder'],\n ]);\n });\n\n describe('constructor', () => {\n it('should create instance with all required parameters', () => {\n const parser = new MetadataParser(mockBookmark, { html: '' }, mockFolders);\n expect(parser).toBeInstanceOf(MetadataParser);\n });\n });\n\n describe('getTitle', () => {\n it('should return bookmark title when available', () => {\n const parser = new MetadataParser({ title: 'Test Bookmark' }, { html: '' });\n expect(parser.getTitle()).toBe('Test Bookmark');\n });\n\n it('should fallback to document title when bookmark title is empty', () => {\n const html = `\n \n \n \n Example Page Title\n \n \n \n

Main Heading

\n \n \n `;\n const parser = new MetadataParser({ title: '' }, { html });\n expect(parser.getTitle()).toBe('Example Page Title');\n });\n\n it('should fallback to og:title when document title is empty', () => {\n const html = `\n \n \n \n \n \n \n

Main Heading

\n \n \n `;\n const parser = new MetadataParser({ title: '' }, { html });\n expect(parser.getTitle()).toBe('OG Title');\n });\n\n it('should fallback to h1 when meta titles are empty', () => {\n const html = `\n \n \n \n \n

Main Heading

\n \n \n `;\n const parser = new MetadataParser({ title: '' }, { html });\n expect(parser.getTitle()).toBe('Main Heading');\n });\n\n it('should return empty string when no title is found', () => {\n const html = '';\n const parser = new MetadataParser({ title: '' }, { html });\n expect(parser.getTitle()).toBe('');\n });\n });\n\n describe('getDescription', () => {\n it('should return first available description (og:description in this case)', () => {\n const html = `\n \n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({}, { html });\n expect(parser.getDescription()).toBe('OG Description');\n });\n\n it('should fallback to meta description when og:description is not available', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({}, { html });\n expect(parser.getDescription()).toBe('This is a test description');\n });\n\n it('should return null when no description is found', () => {\n const html = '';\n const parser = new MetadataParser({}, { html });\n expect(parser.getDescription()).toBeNull();\n });\n });\n\n describe('getImage', () => {\n it('should return og:image when available', () => {\n const html = `\n \n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getImage()).toBe('https://example.com/image.jpg');\n });\n\n it('should fallback to page preview when og:image is not available', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getImage()).toBe('https://example.com/hero.jpg');\n });\n\n it('should return null when no image is found', () => {\n const html = '';\n const parser = new MetadataParser({}, { html });\n expect(parser.getImage()).toBeNull();\n });\n\n it('should resolve relative URLs to absolute', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getImage()).toBe('https://example.com/relative-image.jpg');\n });\n\n it('should return YouTube thumbnail for youtube.com/watch URL', () => {\n const html = '';\n const parser = new MetadataParser({ url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ' }, { html });\n expect(parser.getImage()).toBe('https://img.youtube.com/vi/dQw4w9WgXcQ/mqdefault.jpg');\n });\n\n it('should return YouTube thumbnail for youtu.be URL', () => {\n const html = '';\n const parser = new MetadataParser({ url: 'https://youtu.be/dQw4w9WgXcQ' }, { html });\n expect(parser.getImage()).toBe('https://img.youtube.com/vi/dQw4w9WgXcQ/mqdefault.jpg');\n });\n\n it('should handle YouTube URL with additional parameters', () => {\n const html = '';\n const parser = new MetadataParser({ url: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=42s&feature=share' }, { html });\n expect(parser.getImage()).toBe('https://img.youtube.com/vi/dQw4w9WgXcQ/mqdefault.jpg');\n });\n });\n\n describe('getDomain', () => {\n it('should extract domain from URL', () => {\n const parser = new MetadataParser({ url: 'https://example.com' }, { html: '' });\n expect(parser.getDomain()).toBe('example.com');\n });\n\n it('should remove www prefix', () => {\n const parser = new MetadataParser({ url: 'https://www.example.com' }, { html: '' });\n expect(parser.getDomain()).toBe('example.com');\n });\n\n it('should handle URLs without protocol by adding https', () => {\n const parser = new MetadataParser({ url: 'https://example.com' }, { html: '' });\n expect(parser.getDomain()).toBe('example.com');\n });\n });\n\n describe('getFavicon', () => {\n it('should return favicon from link tag', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getFavicon()).toBe('https://example.com/favicon.ico');\n });\n\n it('should fallback to default favicon when not found', () => {\n const html = '';\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getFavicon()).toBe('https://example.com/favicon.ico');\n });\n\n it('should prefer SVG favicon over regular favicon', () => {\n const html = `\n \n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({ url: 'https://example.com' }, { html });\n expect(parser.getFavicon()).toBe('https://example.com/favicon.svg');\n });\n });\n\n describe('getKeywords', () => {\n it('should extract keywords from meta tag', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({}, { html });\n expect(parser.getKeywords()).toEqual(['test', 'example', 'bookmark']);\n });\n\n it('should return empty array when no keywords are found', () => {\n const html = '';\n const parser = new MetadataParser({}, { html });\n expect(parser.getKeywords()).toEqual([]);\n });\n\n it('should handle empty keywords content', () => {\n const html = `\n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser({}, { html });\n expect(parser.getKeywords()).toEqual([]);\n });\n });\n\n describe('getUrl', () => {\n it('should return bookmark URL', () => {\n const parser = new MetadataParser({ url: 'https://example.com' }, { html: '' });\n expect(parser.getUrl()).toBe('https://example.com');\n });\n });\n\n describe('getFavboxBookmark', () => {\n it('should return complete bookmark entity', async () => {\n const html = `\n \n \n \n \n \n \n \n \n \n \n `;\n const parser = new MetadataParser(mockBookmark, { html }, mockFolders);\n const entity = await parser.getFavboxBookmark();\n\n expect(entity).toMatchObject({\n id: '123',\n folderId: '1',\n folderName: 'Test Folder',\n title: 'Test Bookmark',\n description: 'OG Description',\n favicon: 'https://example.com/favicon.ico',\n image: 'https://example.com/image.jpg',\n domain: 'example.com',\n keywords: ['test', 'example', 'bookmark'],\n url: 'https://example.com',\n tags: [],\n pinned: 0,\n notes: '',\n httpStatus: undefined,\n dateAdded: mockBookmark.dateAdded,\n });\n\n expect(entity.createdAt).toBeDefined();\n expect(entity.updatedAt).toBeDefined();\n expect(new Date(entity.createdAt)).toBeInstanceOf(Date);\n expect(new Date(entity.updatedAt)).toBeInstanceOf(Date);\n });\n\n it('should use real tag functions for title and tags processing', async () => {\n const html = '';\n const parser = new MetadataParser(mockBookmark, { html }, mockFolders);\n const entity = await parser.getFavboxBookmark();\n\n expect(entity.title).toBe('Test Bookmark');\n expect(entity.tags).toEqual([]);\n });\n\n it('should handle missing folder name', async () => {\n const html = '';\n const emptyFolders = new Map();\n const parser = new MetadataParser(mockBookmark, { html }, emptyFolders);\n const entity = await parser.getFavboxBookmark();\n\n expect(entity.folderName).toBe('Unknown');\n });\n\n it('should handle bookmark with tags in title', async () => {\n const html = '';\n const bookmarkWithTags = { ...mockBookmark, title: `Test Bookmark ${String.fromCodePoint(0x1f3f7)} #tag1 #tag2` };\n const parser = new MetadataParser(bookmarkWithTags, { html }, mockFolders);\n const entity = await parser.getFavboxBookmark();\n\n expect(entity.title).toBe('Test Bookmark');\n expect(entity.tags).toEqual(['tag1', 'tag2']);\n });\n\n it('should handle bookmark with tags but no separator', async () => {\n const html = '';\n const bookmarkWithTagsNoSeparator = { ...mockBookmark, title: 'Test Bookmark #tag1 #tag2' };\n const parser = new MetadataParser(bookmarkWithTagsNoSeparator, { html }, mockFolders);\n const entity = await parser.getFavboxBookmark();\n\n expect(entity.title).toBe('Test Bookmark #tag1 #tag2');\n expect(entity.tags).toEqual([]);\n });\n });\n\n describe('error handling', () => {\n it('should handle malformed HTML gracefully', () => {\n const malformedHtml = 'Test {\n const parser = new MetadataParser({}, { html: '' });\n expect(parser).toBeInstanceOf(MetadataParser);\n });\n });\n});\n" }, { "path": "tests/unit/tagHelper.spec.js", "content": "import { describe, expect, it } from 'vitest';\nimport { joinTitleAndTags, extractTags, extractTitle } from '@/services/tags';\n\ndescribe('TagHelper', () => {\n it('should return title when tags array is empty', () => {\n const title = 'Hello world';\n expect(joinTitleAndTags(title, [])).toEqual(title);\n });\n\n it('should return title with tags', () => {\n expect(joinTitleAndTags('Test', ['tag1'])).toEqual(\n `Test ${String.fromCodePoint(0x1f3f7)} #tag1`,\n );\n });\n\n it('should extract tags from string', () => {\n const string = `πŸ§ͺ PhpStorm Tips & Tricks ${String.fromCodePoint(\n 0x1f3f7,\n )} #php #test`;\n expect(extractTags(string)).toEqual(['php', 'test']);\n });\n\n it('should return empty array if string does not contain separator', () => {\n const string = 'πŸ§ͺ PhpStorm Tips & Tricks #php #test';\n expect(extractTags(string)).toEqual([]);\n });\n\n it('should return title without tags', () => {\n const string = `Some bookmark title ${String.fromCodePoint(\n 0x1f3f7,\n )} #php #js`;\n expect(extractTitle(string)).toEqual('Some bookmark title');\n });\n\n it('should return string with tags containing spaces', () => {\n expect(joinTitleAndTags('Hello world', ['test', 'some tag'])).toEqual(\n `Hello world ${String.fromCodePoint(0x1f3f7)} #test #some tag`,\n );\n });\n\n it('should extract tags with spaces from string', () => {\n expect(\n extractTags(\n `string - test ${String.fromCodePoint(\n 0x1f3f7,\n )} #hello world #qqq #test`,\n ),\n ).toEqual(['hello world', 'qqq', 'test']);\n });\n\n it('should return empty string when input is empty', () => {\n expect(joinTitleAndTags('', [])).toEqual('');\n });\n\n it('should return empty array when extractTags receives empty string', () => {\n expect(extractTags('')).toEqual([]);\n });\n\n it('should return empty array if string has no tags after separator', () => {\n const string = `Test ${String.fromCodePoint(0x1f3f7)}`;\n expect(extractTags(string)).toEqual([]);\n });\n\n it('should return correct title and empty tags if string only contains separator', () => {\n const string = `Hello ${String.fromCodePoint(0x1f3f7)}`;\n expect(extractTitle(string)).toEqual('Hello');\n expect(extractTags(string)).toEqual([]);\n });\n\n it('should handle tags with special characters correctly', () => {\n const string = `Test ${String.fromCodePoint(0x1f3f7)} #tag_one #tag-two #tag.three #tag@four`;\n expect(extractTags(string)).toEqual(['tag_one', 'tag-two', 'tag.three', 'tag@four']);\n });\n\n it('should trim extra spaces around tags', () => {\n const string = ` Test ${String.fromCodePoint(0x1f3f7)} #tag1 #tag2 `;\n expect(extractTags(string)).toEqual(['tag1', 'tag2']);\n });\n\n it('should return title if tags array contains only empty strings', () => {\n expect(joinTitleAndTags('Title', ['', ''])).toEqual('Title');\n });\n\n it('should filter out falsy values from tags array', () => {\n expect(joinTitleAndTags('Title', ['tag1', '', 'tag2', null, undefined])).toEqual(\n `Title ${String.fromCodePoint(0x1f3f7)} #tag1 #tag2`,\n );\n });\n});\n" }, { "path": "vite.config.firefox.js", "content": "import { defineConfig } from 'vite';\nimport vue from '@vitejs/plugin-vue';\nimport { resolve } from 'path';\nimport { crx } from '@crxjs/vite-plugin';\nimport Icons from 'unplugin-icons/vite';\nimport AutoImport from 'unplugin-auto-import/vite';\nimport manifest from './manifest.firefox.json';\n\nexport default defineConfig({\n plugins: [\n vue(),\n crx({ browser: 'firefox', manifest }),\n Icons({\n autoInstall: true,\n }),\n AutoImport({\n imports: [\n {\n 'webextension-polyfill': [['*', 'browser']],\n },\n ],\n }),\n ],\n resolve: {\n alias: {\n '@': resolve(__dirname, 'src'),\n },\n },\n root: resolve(__dirname, 'src'),\n publicDir: resolve(__dirname, 'public'),\n build: {\n outDir: resolve(__dirname, 'dist/firefox'),\n rollupOptions: {\n input: {\n app: '/ext/browser/index.html',\n },\n },\n minify: 'terser',\n sourcemap: false,\n // https://developer.chrome.com/docs/webstore/program_policies/#:~:text=Code%20Readability%20Requirements\n terserOptions: {\n mangle: false,\n compress: {\n drop_console: false,\n drop_debugger: false,\n },\n },\n },\n server: {\n port: 5173,\n strictPort: true,\n hmr: {\n port: 5173,\n },\n },\n});\n" }, { "path": "vite.config.js", "content": "import { defineConfig } from 'vite';\nimport vue from '@vitejs/plugin-vue';\nimport { resolve } from 'path';\nimport { crx } from '@crxjs/vite-plugin';\nimport Icons from 'unplugin-icons/vite';\nimport AutoImport from 'unplugin-auto-import/vite';\nimport tailwindcss from '@tailwindcss/vite';\nimport manifest from './manifest.chrome.json';\n\nexport default defineConfig({\n plugins: [\n vue(),\n tailwindcss(),\n crx({ manifest }),\n Icons({\n autoInstall: true,\n }),\n AutoImport({\n imports: [\n {\n 'webextension-polyfill': [['default', 'browser']],\n },\n ],\n dts: false,\n }),\n ],\n optimizeDeps: {\n include: ['webextension-polyfill', 'unplugin-icons', 'unplugin-auto-import'],\n },\n resolve: {\n alias: {\n '@': resolve(__dirname, 'src'),\n },\n },\n root: resolve(__dirname, 'src'),\n publicDir: resolve(__dirname, 'public'),\n build: {\n outDir: resolve(__dirname, 'dist/chrome'),\n rollupOptions: {\n input: {\n app: '/ext/browser/index.html',\n },\n },\n minify: 'terser',\n sourcemap: false,\n // https://developer.chrome.com/docs/webstore/program_policies/#:~:text=Code%20Readability%20Requirements\n terserOptions: {\n mangle: false,\n compress: {\n drop_console: true,\n drop_debugger: true,\n },\n },\n },\n server: {\n port: 5173,\n strictPort: true,\n hmr: {\n port: 5173,\n },\n },\n test: {\n cache: false,\n },\n});\n" } ]