ui(web): Show bookmark URL when maximizing a bookmark

2 files changed, 12 insertions, 2 deletions

diff --git a/apps/web/components/dashboard/preview/ActionBar.tsx b/apps/web/components/dashboard/preview/ActionBar.tsx
index ec659e35..3505d0a5 100644
--- a/apps/web/components/dashboard/preview/ActionBar.tsx
+++ b/apps/web/components/dashboard/preview/ActionBar.tsx
@@ -1,3 +1,4 @@
+import { useRouter } from "next/navigation";
 import { ActionButton } from "@/components/ui/action-button";
 import {
   Tooltip,
@@ -16,6 +17,7 @@ import {
 import { ArchivedActionIcon, FavouritedActionIcon } from "../bookmarks/icons";
 
 export default function ActionBar({ bookmark }: { bookmark: ZBookmark }) {
+  const router = useRouter();
   const onError = () => {
     toast({
       variant: "destructive",
@@ -46,6 +48,7 @@ export default function ActionBar({ bookmark }: { bookmark: ZBookmark }) {
         toast({
           description: "The bookmark has been deleted!",
         });
+        router.back();
       },
       onError,
     });
diff --git a/apps/web/components/dashboard/preview/BookmarkPreview.tsx b/apps/web/components/dashboard/preview/BookmarkPreview.tsx
index 581ec4bd..3d98dd19 100644
--- a/apps/web/components/dashboard/preview/BookmarkPreview.tsx
+++ b/apps/web/components/dashboard/preview/BookmarkPreview.tsx
@@ -3,6 +3,7 @@
 import { useEffect, useState } from "react";
 import Link from "next/link";
 import { TagsEditor } from "@/components/dashboard/bookmarks/TagsEditor";
+import { FullPageSpinner } from "@/components/ui/full-page-spinner";
 import { Separator } from "@/components/ui/separator";
 import { Skeleton } from "@/components/ui/skeleton";
 import {
@@ -65,13 +66,15 @@ function CreationTime({ createdAt }: { createdAt: Date }) {
 }
 
 export default function BookmarkPreview({
+  bookmarkId,
   initialData,
 }: {
-  initialData: ZBookmark;
+  bookmarkId: string;
+  initialData?: ZBookmark;
 }) {
   const { data: bookmark } = api.bookmarks.getBookmark.useQuery(
     {
-      bookmarkId: initialData.id,
+      bookmarkId,
     },
     {
       initialData,
@@ -89,6 +92,10 @@ export default function BookmarkPreview({
     },
   );
 
+  if (!bookmark) {
+    return <FullPageSpinner />;
+  }
+
   let content;
   switch (bookmark.content.type) {
     case "link": {