From 14e4fed321634dc014ad2f15cafef3ed0123855e Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Sun, 23 Feb 2025 22:50:12 +0000
Subject: feat: Add a setting page to manage assets. Fixes #730

---
 .../components/dashboard/preview/AttachmentBox.tsx | 35 ++++------------------
 1 file changed, 5 insertions(+), 30 deletions(-)

(limited to 'apps/web/components/dashboard')

diff --git a/apps/web/components/dashboard/preview/AttachmentBox.tsx b/apps/web/components/dashboard/preview/AttachmentBox.tsx
index 32939cb0..19622f8d 100644
--- a/apps/web/components/dashboard/preview/AttachmentBox.tsx
+++ b/apps/web/components/dashboard/preview/AttachmentBox.tsx
@@ -9,32 +9,18 @@ import {
 } from "@/components/ui/collapsible";
 import FilePickerButton from "@/components/ui/file-picker-button";
 import { toast } from "@/components/ui/use-toast";
+import { ASSET_TYPE_TO_ICON } from "@/lib/attachments";
 import useUpload from "@/lib/hooks/upload-file";
 import { useTranslation } from "@/lib/i18n/client";
-import {
-  Archive,
-  Camera,
-  ChevronsDownUp,
-  Download,
-  Image,
-  Paperclip,
-  Pencil,
-  Plus,
-  Trash2,
-  Video,
-} from "lucide-react";
+import { ChevronsDownUp, Download, Pencil, Plus, Trash2 } from "lucide-react";
 
 import {
   useAttachBookmarkAsset,
   useDetachBookmarkAsset,
   useReplaceBookmarkAsset,
-} from "@hoarder/shared-react/hooks/bookmarks";
+} from "@hoarder/shared-react/hooks/assets";
 import { getAssetUrl } from "@hoarder/shared-react/utils/assetUtils";
-import {
-  BookmarkTypes,
-  ZAssetType,
-  ZBookmark,
-} from "@hoarder/shared/types/bookmarks";
+import { BookmarkTypes, ZBookmark } from "@hoarder/shared/types/bookmarks";
 import {
   humanFriendlyNameForAssertType,
   isAllowedToAttachAsset,
@@ -43,17 +29,6 @@ import {
 
 export default function AttachmentBox({ bookmark }: { bookmark: ZBookmark }) {
   const { t } = useTranslation();
-  const typeToIcon: Record<ZAssetType, React.ReactNode> = {
-    screenshot: <Camera className="size-4" />,
-    assetScreenshot: <Camera className="size-4" />,
-    fullPageArchive: <Archive className="size-4" />,
-    precrawledArchive: <Archive className="size-4" />,
-    bannerImage: <Image className="size-4" />,
-    video: <Video className="size-4" />,
-    bookmarkAsset: <Paperclip className="size-4" />,
-    unknown: <Paperclip className="size-4" />,
-  };
-
   const { mutate: attachAsset, isPending: isAttaching } =
     useAttachBookmarkAsset({
       onSuccess: () => {
@@ -124,7 +99,7 @@ export default function AttachmentBox({ bookmark }: { bookmark: ZBookmark }) {
               href={getAssetUrl(asset.id)}
               className="flex items-center gap-1"
             >
-              {typeToIcon[asset.assetType]}
+              {ASSET_TYPE_TO_ICON[asset.assetType]}
               <p>{humanFriendlyNameForAssertType(asset.assetType)}</p>
             </Link>
             <div className="flex gap-2">
-- 
cgit v1.2.3-70-g09d2