From 35c1453847b3ad8f64a47b4eae4b945fa7e5ef60 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Wed, 17 Jul 2024 23:31:20 -0500
Subject: [PATCH] Refine batch edit actions

---
 src/admin/AdminAppMenu.tsx              |  5 +-
 src/admin/AdminBatchEditPanelClient.tsx | 10 +++-
 src/components/TagInput.tsx             |  3 +-
 src/components/cmdk/CommandKClient.tsx  | 67 +++++++++++++++++++------
 src/site/ViewSwitcher.tsx               |  9 ++--
 src/site/paths.ts                       |  6 ++-
 6 files changed, 73 insertions(+), 27 deletions(-)

diff --git a/src/admin/AdminAppMenu.tsx b/src/admin/AdminAppMenu.tsx
index 4336b82b..1835ea05 100644
--- a/src/admin/AdminAppMenu.tsx
+++ b/src/admin/AdminAppMenu.tsx
@@ -1,8 +1,7 @@
 'use client';
 
 import MoreMenu from '@/components/more/MoreMenu';
-import { GRID_HOMEPAGE_ENABLED } from '@/site/config';
-import { PATH_ADMIN_CONFIGURATION, PATH_GRID, PATH_ROOT } from '@/site/paths';
+import { PATH_ADMIN_CONFIGURATION, PATH_GRID_INFERRED } from '@/site/paths';
 import { useAppState } from '@/state/AppState';
 import { BiCog } from 'react-icons/bi';
 import { ImCheckboxUnchecked } from 'react-icons/im';
