Merge pull request #39 from derekphilipau/dev

update and cleanup deps
derekphilipau · Aug 23, 2024 · b762992 · b762992
2 parents 7804732 + 0e6a0f4
commit b762992
Show file tree

Hide file tree

Showing 21 changed files with 1,057 additions and 1,928 deletions.
diff --git a/app/art/[...slug]/page.tsx b/app/art/[...slug]/page.tsx
@@ -122,7 +122,7 @@ export default async function Page({ params }) {
                 className={buttonVariants({ variant: 'outline' })}
                 href={artwork?.url}
               >
-                <Icons.link className="mr-2 h-5 w-5" />
+                <Icons.link className="mr-2 size-5" />
                 {dict['button.source']}
               </Link>
             )}

diff --git a/components/artwork/artwork-share.tsx b/components/artwork/artwork-share.tsx
@@ -18,9 +18,7 @@ interface ArtworkDescriptionProps {
   item: ArtworkDocument;
 }
 
-export function ArtworkShare({
-  item,
-}: ArtworkDescriptionProps) {
+export function ArtworkShare({ item }: ArtworkDescriptionProps) {
   const dict = getDictionary();
   const [facebookLink, setFacebookLink] = useState('');
   const [twitterLink, setTwitterLink] = useState('');
@@ -52,28 +50,28 @@ export function ArtworkShare({
       <DropdownMenuTrigger
         className={buttonVariants({ variant: 'outline' }) + ' print:hidden'}
       >
-        <Icons.share2 className="mr-2 h-5 w-5" />
+        <Icons.share2 className="mr-2 size-5" />
         {dict['button.share']}
       </DropdownMenuTrigger>
       <DropdownMenuContent className="print:hidden">
         <DropdownMenuLabel>{dict['button.shareTo']}</DropdownMenuLabel>
         <DropdownMenuItem>
           <a href={mailLink} target="_blank" className="flex items-center">
-            <Icons.mail className="mr-2 h-5 w-5" /> Email
+            <Icons.mail className="mr-2 size-5" /> Email
           </a>
         </DropdownMenuItem>
         <DropdownMenuItem>
           <a href={facebookLink} target="_blank" className="flex items-center">
-            <Icons.facebook className="mr-2 h-5 w-5" /> Facebook
+            <Icons.facebook className="mr-2 size-5" /> Facebook
           </a>
         </DropdownMenuItem>
         <DropdownMenuItem>
           <a href={twitterLink} target="_blank" className="flex items-center">
-            <Icons.twitter className="mr-2 h-5 w-5" /> Twitter
+            <Icons.twitter className="mr-2 size-5" /> Twitter
           </a>
         </DropdownMenuItem>
         <DropdownMenuItem onClick={() => print()}>
-          <Icons.printer className="mr-2 h-5 w-5" /> Print
+          <Icons.printer className="mr-2 size-5" /> Print
         </DropdownMenuItem>
       </DropdownMenuContent>
     </DropdownMenu>

diff --git a/components/artwork/language-disclaimer.tsx b/components/artwork/language-disclaimer.tsx
@@ -16,7 +16,7 @@ export function LanguageDisclaimer({ item, formId }) {
       <div className="p-4 text-neutral-500 dark:text-neutral-400">
         <div className="flex items-center">
           <div className="shrink-0">
-            <Icons.info className="h-5 w-5" aria-hidden="true" />
+            <Icons.info className="size-5" aria-hidden="true" />
           </div>
           <div className="ml-3 flex-1 sm:flex sm:items-center sm:justify-between">
             <p className="text-sm">

diff --git a/components/image/document-image.tsx b/components/image/document-image.tsx
@@ -74,7 +74,7 @@ export function DocumentImage({
         </picture>
       ) : (
         <div className="flex h-48 w-full items-center justify-center">
-          <Icons.imageOff className="h-24 w-24" />
+          <Icons.imageOff className="size-24" />
           <span className="sr-only">{dict['search.imageUnavailable']}</span>
         </div>
       )}

diff --git a/components/image/remote-image.tsx b/components/image/remote-image.tsx
@@ -9,7 +9,10 @@ interface RemoteImageProps {
   imageClassName?: string;
 }
 
-export function RemoteImage({ item, imageClassName = 'h-48 object-contain' }: RemoteImageProps) {
+export function RemoteImage({
+  item,
+  imageClassName = 'h-48 object-contain',
+}: RemoteImageProps) {
   if (!item) return null;
 
   return (
@@ -26,7 +29,7 @@ export function RemoteImage({ item, imageClassName = 'h-48 object-contain' }: Re
             />
           ) : (
             <div className="flex h-48 w-full items-center justify-center">
-              <Icons.imageOff className="h-24 w-24 text-neutral-300 group-hover:text-neutral-400" />
+              <Icons.imageOff className="size-24 text-neutral-300 group-hover:text-neutral-400" />
               <span className="sr-only">Image Unavailable</span>
             </div>
           )}

diff --git a/components/layout/alt-nav.tsx b/components/layout/alt-nav.tsx
@@ -9,19 +9,15 @@ export function AltNav() {
   return (
     <>
       {siteConfig?.links?.github && (
-        <Link
-          href={siteConfig.links.github}
-          target="_blank"
-          rel="noreferrer"
-        >
+        <Link href={siteConfig.links.github} target="_blank" rel="noreferrer">
           <div
             className={buttonVariants({
               size: 'sm',
               variant: 'ghost',
               className: 'text-neutral-700 dark:text-neutral-400',
             })}
           >
-            <Icons.github className="h-5 w-5" />
+            <Icons.github className="size-5" />
             <span className="sr-only">Github</span>
           </div>
         </Link>
@@ -39,7 +35,7 @@ export function AltNav() {
               className: 'text-neutral-700 dark:text-neutral-400',
             })}
           >
-            <Icons.instagram className="h-5 w-5" />
+            <Icons.instagram className="size-5" />
             <span className="sr-only">Instagram</span>
           </div>
         </Link>

diff --git a/components/layout/mobile-nav.tsx b/components/layout/mobile-nav.tsx
@@ -34,7 +34,7 @@ export function MobileNav({ items }: MainNavProps) {
           className="-mr-2 text-2xl font-bold hover:bg-transparent focus:ring-0"
           aria-label={dict['button.openMenu']}
         >
-          <Icons.menu className="h-6 w-6" />
+          <Icons.menu className="size-6" />
         </Button>
       </DropdownMenuTrigger>
       <DropdownMenuContent
@@ -72,7 +72,7 @@ export function MobileNav({ items }: MainNavProps) {
               target="_blank"
               rel="noreferrer"
             >
-              <Icons.github className="mr-2 h-5 w-5" />
+              <Icons.github className="mr-2 size-5" />
               Github
             </Link>
           </DropdownMenuItem>
@@ -85,7 +85,7 @@ export function MobileNav({ items }: MainNavProps) {
               target="_blank"
               rel="noreferrer"
             >
-              <Icons.instagram className="mr-2 h-5 w-5" />
+              <Icons.instagram className="mr-2 size-5" />
               Instagram
             </Link>
           </DropdownMenuItem>
@@ -96,19 +96,19 @@ export function MobileNav({ items }: MainNavProps) {
         </DropdownMenuLabel>
         {theme !== 'light' && (
           <DropdownMenuItem onClick={() => setTheme('light')}>
-            <Icons.sun className="mr-2 h-4 w-4" />
+            <Icons.sun className="mr-2 size-4" />
             <span>{dict['nav.theme.light']}</span>
           </DropdownMenuItem>
         )}
         {theme !== 'dark' && (
           <DropdownMenuItem onClick={() => setTheme('dark')}>
-            <Icons.moon className="mr-2 h-4 w-4" />
+            <Icons.moon className="mr-2 size-4" />
             <span>{dict['nav.theme.dark']}</span>
           </DropdownMenuItem>
         )}
         {theme !== 'system' && (
           <DropdownMenuItem onClick={() => setTheme('system')}>
-            <Icons.laptop className="mr-2 h-4 w-4" />
+            <Icons.laptop className="mr-2 size-4" />
             <span>{dict['nav.theme.system']}</span>
           </DropdownMenuItem>
         )}

diff --git a/components/layout/theme-toggle.tsx b/components/layout/theme-toggle.tsx
@@ -37,19 +37,19 @@ export function ThemeToggle() {
         </DropdownMenuLabel>
         {theme !== 'light' && (
           <DropdownMenuItem onClick={() => setTheme('light')}>
-            <Icons.sun className="mr-2 h-4 w-4" />
+            <Icons.sun className="mr-2 size-4" />
             <span>{dict['nav.theme.light']}</span>
           </DropdownMenuItem>
         )}
         {theme !== 'dark' && (
           <DropdownMenuItem onClick={() => setTheme('dark')}>
-            <Icons.moon className="mr-2 h-4 w-4" />
+            <Icons.moon className="mr-2 size-4" />
             <span>{dict['nav.theme.dark']}</span>
           </DropdownMenuItem>
         )}
         {theme !== 'system' && (
           <DropdownMenuItem onClick={() => setTheme('system')}>
-            <Icons.laptop className="mr-2 h-4 w-4" />
+            <Icons.laptop className="mr-2 size-4" />
             <span>{dict['nav.theme.system']}</span>
           </DropdownMenuItem>
         )}

diff --git a/components/search-card/content-card.tsx b/components/search-card/content-card.tsx
@@ -3,12 +3,12 @@ import Link from 'next/link';
 import { getDictionary } from '@/dictionaries/dictionaries';
 
 import type { BaseDocument } from '@/types/document';
+import { sources } from '@/config/sources';
 import {
   LAYOUT_GRID,
   LAYOUT_LIST,
 } from '@/lib/elasticsearch/search/searchParams';
 import type { LayoutType } from '@/lib/elasticsearch/search/searchParams';
-import { sources } from '@/config/sources';
 import { Icons } from '@/components/icons';
 
 function getContainerClass(layout: LayoutType) {
@@ -58,7 +58,7 @@ export function ContentCard({
                 />
               ) : (
                 <div className="flex h-48 w-full items-center justify-center">
-                  <Icons.imageOff className="h-24 w-24 text-neutral-300 group-hover:text-neutral-400" />
+                  <Icons.imageOff className="size-24 text-neutral-300 group-hover:text-neutral-400" />
                   <span className="sr-only">Image Unavailable</span>
                 </div>
               )}

diff --git a/components/search/color-picker.tsx b/components/search/color-picker.tsx
@@ -79,7 +79,7 @@ export function ColorPicker({ searchParams }: ColorPickerProps) {
       currentHexColor === color.hex && color.hex !== '000000'
         ? 'text-black'
         : color.text;
-    return `cursor-pointer h-6 w-6 rounded-full ${color.color} ${myText}`;
+    return `cursor-pointer size-6 rounded-full ${color.color} ${myText}`;
   }
 
   function clickColor(color?: ColorChoice) {
@@ -110,7 +110,7 @@ export function ColorPicker({ searchParams }: ColorPickerProps) {
       )}
       <Icons.circleSlashed
         onClick={() => clickColor()}
-        className="mr-4 h-6 w-6 cursor-pointer text-neutral-600"
+        className="mr-4 size-6 cursor-pointer text-neutral-600"
       />
     </div>
   );

diff --git a/components/search/date-filter.tsx b/components/search/date-filter.tsx
@@ -75,7 +75,7 @@ export function DateFilter({ searchParams }: DateFilterProps) {
         >
           <h4 className="text-sm font-semibold">{displayName}</h4>
           <div>
-            <ChevronsUpDown className="h-4 w-4" />
+            <ChevronsUpDown className="size-4" />
             <span className="sr-only">Toggle {displayName}</span>
           </div>
         </Button>

diff --git a/components/search/search-agg.tsx b/components/search/search-agg.tsx
@@ -119,7 +119,7 @@ export function SearchAgg({
         >
           <h4 className="text-sm font-semibold">{aggDisplayName}</h4>
           <div>
-            <ChevronsUpDown className="h-4 w-4" />
+            <ChevronsUpDown className="size-4" />
             <span className="sr-only">Toggle {aggDisplayName}</span>
           </div>
         </Button>

diff --git a/components/search/search-as-you-type-input.tsx b/components/search/search-as-you-type-input.tsx
@@ -130,7 +130,7 @@ export function SearchAsYouTypeInput({ params }: SearchAsYouTypeInputProps) {
               className="rounded-none rounded-r-md"
               aria-label={dict['search.search']}
             >
-              <Icons.search className="h-5 w-5" />
+              <Icons.search className="size-5" />
             </Button>
           </div>
         </form>

diff --git a/components/search/search-filter-button.tsx b/components/search/search-filter-button.tsx
@@ -55,7 +55,7 @@ export function SearchFilterButton({
                 : dict['search.showFilters']
             }
           >
-            <Icons.slidersHorizontal className="mr-2 h-5 w-5" />
+            <Icons.slidersHorizontal className="mr-2 size-5" />
             {dict['search.filters']}
           </Button>
         </SheetTrigger>
@@ -79,7 +79,7 @@ export function SearchFilterButton({
         }
         className="hidden sm:flex"
       >
-        <Icons.slidersHorizontal className="mr-2 h-5 w-5" />
+        <Icons.slidersHorizontal className="mr-2 size-5" />
         {dict['search.filters']}
       </Button>
     </>

diff --git a/components/search/search-filter-tag.tsx b/components/search/search-filter-tag.tsx
@@ -38,13 +38,13 @@ export function SearchFilterTag({ params, name, value }: SearchFilterTagProps) {
     >
       {name === 'color' ? (
         <Icons.circle
-          className={`h-6 w-6 rounded-full`}
+          className={`size-6 rounded-full`}
           style={{ backgroundColor: `#${value}`, color: `#${value}` }}
         />
       ) : (
         <div>{value}</div>
       )}
-      <Icons.x className="ml-2 h-4 w-4" />
+      <Icons.x className="ml-2 size-4" />
     </Button>
   );
 }
diff --git a/components/search/search-pagination.tsx b/components/search/search-pagination.tsx
@@ -116,13 +116,13 @@ export function SearchPagination({
         disabled={mySortField === fieldName && mySortOrder === order}
       >
         {order === SORT_ORDER_ASC ? (
-          <Icons.arrowDown className="mr-2 h-5 w-5" />
+          <Icons.arrowDown className="mr-2 size-5" />
         ) : (
-          <Icons.arrowUp className="mr-2 h-5 w-5" />
+          <Icons.arrowUp className="mr-2 size-5" />
         )}
         <span>{label}</span>
         {fieldName === mySortField && mySortOrder === order && (
-          <Icons.check className="ml-2 h-5 w-5" />
+          <Icons.check className="ml-2 size-5" />
         )}
       </DropdownMenuItem>
     );
@@ -154,7 +154,7 @@ export function SearchPagination({
                       disabled={searchParams.layout === LAYOUT_GRID}
                       aria-label={dict['search.layoutGrid']}
                     >
-                      <Icons.layoutGrid className="h-5 w-5" />
+                      <Icons.layoutGrid className="size-5" />
                     </Button>
                   </TooltipTrigger>
                   <TooltipContent>
@@ -174,7 +174,7 @@ export function SearchPagination({
                       disabled={searchParams.layout === LAYOUT_LIST}
                       aria-label={dict['search.layoutList']}
                     >
-                      <Icons.layoutList className="h-5 w-5" />
+                      <Icons.layoutList className="size-5" />
                     </Button>
                   </TooltipTrigger>
                   <TooltipContent>
@@ -191,7 +191,7 @@ export function SearchPagination({
                     size="sm"
                     aria-label={dict['search.cardSwatch']}
                   >
-                    <Icons.arrowUpDown className="h-5 w-5" />
+                    <Icons.arrowUpDown className="size-5" />
                   </Button>
                 </DropdownMenuTrigger>
                 <DropdownMenuContent className="w-56">
@@ -232,7 +232,7 @@ export function SearchPagination({
                           size="sm"
                           aria-label={dict['search.cardSwatch']}
                         >
-                          <Icons.paintbrush2 className="h-5 w-5" />
+                          <Icons.paintbrush2 className="size-5" />
                         </Button>
                       </TooltipTrigger>
                       <TooltipContent>
@@ -255,7 +255,7 @@ export function SearchPagination({
                           size="sm"
                           aria-label={dict['search.cardPalette']}
                         >
-                          <Icons.palette className="h-5 w-5" />
+                          <Icons.palette className="size-5" />
                         </Button>
                       </TooltipTrigger>
                       <TooltipContent>
@@ -278,7 +278,7 @@ export function SearchPagination({
                           size="sm"
                           aria-label={dict['search.cardColor']}
                         >
-                          <Icons.pipette className="h-5 w-5" />
+                          <Icons.pipette className="size-5" />
                         </Button>
                       </TooltipTrigger>
                       <TooltipContent>
@@ -323,7 +323,7 @@ export function SearchPagination({
           size="sm"
           aria-label={dict['search.previous']}
         >
-          <Icons.chevronLeft className="mr-2 h-5 w-5" aria-hidden="true" />
+          <Icons.chevronLeft className="mr-2 size-5" aria-hidden="true" />
           <span className="">{dict['search.previous']}</span>
         </Button>
         <Button
@@ -334,7 +334,7 @@ export function SearchPagination({
           aria-label={dict['search.next']}
         >
           <span className="">{dict['search.next']}</span>
-          <Icons.chevronRight className="ml-2 h-5 w-5" aria-hidden="true" />
+          <Icons.chevronRight className="ml-2 size-5" aria-hidden="true" />
         </Button>
       </div>
     </nav>

diff --git a/components/source/source-header.tsx b/components/source/source-header.tsx
@@ -36,7 +36,7 @@ export function SourceHeader({
           <div
             className={cn(
               'relative mr-2 flex shrink-0 overflow-hidden rounded-full border border-neutral-300 dark:border-neutral-700',
-              isSmall ? 'h-6 w-6' : 'h-7 w-7'
+              isSmall ? 'size-6' : 'size-7'
             )}
           >
             <Image