starred/karakeep

Fork 0

mirror of https://github.com/karakeep-app/karakeep.git synced 2026-04-25 07:56:05 +03:00

[PR #1745] [MERGED] feat: add tab bookmark count badge indicator #1897

New issue

Closed

opened 2026-03-02 11:59:40 +03:00 by kerem · 0 comments

kerem commented

2026-03-02 11:59:40 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/karakeep-app/karakeep/pull/1745
Author: @qixing-jk
Created: 7/17/2025
Status: ✅ Merged
Merged: 11/3/2025
Merged by: @MohamedBassem

Base: main ← Head: extension/feat/count-badge

📝 Commits (10+)

0085dd0 feat: add tab bookmark count badge indicator
3a99be3 feat: add show count badge setting to extension
d46828b feat(background): refactor tab badge update logic
dc2d1db feat(background): implement badge caching system
8e85bc8 feat(badgeCache): add debug logging for cache operations
68b382d feat: add badge refresh on bookmark creation and deletion
e7d8352 perf(badge-cache): decrease purge alarm interval
146e707 feat(background): clean up API client and badge cache on invalid settings
cf071e9 feat: reset settings to include showCountBadge flag when logout
10d8ecd Merge branch 'main' into extension/feat/count-badge

📊 Changes

14 files changed (+827 additions, -142 deletions)

View changed files

📝 apps/browser-extension/package.json (+2 -0)
📝 apps/browser-extension/src/BookmarkSavedPage.tsx (+10 -1)
📝 apps/browser-extension/src/NotConfiguredPage.tsx (+5 -6)
📝 apps/browser-extension/src/OptionsPage.tsx (+52 -1)
📝 apps/browser-extension/src/SavePage.tsx (+34 -10)
📝 apps/browser-extension/src/background/background.ts (+357 -124)
➕ apps/browser-extension/src/components/ui/switch.tsx (+27 -0)
➕ apps/browser-extension/src/utils/badgeCache.ts (+82 -0)
📝 apps/browser-extension/src/utils/settings.ts (+9 -0)
➕ apps/browser-extension/src/utils/storagePersister.ts (+56 -0)
📝 apps/browser-extension/src/utils/trpc.ts (+116 -0)
➕ apps/browser-extension/src/utils/type.ts (+3 -0)
➕ apps/browser-extension/src/utils/url.ts (+41 -0)
📝 pnpm-lock.yaml (+33 -0)

📄 Description

This PR introduces a new feature that displays a badge on the icon of the browser extension to show the number of times the current page's URL has been added as a bookmark.

Main functions

Bookmark quantity indicator: The expansion icon now displays a symbol that contains the number of bookmarks in the active tab. If the current URL has been accurately bookmarked, the symbol is green; otherwise, it is red.
Real-time update: The count of the indicator will be automatically updated when bookmarks are added or removed for the current page.
Configurable cache: To optimize performance and reduce API calls, the indicator count is cached. The expiration time of the cache can be configured in the extension's options. We adopted the stale-while-revalidate (SWR) strategy to ensure the final consistency of the indicator count.
Settings switch: This indicator feature can be enabled or disabled in the extension's options page.
Cache management: A new menu item has been added to the right-click menu of the extension icon, allowing users to clear the cache for the current page or all pages.
Improved URL verification: More strict verification has been implemented, allowing bookmarks to be added only for URLs with the http and https protocols.

https://github.com/karakeep-app/karakeep/issues/486

Results show

You can now easily check if the page you're viewing has already been hoarded and see the total count of similar URLs.
Badge Numbers and Colors: Their Meanings
Bookmark Count Badge System

Smart Color Coding:
🟢 Green: Exact URL match found
🔴 Red: No bookmarks found
🔢 Numbers: 0 = No bookmarks, 1+ = Count of bookmarks for current page

Real-time Updates

The Badge updates instantly after adding a bookmark, no need to refresh the page manually.
When a bookmark is removed, the Badge status synchronizes immediately as well.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/karakeep-app/karakeep/pull/1745 **Author:** [@qixing-jk](https://github.com/qixing-jk) **Created:** 7/17/2025 **Status:** ✅ Merged **Merged:** 11/3/2025 **Merged by:** [@MohamedBassem](https://github.com/MohamedBassem) **Base:** `main` ← **Head:** `extension/feat/count-badge` --- ### 📝 Commits (10+) - [`0085dd0`](https://github.com/karakeep-app/karakeep/commit/0085dd05d44ba65266b13128960b941039a5559f) feat: add tab bookmark count badge indicator - [`3a99be3`](https://github.com/karakeep-app/karakeep/commit/3a99be324634a217facf9292783f6674929b09d3) feat: add show count badge setting to extension - [`d46828b`](https://github.com/karakeep-app/karakeep/commit/d46828baba6e3f2ec4d62a574c8b652ca8498723) feat(background): refactor tab badge update logic - [`dc2d1db`](https://github.com/karakeep-app/karakeep/commit/dc2d1dbf6705f74d7cecb4242decec2e672c3fba) feat(background): implement badge caching system - [`8e85bc8`](https://github.com/karakeep-app/karakeep/commit/8e85bc8d7b192536e1190de4da3f419acdda1f75) feat(badgeCache): add debug logging for cache operations - [`68b382d`](https://github.com/karakeep-app/karakeep/commit/68b382d5d9b8352ef7283d785483e3e3137530f4) feat: add badge refresh on bookmark creation and deletion - [`e7d8352`](https://github.com/karakeep-app/karakeep/commit/e7d8352bf0d8464cf14ff208e7a2611107b6d915) perf(badge-cache): decrease purge alarm interval - [`146e707`](https://github.com/karakeep-app/karakeep/commit/146e7071a5c7d1c3c1438ae118ebe032456df8bb) feat(background): clean up API client and badge cache on invalid settings - [`cf071e9`](https://github.com/karakeep-app/karakeep/commit/cf071e9dd50f1a1ac0a8dd3b68a4359ecc30c783) feat: reset settings to include showCountBadge flag when logout - [`10d8ecd`](https://github.com/karakeep-app/karakeep/commit/10d8ecddbcc404285fd37e387b428dccb7e70c1a) Merge branch 'main' into extension/feat/count-badge ### 📊 Changes **14 files changed** (+827 additions, -142 deletions) <details> <summary>View changed files</summary> 📝 `apps/browser-extension/package.json` (+2 -0) 📝 `apps/browser-extension/src/BookmarkSavedPage.tsx` (+10 -1) 📝 `apps/browser-extension/src/NotConfiguredPage.tsx` (+5 -6) 📝 `apps/browser-extension/src/OptionsPage.tsx` (+52 -1) 📝 `apps/browser-extension/src/SavePage.tsx` (+34 -10) 📝 `apps/browser-extension/src/background/background.ts` (+357 -124) ➕ `apps/browser-extension/src/components/ui/switch.tsx` (+27 -0) ➕ `apps/browser-extension/src/utils/badgeCache.ts` (+82 -0) 📝 `apps/browser-extension/src/utils/settings.ts` (+9 -0) ➕ `apps/browser-extension/src/utils/storagePersister.ts` (+56 -0) 📝 `apps/browser-extension/src/utils/trpc.ts` (+116 -0) ➕ `apps/browser-extension/src/utils/type.ts` (+3 -0) ➕ `apps/browser-extension/src/utils/url.ts` (+41 -0) 📝 `pnpm-lock.yaml` (+33 -0) </details> ### 📄 Description This PR introduces a new feature that displays a badge on the icon of the browser extension to show the number of times the current page's URL has been added as a bookmark. ## Main functions **Bookmark quantity indicator:** The expansion icon now displays a symbol that contains the number of bookmarks in the active tab. If the current URL has been accurately bookmarked, the symbol is green; otherwise, it is red. Real-time update: The count of the indicator will be automatically updated when bookmarks are added or removed for the current page. **Configurable cache:** To optimize performance and reduce API calls, the indicator count is cached. The expiration time of the cache can be configured in the extension's options. We adopted the stale-while-revalidate (SWR) strategy to ensure the final consistency of the indicator count. **Settings switch:** This indicator feature can be enabled or disabled in the extension's options page. Cache management: A new menu item has been added to the right-click menu of the extension icon, allowing users to clear the cache for the current page or all pages. **Improved URL verification:** More strict verification has been implemented, allowing bookmarks to be added only for URLs with the http and https protocols. ## Related issue https://github.com/karakeep-app/karakeep/issues/486 ## Results show <img width="67" height="64" alt="image" src="https://github.com/user-attachments/assets/9090b2ac-a9cb-4ff0-83fc-c01884122973" /> <img width="64" height="55" alt="image" src="https://github.com/user-attachments/assets/7f0ca3c1-2da5-40a2-933a-623f0074f06f" /> You can now easily check if the page you're viewing has already been hoarded and see the total count of similar URLs. Badge Numbers and Colors: Their Meanings Bookmark Count Badge System **Smart Color Coding:** 🟢 Green: Exact URL match found 🔴 Red: No bookmarks found 🔢 Numbers: 0 = No bookmarks, 1+ = Count of bookmarks for current page **Real-time Updates** - The Badge updates instantly after adding a bookmark, no need to refresh the page manually. - When a bookmark is removed, the Badge status synchronizes immediately as well. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

kerem

2026-03-02 11:59:40 +03:00

closed this issue
added the
pull-request
label

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

starred/karakeep#1897

No description provided.

Rows
Columns