@@ -33,7 +32,7 @@ export default function AdminAppMenu() {
           : <ImCheckboxUnchecked
             className="text-[0.75rem]"
           />,
-        href: GRID_HOMEPAGE_ENABLED ? PATH_ROOT : PATH_GRID,
+        href: PATH_GRID_INFERRED,
         action: () => {
           if (isSelecting) {
             setSelectedPhotoIds?.(undefined);
diff --git a/src/admin/AdminBatchEditPanelClient.tsx b/src/admin/AdminBatchEditPanelClient.tsx
index b3b98b35..5e0e2f8a 100644
--- a/src/admin/AdminBatchEditPanelClient.tsx
+++ b/src/admin/AdminBatchEditPanelClient.tsx
@@ -10,12 +10,16 @@ import DeleteButton from './DeleteButton';
 import { useState } from 'react';
 import TagInput from '@/components/TagInput';
 import { convertTagsForForm, Tags } from '@/tag';
+import { usePathname } from 'next/navigation';
+import { PATH_GRID_INFERRED } from '@/site/paths';
 
 export default function AdminBatchEditPanelClient({
   existingTags,
 }: {
   existingTags: Tags
 }) {
+  const pathname = usePathname();
+
   const {
     isUserSignedIn,
     selectedPhotoIds,
@@ -62,7 +66,11 @@ export default function AdminBatchEditPanelClient({
       />
     </>;
 
-  return isUserSignedIn && selectedPhotoIds !== undefined
+  return (
+    isUserSignedIn &&
+    pathname === PATH_GRID_INFERRED &&
+    selectedPhotoIds !== undefined
+  )
     ? <SiteGrid
       className="sticky top-0 z-10 mb-5 -mt-2 pt-2"
       contentMain={<Note
diff --git a/src/components/TagInput.tsx b/src/components/TagInput.tsx
index 910cf948..57d678c3 100644
--- a/src/components/TagInput.tsx
+++ b/src/components/TagInput.tsx
@@ -260,7 +260,8 @@ export default function TagInput({
           className={clsx(
             'grow !min-w-0 !p-0 -my-2 text-xl',
             '!border-none !ring-transparent',
-            'placeholder:text-dim placeholder:text-[15px]',
+            'placeholder:text-dim placeholder:text-[14px]',
+            'placeholder:translate-x-[2px]',
             'placeholder:translate-y-[-1.5px]',
           )}
           size={10}
diff --git a/src/components/cmdk/CommandKClient.tsx b/src/components/cmdk/CommandKClient.tsx
index 72f94c42..cb9d9ef2 100644
--- a/src/components/cmdk/CommandKClient.tsx
+++ b/src/components/cmdk/CommandKClient.tsx
@@ -15,6 +15,9 @@ import {
   PATH_ADMIN_PHOTOS,
   PATH_ADMIN_TAGS,
   PATH_ADMIN_UPLOADS,
+  PATH_FEED_INFERRED,
+  PATH_GRID_INFERRED,
+  PATH_ROOT,
   PATH_SIGN_IN,
   pathForPhoto,
   pathForTag,
@@ -23,7 +26,7 @@ import Modal from '../Modal';
 import { clsx } from 'clsx/lite';
 import { useDebounce } from 'use-debounce';
 import Spinner from '../Spinner';
-import { useRouter } from 'next/navigation';
+import { usePathname, useRouter } from 'next/navigation';
 import { useTheme } from 'next-themes';
 import { BiDesktop, BiMoon, BiSun } from 'react-icons/bi';
 import { IoInvertModeSharp } from 'react-icons/io5';
@@ -42,6 +45,7 @@ import { Tags, addHiddenToTags, formatTag } from '@/tag';
 import { FaTag } from 'react-icons/fa';
 import { formatCount, formatCountDescriptive } from '@/utility/string';
 import CommandKItem from './CommandKItem';
+import { GRID_HOMEPAGE_ENABLED } from '@/site/config';
 
 const LISTENER_KEYDOWN = 'keydown';
 const MINIMUM_QUERY_LENGTH = 2;
@@ -73,11 +77,15 @@ export default function CommandKClient({
   showDebugTools?: boolean
   footer?: string
 }) {
+  const pathname = usePathname();
+
   const {
     isUserSignedIn,
     setUserEmail,
     isCommandKOpen: isOpen,
     hiddenPhotosCount,
+    selectedPhotoIds,
+    setSelectedPhotoIds,
     arePhotosMatted,
     shouldShowBaselineGrid,
     shouldDebugImageFallbacks,
@@ -246,16 +254,27 @@ export default function CommandKClient({
     });
   }
 
+  const pagesItems: CommandKItem[] = [{
+    label: 'Home',
+    path: PATH_ROOT,
+  }];
+
+  if (GRID_HOMEPAGE_ENABLED) {
+    pagesItems.push({
+      label: 'Feed',
+      path: PATH_FEED_INFERRED,
+    });
+  } else {
+    pagesItems.push({
+      label: 'Grid',
+      path: PATH_GRID_INFERRED,
+    });
+  }
+
   const sectionPages: CommandKSection = {
     heading: 'Pages',
     accessory: <HiDocumentText size={15} className="translate-x-[-1px]" />,
-    items: ([{
-      label: 'Home',
-      path: '/',
-    }, {
-      label: 'Grid',
-      path:'/grid',
-    }]),
+    items: pagesItems,
   };
 
   const adminSection: CommandKSection = {
@@ -278,6 +297,17 @@ export default function CommandKClient({
         label: 'App Config',
         annotation: <BiLockAlt />,
         path: PATH_ADMIN_CONFIGURATION,
+      }, {
+        label: selectedPhotoIds === undefined
+          ? 'Select Multiple Photos'
+          : 'Exit Select Multiple Photos',
+        annotation: <BiLockAlt />,
+        path: selectedPhotoIds === undefined
+          ? PATH_GRID_INFERRED
+          : undefined,
+        action: selectedPhotoIds === undefined
+          ? () => setSelectedPhotoIds?.([])
+          : () => setSelectedPhotoIds?.(undefined),
       }] as CommandKItem[])
         .concat(showDebugTools
           ? [{
@@ -393,15 +423,20 @@ export default function CommandKClient({
                       value={key}
                       keywords={keywords}
                       onSelect={() => {
+                        if (action) {
+                          action();
+                          if (!path) { setIsOpen?.(false); }
+                        }
                         if (path) {
-                          setKeyPending(key);
-                          startTransition(async () => {
-                            shouldCloseAfterPending.current = true;
-                            router.push(path, { scroll: true });
-                          });
-                        } else {
-                          setIsOpen?.(false);
-                          action?.();
+                          if (path !== pathname) {
+                            setKeyPending(key);
+                            startTransition(async () => {
+                              shouldCloseAfterPending.current = true;
+                              router.push(path, { scroll: true });
+                            });
+                          } else {
+                            setIsOpen?.(false);
+                          }
                         }
                       }}
                       accessory={accessory}
diff --git a/src/site/ViewSwitcher.tsx b/src/site/ViewSwitcher.tsx
index 1099b7ff..3d5a2baf 100644
--- a/src/site/ViewSwitcher.tsx
+++ b/src/site/ViewSwitcher.tsx
@@ -4,9 +4,8 @@ import IconFeed from '@/site/IconFeed';
 import IconGrid from '@/site/IconGrid';
 import {
   PATH_ADMIN_PHOTOS,
-  PATH_FEED,
-  PATH_GRID,
-  PATH_ROOT,
+  PATH_FEED_INFERRED,
+  PATH_GRID_INFERRED,
 } from '@/site/paths';
 import { BiLockAlt } from 'react-icons/bi';
 import IconSearch from './IconSearch';
@@ -27,7 +26,7 @@ export default function ViewSwitcher({
   const renderItemFeed = () =>
     <SwitcherItem
       icon={<IconFeed />}
-      href={GRID_HOMEPAGE_ENABLED ? PATH_FEED : PATH_ROOT}
+      href={PATH_FEED_INFERRED}
       active={currentSelection === 'feed'}
       noPadding
     />;
@@ -35,7 +34,7 @@ export default function ViewSwitcher({
   const renderItemGrid = () =>
     <SwitcherItem
       icon={<IconGrid />}
-      href={GRID_HOMEPAGE_ENABLED ? PATH_ROOT : PATH_GRID}
+      href={PATH_GRID_INFERRED}
       active={currentSelection === 'grid'}
       noPadding
     />;
diff --git a/src/site/paths.ts b/src/site/paths.ts
index 53053912..8d15811d 100644
--- a/src/site/paths.ts
+++ b/src/site/paths.ts
@@ -1,5 +1,5 @@
 import { Photo } from '@/photo';
-import { BASE_URL } from './config';
+import { BASE_URL, GRID_HOMEPAGE_ENABLED } from './config';
 import { Camera } from '@/camera';
 import { FilmSimulation } from '@/simulation';
 import { parameterize } from '@/utility/string';
@@ -13,6 +13,10 @@ export const PATH_ADMIN               = '/admin';
 export const PATH_API                 = '/api';
 export const PATH_SIGN_IN             = '/sign-in';
 export const PATH_OG                  = '/og';
+// eslint-disable-next-line max-len
+export const PATH_GRID_INFERRED       = GRID_HOMEPAGE_ENABLED ? PATH_ROOT : PATH_GRID;
+// eslint-disable-next-line max-len
+export const PATH_FEED_INFERRED       = GRID_HOMEPAGE_ENABLED ? PATH_FEED : PATH_ROOT;
 
 // Path prefixes
 export const PREFIX_PHOTO             = '/p';