Apply tag count limits to cmdk menu

src/cmdk/CommandKClient.tsx

@@ -49,12 +49,19 @@ import { getKeywordsForPhoto, titleForPhoto } from '@/photo';
 import PhotoDate from '@/photo/PhotoDate';
 import PhotoSmall from '@/photo/PhotoSmall';
 import { FaCheck } from 'react-icons/fa6';
-import { addHiddenToTags, formatTag, isTagFavs, isTagHidden } from '@/tag';
+import {
+  addHiddenToTags,
+  formatTag,
+  isTagFavs,
+  isTagHidden,
+  limitTagsByCount,
+} from '@/tag';
 import { formatCount, formatCountDescriptive } from '@/utility/string';
 import CommandKItem from './CommandKItem';
 import {
   CATEGORY_VISIBILITY,
   GRID_HOMEPAGE_ENABLED,
+  HIDE_TAGS_WITH_ONE_PHOTO,
 } from '@/app/config';
 import { DialogDescription, DialogTitle } from '@radix-ui/react-dialog';
 import * as VisuallyHidden from '@radix-ui/react-visually-hidden';
@@ -118,7 +125,7 @@ const renderToggle = (
 export default function CommandKClient({
   cameras,
   lenses,
-  tags,
+  tags: _tags,
   recipes,
   films,
   focalLengths,
@@ -134,7 +141,7 @@ export default function CommandKClient({
     isCommandKOpen: isOpen,
     startUpload,
     photosCountTotal,
-    photosCountHidden,
+    photosCountHidden = 0,
     uploadsCount,
     tagsCount,
     recipesCount,
@@ -282,9 +289,14 @@ export default function CommandKClient({
     }
   }, [isOpen]);
 
-  const tagsIncludingHidden = useMemo(() =>
-    addHiddenToTags(tags, photosCountHidden)
-  , [tags, photosCountHidden]);
+  const tags = useMemo(() => {
+    const tagsIncludingHidden = photosCountHidden > 0
+      ? addHiddenToTags(_tags, photosCountHidden)
+      : _tags;
+    return HIDE_TAGS_WITH_ONE_PHOTO
+      ? limitTagsByCount(tagsIncludingHidden, 2, queryLive)
+      : tagsIncludingHidden;
+  }, [_tags, photosCountHidden, queryLive]);
 
   const categorySections: CommandKSection[] = useMemo(() =>
     CATEGORY_VISIBILITY
@@ -317,7 +329,7 @@ export default function CommandKClient({
             size={13}
             className="translate-x-[1px] translate-y-[0.75px]"
           />,
-          items: tagsIncludingHidden.map(({ tag, count }) => ({
+          items: tags.map(({ tag, count }) => ({
             explicitKey: formatTag(tag),
             label: <span className="flex items-center gap-[7px]">
               {formatTag(tag)}
@@ -376,7 +388,7 @@ export default function CommandKClient({
       .filter(Boolean) as CommandKSection[]
   , [
     appText,
-    tagsIncludingHidden,
+    tags,
     cameras,
     lenses,
     recipes,

src/tag/index.ts

@@ -168,9 +168,16 @@ export const convertTagsForForm = (
         formatCountDescriptive(count, appText.category.taggedPhotos),
     }));
 
-export const limitTagsByCount = (tags: Tags, minimumCount: number) =>
+export const limitTagsByCount = (
+  tags: Tags,
+  minimumCount: number,
+  queryToInclude?: string,
+) =>
   tags.filter(({ tag, count }) => (
     count >= minimumCount ||
     isTagFavs(tag) ||
-    isTagHidden(tag)
+    isTagHidden(tag) ||
+    (queryToInclude && tag
+      .toLocaleLowerCase()
+      .includes(queryToInclude.toLocaleLowerCase()))
   ));