>
-}
-function SubPageSelector(props: SubPageSelectorProps) {
- return (
-
-
-
-
-
- )
-}
-
-export interface ISubPageProps {
- currentSubPage: ESubPage
-}
-
-function SubPage(props: ISubPageProps) {
- switch (props.currentSubPage) {
- case ESubPage.Home:
- return ()
- case ESubPage.Documentation:
- return (<>Doc)
- default:
- return (<>Default)
- }
-}
diff --git a/apps/frontend/src/components/new-file-modal.tsx b/apps/frontend/src/components/new-file-modal.tsx
index bcedba5..8935d96 100644
--- a/apps/frontend/src/components/new-file-modal.tsx
+++ b/apps/frontend/src/components/new-file-modal.tsx
@@ -23,7 +23,7 @@ export function NewFileModal(props: NewFileModalProps) {
- Are you absolutely sure?
+ Ajout d'un fichier
This action cannot be undone. This will permanently delete your account
and remove your data from our servers.
diff --git a/apps/frontend/src/components/sub-pages/index.tsx b/apps/frontend/src/components/sub-pages/index.tsx
new file mode 100644
index 0000000..fd886c0
--- /dev/null
+++ b/apps/frontend/src/components/sub-pages/index.tsx
@@ -0,0 +1,56 @@
+import { NewFileModal } from "../new-file-modal";
+import { Button } from "../ui/button"
+import { Home, NotepadTextDashed } from 'lucide-react';
+import {
+ SubHomePage
+} from './sub-home-page';
+import { Dispatch, SetStateAction } from 'react';
+import {
+ SubDocPage
+} from 'apps/frontend/src/components/sub-pages/sub-doc-page';
+
+export interface SubPageSelectorProps {
+ currentSubPage: ESubPage
+ setCurrentSubPage: Dispatch>
+}
+
+export enum ESubPage {
+ Home,
+ Documentation,
+}
+
+export function SubPageSelector(props: SubPageSelectorProps) {
+ return (
+
+
+
+
+
+ )
+}
+
+export interface ISubPageProps {
+ currentSubPage: ESubPage
+}
+
+export function SubPage(props: ISubPageProps) {
+ switch (props.currentSubPage) {
+ case ESubPage.Home:
+ return ()
+ case ESubPage.Documentation:
+ return ()
+ default:
+ return (<>Default)
+ }
+}
\ No newline at end of file
diff --git a/apps/frontend/src/components/sub-pages/sub-doc-page.tsx b/apps/frontend/src/components/sub-pages/sub-doc-page.tsx
new file mode 100644
index 0000000..b8f7874
--- /dev/null
+++ b/apps/frontend/src/components/sub-pages/sub-doc-page.tsx
@@ -0,0 +1,14 @@
+import { useState } from 'react';
+
+
+export interface SubHomePageProps {
+
+}
+
+export function SubDocPage(props: SubHomePageProps) {
+ const [isLoaded, setIsLoaded] = useState(false);
+
+ return ()
+}
\ No newline at end of file
diff --git a/apps/frontend/src/components/sub-pages/sub-home-page.tsx b/apps/frontend/src/components/sub-pages/sub-home-page.tsx
index a989a96..5ec5440 100644
--- a/apps/frontend/src/components/sub-pages/sub-home-page.tsx
+++ b/apps/frontend/src/components/sub-pages/sub-home-page.tsx
@@ -1,4 +1,8 @@
import { useState } from 'react';
+import { HomeIcon } from 'lucide-react';
+import {
+ FilesDataTable, filesTableColumns
+} from 'apps/frontend/src/components/tables/files-table';
export interface SubHomePageProps {
@@ -8,7 +12,27 @@ export interface SubHomePageProps {
export function SubHomePage(props: SubHomePageProps) {
const [isLoaded, setIsLoaded] = useState(false);
- return (
-
+ return (
+
+
+
Page principal
+
+
+
+
)
}
\ No newline at end of file
diff --git a/apps/frontend/src/components/tables/files-table.tsx b/apps/frontend/src/components/tables/files-table.tsx
new file mode 100644
index 0000000..e816daa
--- /dev/null
+++ b/apps/frontend/src/components/tables/files-table.tsx
@@ -0,0 +1,201 @@
+"use client"
+
+import {
+ ColumnDef,
+ flexRender,
+ getCoreRowModel, getPaginationRowModel, getSortedRowModel, SortingState,
+ useReactTable
+} from '@tanstack/react-table';
+
+import {
+ Table,
+ TableBody,
+ TableCell,
+ TableHead,
+ TableHeader,
+ TableRow,
+} from "../ui/table"
+import { Button } from '../ui/button';
+import { Badge } from '../ui/badge'
+import { ArrowUpDown, Clock, Download, Trash } from 'lucide-react';
+import { useState } from 'react';
+import Link from 'next/link';
+
+// This type is used to define the shape of our data.
+// You can use a Zod schema here if you want.
+export type IFile = {
+ uuid: string;
+ fileName: string;
+ checksum: string;
+ extension: string;
+ groupId: string | null;
+ fileSize: number;
+ fileType: string;
+ isRestricted: boolean;
+ isDocumentation: boolean;
+ uploadedAt: string;
+ uploadedBy: string;
+}
+
+function ContextButtonForFile() {
+ return (
+
+
)
+}
+
+export const filesTableColumns: ColumnDef[] = [
+ {
+ accessorKey: "fileName",
+ header: ({ column }) => {
+ return (
+ Nom du fichier
+
)
+ },
+ },
+ {
+ accessorKey: "uploadedBy",
+ header: ({ column }) => {
+ return (
+ Autheur(s)
+
)
+ },
+ },
+ {
+ accessorKey: "uploadedAt",
+ header: ({ column }) => {
+ return (
+
+ )
+ },
+ cell: ({ row }) => {
+ const date = new Date(row.getValue("uploadedAt"))
+ const formatted = `${date.getDate()}/${date.getMonth() + 1}/${date.getFullYear()} à ${date.getHours()}:${date.getMinutes()}`
+
+ return (
+
+
+
+ {formatted}
+
+
+
+ Extension du fichier
+
)
+ },
+ cell: ({ row }) => {
+ const extension = row.getValue("extension") as string;
+
+ return (
+ {extension}
+
)
+ },
+ },
+ {
+ id: "actions",
+ header: ({ column }) => {
+ return (
+ Actions
+
)
+ },
+ cell: ({ row }) => {
+ const file = row.original
+
+ return (
+
+
+
)
+ },
+ },
+]
+
+interface DataTableProps {
+ columns: ColumnDef[]
+ data: TData[]
+}
+
+export function FilesDataTable({
+ columns,
+ data,
+ }: DataTableProps) {
+ const [sorting, setSorting] = useState([])
+ const table = useReactTable({
+ data,
+ columns,
+ getCoreRowModel: getCoreRowModel(),
+ getPaginationRowModel: getPaginationRowModel(),
+ onSortingChange: setSorting,
+ getSortedRowModel: getSortedRowModel(),
+ state: {
+ sorting,
+ },
+ })
+
+ return (
+
+
+
+ {table.getHeaderGroups().map((headerGroup) => (
+
+ {headerGroup.headers.map((header) => {
+ return (
+
+ {header.isPlaceholder
+ ? null
+ : flexRender(
+ header.column.columnDef.header,
+ header.getContext()
+ )}
+
+ )
+ })}
+
+ ))}
+
+
+ {table.getRowModel().rows?.length ? (
+ table.getRowModel().rows.map((row) => (
+
+ {row.getVisibleCells().map((cell) => (
+
+ {flexRender(cell.column.columnDef.cell, cell.getContext())}
+
+ ))}
+
+ ))
+ ) : (
+
+
+ Auccun résultat
+
+
+ )}
+
+
+