wodey-prototype/app/trash/page.tsx
pious2847 9dca6a71fc Feature: Added Trash page with sub tabs for
-Ebooks
-Images
-Videos
-Audios
2025-04-26 20:50:07 +00:00

77 lines
3.5 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
import TrashCards, { Trash } from "../components/cards/TrashCards";
import EmptyRecords from "../components/common/EmptyRecords";
const TrashPage = () => {
const trashData: Trash[] = [
{
file: "/images/image1.png",
description: "Elephants drinking water",
filetype: "image",
filesize: "74MB"
},
{
file: "/images/image2.png",
description: "wonderful sunrise in an aug...",
filetype: "image",
filesize: "7MB"
},
{
file: "/images/image3.png",
description: "Beautiful selective focus sh...",
filetype: "image",
filesize: "23MB"
},
{
file: "/images/image4.png",
description: "Urban double exposure port...",
filetype: "image",
filesize: "18MB"
},
{
file: "/images/image5.png",
description: "Closeup shot of a beautiful...",
filetype: "image",
filesize: "56KB"
}
]
return (
<div className="w-full flex flex-col p-10">
<Tabs defaultValue="ebooks" className="w-full">
<TabsList className="w-full md:w-fit">
<TabsTrigger value="ebooks">Ebooks</TabsTrigger>
<TabsTrigger value="images">Images</TabsTrigger>
<TabsTrigger value="videos">Videos</TabsTrigger>
<TabsTrigger value="audios">Audios</TabsTrigger>
</TabsList>
<TabsContent value="ebooks">
<EmptyRecords image="/images/noEbook.png" longDescription="Any ebooks you trashed will end up here. Youll have 30 days to restore them before theyre automatically deleted from your Trash." shortDescription="Theres nothing in your Trash" />
</TabsContent>
<TabsContent value="images">
<div className="flex-col flex gap-4 mt-4">
<div className="flex items-center bg-gray-200/20 p-2 rounded-md ">
<p className="text-sm font-medium">Any images youve trashed can be found here. Please note that the images deleted from the Trash wont be removed from the existing ebooks. The images will only be deleted if those ebooks are deleted.</p>
</div>
<div className="flex flex-wrap md:flex-nowrap gap-4 justify-center md:justify-start">
{trashData.map((data, index) => (
<TrashCards key={index} {...data} />
))}
</div>
</div>
</TabsContent>
<TabsContent value="videos">
<EmptyRecords image="/images/noVideo.png" longDescription="Any videos you trashed will end up here. Youll have 30 days to restore them before theyre automatically deleted from your Trash." shortDescription="Theres nothing in your Trash" />
</TabsContent>
<TabsContent value="audios">
<EmptyRecords image="/images/noAudio.png" longDescription="Any audios you trashed will end up here. Youll have 30 days to restore them before theyre automatically deleted from your Trash." shortDescription="Theres nothing in your Trash" />
</TabsContent>
</Tabs>
</div>
);
}
export default TrashPage;