diff --git a/src/app/(dashboard)/dashboard/page.tsx b/src/app/(dashboard)/dashboard/page.tsx
index eced8d3..9dcc0fa 100644
--- a/src/app/(dashboard)/dashboard/page.tsx
+++ b/src/app/(dashboard)/dashboard/page.tsx
@@ -1,9 +1,21 @@
-import Image from "next/image";
+import Breadcrumb from "@/components/breadcrumb";
+import ToolsTable from "@/components/evaluation-start-table/tools-table";
+import { dummyCourseAdmin, dummyEvaluation } from "@/constants/data";
+import { CourseAdmin } from "@/types/course-admin";
+import { Evaluation } from "@/types/evaluation-start";
+import React from "react";
-export default function Home() {
+const breadcrumbItems = [
+ { title: "Dashboard", link: "#" },
+ { title: "Evaluation" },
+];
+const Page = () => {
return (
-
- hello
+
+
+
);
-}
+};
+
+export default Page;
diff --git a/src/app/(dashboard)/page.tsx b/src/app/(dashboard)/page.tsx
new file mode 100644
index 0000000..0310611
--- /dev/null
+++ b/src/app/(dashboard)/page.tsx
@@ -0,0 +1,9 @@
+import { redirect } from "next/navigation";
+import React from "react";
+
+const Page = () => {
+ redirect("/dashboard");
+ return
;
+};
+
+export default Page;
diff --git a/src/components/evaluation-start-table/cell-action.tsx b/src/components/evaluation-start-table/cell-action.tsx
new file mode 100644
index 0000000..6790902
--- /dev/null
+++ b/src/components/evaluation-start-table/cell-action.tsx
@@ -0,0 +1,68 @@
+"use client";
+import { AlertModal } from "@/components/alert-modal";
+import { Button } from "@/components/ui/button";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuLabel,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { useToast } from "@/components/ui/use-toast";
+import { EvaluationStart } from "@/types/evaluation-start";
+
+import { GitCommit, MoreHorizontal, Trash } from "lucide-react";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+interface CellActionProps {
+ data: EvaluationStart;
+}
+
+export const CellAction: React.FC
= ({ data }) => {
+ const [loading, setLoading] = useState(false);
+ const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
+ const router = useRouter();
+ const { toast } = useToast();
+
+ const onDeleteConfirm = async () => {};
+
+ const handleUpdateStatus = async () => {};
+
+ return (
+ <>
+ setIsDeleteModalOpen(false)}
+ onConfirm={onDeleteConfirm}
+ loading={loading}
+ />
+
+
+
+
+
+ Actions
+
+
+ // router.push(`#`)
+ // }
+ >
+ Commits
+
+ setIsDeleteModalOpen(true)}
+ >
+ Delete
+
+
+
+ >
+ );
+};
diff --git a/src/components/evaluation-start-table/columns.tsx b/src/components/evaluation-start-table/columns.tsx
new file mode 100644
index 0000000..928042a
--- /dev/null
+++ b/src/components/evaluation-start-table/columns.tsx
@@ -0,0 +1,88 @@
+"use client";
+import { DataTableColumnHeader } from "./data-table-column-header";
+import { CellAction } from "./cell-action";
+import { ColumnDef } from "@tanstack/react-table";
+import { Checkbox } from "@/components/ui/checkbox";
+// import { formatDate } from "@/lib/format-date";
+import { EvaluationStart } from "@/types/evaluation-start";
+
+export const columns: ColumnDef[] = [
+ {
+ id: "select",
+ header: ({ table }) => (
+ table.toggleAllPageRowsSelected(!!value)}
+ aria-label="Select all"
+ className="translate-y-[2px]"
+ />
+ ),
+ cell: ({ row }) => (
+ row.toggleSelected(!!value)}
+ aria-label="Select row"
+ className="translate-y-[2px]"
+ />
+ ),
+ enableSorting: false,
+ enableHiding: false,
+ },
+
+ {
+ accessorKey: "fullName",
+ header: ({ column }) => (
+
+ ),
+ cell: ({ row }) => {
+ return {row.getValue("fullName")}
;
+ },
+ },
+
+ {
+ accessorKey: "email",
+ header: ({ column }) => (
+
+ ),
+ cell: ({ row }) => {
+ return {row.getValue("email")}
;
+ },
+ },
+
+ {
+ accessorKey: "status",
+ header: ({ column }) => (
+
+ ),
+ cell: ({ row }) => {
+ return {row.getValue("status")}
;
+ },
+ filterFn: (row, id, value) => {
+ return value.includes(row.getValue(id));
+ },
+ },
+
+ // {
+ // accessorKey: "created_at",
+ // header: ({ column }) => (
+ //
+ // ),
+ // cell: ({ row }) => {
+ // return {formatDate(row.getValue("created_at"))}
;
+ // },
+ // filterFn: (row, id, value) => {
+ // return value.includes(row.getValue(id));
+ // },
+ // },
+
+ {
+ id: "actions",
+ header: ({ column }) => (
+
+ ),
+ cell: ({ row }) => ,
+ },
+];
diff --git a/src/components/evaluation-start-table/data-table-column-header.tsx b/src/components/evaluation-start-table/data-table-column-header.tsx
new file mode 100644
index 0000000..85df45e
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table-column-header.tsx
@@ -0,0 +1,72 @@
+import {
+ ArrowDownIcon,
+ ArrowUpIcon,
+ CaretSortIcon,
+ EyeNoneIcon,
+ } from "@radix-ui/react-icons"
+ import { Column } from "@tanstack/react-table"
+
+ import { cn } from "@/lib/utils"
+ import { Button } from "@/components/ui/button"
+ import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+ } from "@/components/ui/dropdown-menu"
+
+ interface DataTableColumnHeaderProps
+ extends React.HTMLAttributes {
+ column: Column
+ title: string
+ }
+
+ export function DataTableColumnHeader({
+ column,
+ title,
+ className,
+ }: DataTableColumnHeaderProps) {
+ if (!column.getCanSort()) {
+ return {title}
+ }
+
+
+ return (
+
+
+
+
+
+
+ column.toggleSorting(false)}>
+
+ Asc
+
+ column.toggleSorting(true)}>
+
+ Desc
+
+
+ column.toggleVisibility(false)}>
+
+ Hide
+
+
+
+
+ )
+ }
\ No newline at end of file
diff --git a/src/components/evaluation-start-table/data-table-faceted-filter.tsx b/src/components/evaluation-start-table/data-table-faceted-filter.tsx
new file mode 100644
index 0000000..a5efee2
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table-faceted-filter.tsx
@@ -0,0 +1,147 @@
+import * as React from "react"
+import { CheckIcon, PlusCircledIcon } from "@radix-ui/react-icons"
+import { Column } from "@tanstack/react-table"
+
+import { cn } from "@/lib/utils"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import {
+ Command,
+ CommandEmpty,
+ CommandGroup,
+ CommandInput,
+ CommandItem,
+ CommandList,
+ CommandSeparator,
+} from "@/components/ui/command"
+import {
+ Popover,
+ PopoverContent,
+ PopoverTrigger,
+} from "@/components/ui/popover"
+import { Separator } from "@/components/ui/separator"
+
+interface DataTableFacetedFilterProps {
+ column?: Column
+ title?: string
+ options: {
+ label: string
+ value: string
+ icon?: React.ComponentType<{ className?: string }>
+ }[]
+}
+
+export function DataTableFacetedFilter({
+ column,
+ title,
+ options,
+}: DataTableFacetedFilterProps) {
+ const facets = column?.getFacetedUniqueValues()
+ const selectedValues = new Set(column?.getFilterValue() as string[])
+
+ return (
+
+
+
+
+
+
+
+
+ No results found.
+
+ {options.map((option) => {
+ const isSelected = selectedValues.has(option.value)
+ return (
+ {
+ if (isSelected) {
+ selectedValues.delete(option.value)
+ } else {
+ selectedValues.add(option.value)
+ }
+ const filterValues = Array.from(selectedValues)
+ column?.setFilterValue(
+ filterValues.length ? filterValues : undefined
+ )
+ }}
+ >
+
+
+
+ {option.icon && (
+
+ )}
+ {option.label}
+ {facets?.get(option.value) && (
+
+ {facets.get(option.value)}
+
+ )}
+
+ )
+ })}
+
+ {selectedValues.size > 0 && (
+ <>
+
+
+ column?.setFilterValue(undefined)}
+ className="justify-center text-center"
+ >
+ Clear filters
+
+
+ >
+ )}
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/evaluation-start-table/data-table-pagination.tsx b/src/components/evaluation-start-table/data-table-pagination.tsx
new file mode 100644
index 0000000..3c5a1d9
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table-pagination.tsx
@@ -0,0 +1,97 @@
+import {
+ ChevronLeftIcon,
+ ChevronRightIcon,
+ DoubleArrowLeftIcon,
+ DoubleArrowRightIcon,
+} from "@radix-ui/react-icons";
+import { Table } from "@tanstack/react-table";
+
+import { Button } from "@/components/ui/button";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+
+interface DataTablePaginationProps {
+ table: Table;
+}
+
+export function DataTablePagination({
+ table,
+}: DataTablePaginationProps) {
+ return (
+
+
+ {table.getFilteredSelectedRowModel().rows.length} of{" "}
+ {table.getFilteredRowModel().rows.length} row(s) selected.
+
+
+
Rows per page
+
+
+
+
+ Page {table.getState().pagination.pageIndex + 1} of{" "}
+ {table.getPageCount()}
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/evaluation-start-table/data-table-toolbar.tsx b/src/components/evaluation-start-table/data-table-toolbar.tsx
new file mode 100644
index 0000000..f977581
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table-toolbar.tsx
@@ -0,0 +1,77 @@
+"use client";
+
+import { Cross2Icon } from "@radix-ui/react-icons";
+import { Table } from "@tanstack/react-table";
+
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+// import { DataTableViewOptions } from "./components/data-table-view-options"
+
+import { DataTableFacetedFilter } from "./data-table-faceted-filter";
+import { DataTableViewOptions } from "./data-table-view-options";
+import { userFilterLabels } from "@/constants/data";
+import { EvaluationStart } from "@/types/evaluation-start";
+
+interface DataTableToolbarProps {
+ table: Table;
+ data: EvaluationStart[];
+}
+
+export function DataTableToolbar({
+ table,
+ data,
+}: DataTableToolbarProps) {
+ const isFiltered = table.getState().columnFilters.length > 0;
+
+ const statusFilterOptions = Array.from(
+ new Set(data.map((d) => d.status))
+ ).map((v) => ({
+ label: v,
+ value: v,
+ }));
+
+ return (
+
+ );
+}
diff --git a/src/components/evaluation-start-table/data-table-view-options.tsx b/src/components/evaluation-start-table/data-table-view-options.tsx
new file mode 100644
index 0000000..6d56347
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table-view-options.tsx
@@ -0,0 +1,59 @@
+"use client"
+
+import { DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu"
+import { MixerHorizontalIcon } from "@radix-ui/react-icons"
+import { Table } from "@tanstack/react-table"
+
+import { Button } from "@/components/ui/button"
+import {
+ DropdownMenu,
+ DropdownMenuCheckboxItem,
+ DropdownMenuContent,
+ DropdownMenuLabel,
+ DropdownMenuSeparator,
+} from "@/components/ui/dropdown-menu"
+
+interface DataTableViewOptionsProps {
+ table: Table
+}
+
+export function DataTableViewOptions({
+ table,
+}: DataTableViewOptionsProps) {
+ return (
+
+
+
+
+
+ Toggle columns
+
+ {table
+ .getAllColumns()
+ .filter(
+ (column) =>
+ typeof column.accessorFn !== "undefined" && column.getCanHide()
+ )
+ .map((column) => {
+ return (
+ column.toggleVisibility(!!value)}
+ >
+ {column.id}
+
+ )
+ })}
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/evaluation-start-table/data-table.tsx b/src/components/evaluation-start-table/data-table.tsx
new file mode 100644
index 0000000..e0706db
--- /dev/null
+++ b/src/components/evaluation-start-table/data-table.tsx
@@ -0,0 +1,132 @@
+"use client";
+
+import * as React from "react";
+import {
+ ColumnDef,
+ ColumnFiltersState,
+ SortingState,
+ VisibilityState,
+ flexRender,
+ getCoreRowModel,
+ getFacetedRowModel,
+ getFacetedUniqueValues,
+ getFilteredRowModel,
+ getPaginationRowModel,
+ getSortedRowModel,
+ useReactTable,
+} from "@tanstack/react-table";
+
+import {
+ Table,
+ TableBody,
+ TableCell,
+ TableHead,
+ TableHeader,
+ TableRow,
+} from "@/components/ui/table";
+
+import { DataTablePagination } from "./data-table-pagination";
+import { DataTableToolbar } from "./data-table-toolbar";
+import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
+import { Organization } from "@/types/organization";
+import { EvaluationStart } from "@/types/evaluation-start";
+
+interface DataTableProps {
+ columns: ColumnDef[];
+ data: TData[];
+}
+
+export function DataTable({
+ columns,
+ data,
+}: DataTableProps) {
+ const [rowSelection, setRowSelection] = React.useState({});
+ const [columnVisibility, setColumnVisibility] =
+ React.useState({});
+ const [columnFilters, setColumnFilters] = React.useState(
+ []
+ );
+ const [sorting, setSorting] = React.useState([]);
+
+ const table = useReactTable({
+ data,
+ columns,
+ state: {
+ sorting,
+ columnVisibility,
+ rowSelection,
+ columnFilters,
+ },
+ enableRowSelection: true,
+ onRowSelectionChange: setRowSelection,
+ onSortingChange: setSorting,
+ onColumnFiltersChange: setColumnFilters,
+ onColumnVisibilityChange: setColumnVisibility,
+ getCoreRowModel: getCoreRowModel(),
+ getFilteredRowModel: getFilteredRowModel(),
+ getPaginationRowModel: getPaginationRowModel(),
+ getSortedRowModel: getSortedRowModel(),
+ getFacetedRowModel: getFacetedRowModel(),
+ getFacetedUniqueValues: getFacetedUniqueValues(),
+ });
+
+ 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()
+ )}
+
+ ))}
+
+ ))
+ ) : (
+
+
+ No results.
+
+
+ )}
+
+
+
+
+ {/*
*/}
+
+
+ );
+}
diff --git a/src/components/evaluation-start-table/tools-table.tsx b/src/components/evaluation-start-table/tools-table.tsx
new file mode 100644
index 0000000..8e0595b
--- /dev/null
+++ b/src/components/evaluation-start-table/tools-table.tsx
@@ -0,0 +1,39 @@
+"use client";
+
+import { Heading } from "@/components/ui/heading";
+import { Separator } from "@/components/ui/separator";
+import React from "react";
+import { DataTable } from "./data-table";
+import { columns } from "./columns";
+import Link from "next/link";
+import { Plus } from "lucide-react";
+import { buttonVariants } from "@/components/ui/button";
+import { EvaluationStart } from "@/types/evaluation-start";
+
+const ToolsTable = ({ evaluationData }: { evaluationData: EvaluationStart[] }) => {
+ return (
+ <>
+
+
+
router.push(`/admin-dashboard/tools/add`)}
+ >
+
New Evaluation
+
+
+
+
+ >
+ );
+};
+
+export default ToolsTable;
diff --git a/src/config.ts b/src/config.ts
deleted file mode 100644
index e69de29..0000000
diff --git a/src/config/nav.ts b/src/config/nav.ts
index 7d2ad2a..dec64ac 100644
--- a/src/config/nav.ts
+++ b/src/config/nav.ts
@@ -12,6 +12,7 @@ import {
GitCommitHorizontal,
Key,
LucideIcon,
+ Rocket,
Ruler,
Sparkles,
Users,
@@ -34,6 +35,11 @@ export const sideNavItems: GroupedNavItems[] = [
{
group: "EVALUATION",
items: [
+ {
+ href: "/dashboard",
+ title: "Evaluation Start",
+ icon: Rocket,
+ },
{
href: "/dashboard/new-analysis",
title: "Create New Analysis",
@@ -133,5 +139,3 @@ export const sideNavItems: GroupedNavItems[] = [
],
},
];
-
-
diff --git a/src/constants/data.ts b/src/constants/data.ts
index 5bc2ef3..fcca85f 100644
--- a/src/constants/data.ts
+++ b/src/constants/data.ts
@@ -1,6 +1,7 @@
import { Account } from "@/types/account";
import { ApiCommunication } from "@/types/api-communication";
import { Configuration } from "@/types/configuration";
+import { Evaluation } from "@/types/evaluation-start";
import { Organization } from "@/types/organization";
import { User } from "@/types/user";
import { UserRound, UserRoundCheck } from "lucide-react";
@@ -178,3 +179,18 @@ export const dummyCourseAdmin = [
created_at: new Date().toISOString(),
},
];
+
+export const dummyEvaluation: Evaluation[] = [
+ {
+ id: 1,
+ fullName: "John Doe",
+ email: "johndoe@gmail.com",
+ status: "finished",
+ },
+ {
+ id: 2,
+ fullName: "Don Abramov",
+ email: "don@gmail.com",
+ status: "unfinished",
+ },
+];
diff --git a/src/types/evaluation-start.ts b/src/types/evaluation-start.ts
new file mode 100644
index 0000000..7d42da6
--- /dev/null
+++ b/src/types/evaluation-start.ts
@@ -0,0 +1,6 @@
+export interface EvaluationStart {
+ id: number;
+ fullName: string;
+ email: string;
+ status: string;
+}