diff --git a/apps/web/app/(dash)/(memories)/content.tsx b/apps/web/app/(dash)/(memories)/content.tsx index 6e2659cb..5d81e823 100644 --- a/apps/web/app/(dash)/(memories)/content.tsx +++ b/apps/web/app/(dash)/(memories)/content.tsx @@ -1,7 +1,7 @@ "use client"; import { Content, StoredSpace } from "@repo/db/schema"; -import { MemoriesIcon, NextIcon, SearchIcon, UrlIcon } from "@repo/ui/icons"; +import { MemoriesIcon, NextIcon, UrlIcon } from "@repo/ui/icons"; import { ArrowLeftIcon, MenuIcon, @@ -37,20 +37,22 @@ import { toast } from "sonner"; import { Input } from "@repo/ui/shadcn/input"; import { motion } from "framer-motion"; import { useSearchParams } from "next/navigation"; +import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from "@repo/ui/shadcn/alert-dialog"; + +type TMemoriesPage = { + memoriesAndSpaces: { memories: Content[]; spaces: StoredSpace[] }; + title?: string; + currentSpace?: StoredSpace; + usersWithAccess?: string[]; +}; export function MemoriesPage({ memoriesAndSpaces, title = "Your Memories", currentSpace, usersWithAccess, -}: { - memoriesAndSpaces: { memories: Content[]; spaces: StoredSpace[] }; - title?: string; - currentSpace?: StoredSpace; - usersWithAccess?: string[]; -}) { +}: TMemoriesPage) { const searchParams = useSearchParams(); - const tab = searchParams.get("tab"); const initialFilter = useMemo(() => { @@ -64,7 +66,6 @@ export function MemoriesPage({ const [filter, setFilter] = useState(initialFilter); const [spaces, setSpaces] = useState(memoriesAndSpaces.spaces); - // to delete a space const handleDeleteSpace = async (id: number) => { const response = await deleteSpace(id); @@ -72,7 +73,7 @@ export function MemoriesPage({ setSpaces(spaces.filter((space) => space.id !== id)); toast.success("Space deleted"); } else { - toast.error("Failed to delete space"); + toast.error("Failed to delete the space"); } }; @@ -96,25 +97,22 @@ export function MemoriesPage({ URL.revokeObjectURL(url); }; - // Sort Both memories and spaces by their savedAt and createdAt dates respectfully. - // The output should be just one single list of items - // And it will look something like { item: "memory" | "space", date: Date, data: Content | StoredSpace } const sortedItems = useMemo(() => { - // Merge the lists + // merge spaces & memories to { item: "memory" | "space", date: Date, data: Content | StoredSpace } const unifiedItems = [ ...memoriesAndSpaces.memories.map((memory) => ({ item: "memory", - date: new Date(memory.savedAt), // Assuming savedAt is a string date + date: new Date(memory.savedAt), data: memory, })), ...spaces.map((space) => ({ item: "space", - date: new Date(space.createdAt), // Assuming createdAt is a string date + date: new Date(space.createdAt), data: space, })), ].map((item) => ({ ...item, - date: Number(item.date), // Convert the date to a number + date: Number(item.date), })); // Sort the merged list @@ -142,28 +140,22 @@ export function MemoriesPage({ }, [memoriesAndSpaces.memories, spaces, filter]); return ( -
- {currentSpace && ( - - Back to all memories - - )} +
+
+ {currentSpace && ( + + + + )} +

+ {title} +

+
-

- {title} -

{currentSpace && (
-
- Space -
- Spaces icon - {currentSpace.name} -
-
{usersWithAccess && usersWithAccess.length > 0 && (
@@ -202,7 +194,11 @@ export function MemoriesPage({ }} className="flex gap-2 max-w-xl mt-2" > - +
@@ -218,7 +214,7 @@ export function MemoriesPage({ /> @@ -235,7 +231,7 @@ export function MemoriesPage({ {sortedItems.map((item) => { if (item.item === "memory") { return ( - void; }) { return ( -
+
Spaces icon Space
@@ -296,7 +292,7 @@ function TabComponent({ >
- {title.slice(0, 2).toUpperCase()} {id} + {title.slice(0, 2).toUpperCase()}{id}
@@ -308,17 +304,15 @@ function TabComponent({
- handleDeleteSpace(id)} - className="w-4 cursor-pointer" - /> + + {handleDeleteSpace(id)}} />
); } -function LinkComponent({ +function MemoryComponent({ type, content, title, @@ -445,12 +439,12 @@ function Filters({ filterMethods: string[]; }) { return ( -
+
{filterMethods.map((i) => { return ( @@ -460,4 +454,26 @@ function Filters({ ); } -export default MemoriesPage; +function SpaceDeleteAlert({onClick}: {onClick: ()=> void}){ + return ( + + + + + Are you absolutely sure? + + This is irreversible. This will delete the space and all memories inside it. + + + + Cancel + Delete + + + + ) +} + +export default MemoriesPage; \ No newline at end of file diff --git a/apps/web/app/(dash)/layout.tsx b/apps/web/app/(dash)/layout.tsx index c6174945..348263f0 100644 --- a/apps/web/app/(dash)/layout.tsx +++ b/apps/web/app/(dash)/layout.tsx @@ -26,7 +26,7 @@ async function Layout({ children }: { children: React.ReactNode }) {
-
+
{/* Desktop Menu */} -
+
{menuItems.map((item) => ( void}){