diff --git a/src/components/Cards/SubmissionCard.tsx b/src/components/Cards/SubmissionCard.tsx index c107cbb..e975551 100644 --- a/src/components/Cards/SubmissionCard.tsx +++ b/src/components/Cards/SubmissionCard.tsx @@ -1,4 +1,4 @@ -import { FileSpreadsheet, StepForward } from "lucide-react"; +import { FileSpreadsheet, LibraryBig, StepForward } from "lucide-react"; import { useNavigate } from "react-router-dom"; import { SubmissionPopulateSubmissionTestcaseAndProblemSecureModel } from "../../types/models/Submission.model"; import { readableDateFormat } from "../../utilities/ReadableDateFormat"; @@ -16,7 +16,7 @@ const SubmissionCard = ({ const handleNavigateProblem = () => { if (submission.topic) { - navigate(`/courses/${submission.topic}/problems/${submission.problem.problem_id}`) + navigate(`/courses/${submission.topic.topic_id}/problems/${submission.problem.problem_id}`) } else { navigate(`/problems/${submission.problem.problem_id}`) @@ -30,6 +30,20 @@ const SubmissionCard = ({ {submission.problem.title}

+ { + submission.topic ? ( +
+ + {submission.topic.name} +
+ ) : ( +
+ + +
+ ) + } +

Submitted Date

{readableDateFormat(submission.date)}

diff --git a/src/components/Dropdowns/MyProblemDropdown.tsx b/src/components/Dropdowns/MyProblemDropdown.tsx index 6a1bc46..a019e40 100644 --- a/src/components/Dropdowns/MyProblemDropdown.tsx +++ b/src/components/Dropdowns/MyProblemDropdown.tsx @@ -1,4 +1,4 @@ -import { CopyPlus, PencilIcon, Trash } from "lucide-react"; +import { BarChart3, CopyPlus, PencilIcon, Trash } from "lucide-react"; import React, { useState } from "react"; import { useNavigate } from "react-router-dom"; import { ProblemService } from "../../services/Problem.service"; @@ -83,13 +83,14 @@ const MyProblemDropdown = ({ navigate(`/my/problems/${problem.problem_id}`) } > - - View Problem + + View Statistic - navigate(`/my/problems/${problem.problem_id}/edit`) + window.open(`/my/problems/${problem.problem_id}/edit`, "_blank") } + > Edit Problem diff --git a/src/components/Forms/CreateCollectionForm/index.tsx b/src/components/Forms/CreateCollectionForm/index.tsx index 24ae478..a867716 100644 --- a/src/components/Forms/CreateCollectionForm/index.tsx +++ b/src/components/Forms/CreateCollectionForm/index.tsx @@ -59,7 +59,7 @@ const CreateCollectionForm = ({ onClick={() => navigate(-1)} /> {createRequest.title === "" - ? "Create Problem" + ? "Create Collection" : createRequest.title}
diff --git a/src/components/NavigationBar/ProfileDropdown.tsx b/src/components/NavigationBar/ProfileDropdown.tsx index 2e9592e..d0db96d 100644 --- a/src/components/NavigationBar/ProfileDropdown.tsx +++ b/src/components/NavigationBar/ProfileDropdown.tsx @@ -1,4 +1,4 @@ -import { ReactNode } from 'react'; +import { ReactNode } from "react"; import { DropdownMenu, @@ -7,7 +7,7 @@ import { DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, - DropdownMenuTrigger + DropdownMenuTrigger, } from "../shadcn/DropdownMenu"; import { @@ -15,37 +15,34 @@ import { Folder, LibraryBig, LogOut, - Users + Users, } from "lucide-react"; -import { useNavigate } from 'react-router-dom'; -import { AuthService } from '../../services/Auth.service'; +import { useNavigate } from "react-router-dom"; +import { AuthService } from "../../services/Auth.service"; const ProfileDropdown = ({ children }: { children: ReactNode }) => { + const navigate = useNavigate(); - const navigate = useNavigate() + const username = localStorage.getItem("username"); + const account_id = String(localStorage.getItem("account_id")); + const token = localStorage.getItem("token"); - const username = localStorage.getItem('username') - const account_id = String(localStorage.getItem('account_id')) - const token = localStorage.getItem('token') + const handleLogout = async () => { + if (!token) { + return; + } - const handleLogout = async () => { + const { status } = await AuthService.logout({ account_id, token }); - if (!token) { - return - } + if (status === 200) { + localStorage.removeItem("account_id"); + localStorage.removeItem("username"); + localStorage.removeItem("token"); + window.location.reload(); + } + }; - const {status} = await AuthService.logout({account_id,token}) - - if (status === 200) { - localStorage.removeItem('account_id') - localStorage.removeItem('username') - localStorage.removeItem('token') - window.location.reload() - } - - } - - return ( + return ( {children} @@ -55,14 +52,16 @@ const ProfileDropdown = ({ children }: { children: ReactNode }) => { {/* Profile */} - {/* ⇧⌘P */} + {/* ⇧⌘P */} {/* */} navigate("/my/problems")}> My Problems {/* ⌘B */} - navigate("/my/collections")}> + navigate("/my/collections")} + > My Collections {/* ⌘S */} @@ -78,6 +77,14 @@ const ProfileDropdown = ({ children }: { children: ReactNode }) => { {/* ⌘K */} + + + navigate("/my/submissions")}> + + My Previous Submissions + {/* ⌘B */} + + {/* @@ -134,7 +141,6 @@ const ProfileDropdown = ({ children }: { children: ReactNode }) => { - - ) -} -export default ProfileDropdown \ No newline at end of file + ); +}; +export default ProfileDropdown; diff --git a/src/components/Tables/MyCollectionsTable.tsx b/src/components/Tables/MyCollectionsTable.tsx index 57766ee..94ab7d9 100644 --- a/src/components/Tables/MyCollectionsTable.tsx +++ b/src/components/Tables/MyCollectionsTable.tsx @@ -3,14 +3,14 @@ import { FileSpreadsheet, Folder } from 'lucide-react' import { Link } from 'react-router-dom' import { CollectionPopulateCollectionProblemPopulateProblemModel } from '../../types/models/Collection.model' import { readableDateFormat } from '../../utilities/ReadableDateFormat' -import { DataTable } from '../DataTable' +import { DataTable } from './Prototype/DataTable' const columns: ColumnDef[] = [ { accessorKey: "name", header: "Title", cell: ({ row }) => ( -
+
{row.original.name} diff --git a/src/components/Tables/MyPreviousSubmissionsTable.tsx b/src/components/Tables/MyPreviousSubmissionsTable.tsx new file mode 100644 index 0000000..814eee6 --- /dev/null +++ b/src/components/Tables/MyPreviousSubmissionsTable.tsx @@ -0,0 +1,118 @@ +import { ColumnDef } from "@tanstack/react-table"; +import { LibraryBig } from "lucide-react"; +import { Link } from "react-router-dom"; +import { ProgrammingLanguageOptions } from "../../constants/ProgrammingLanguage"; +import { SubmissionPopulateSubmissionTestcaseAndProblemSecureModel } from "../../types/models/Submission.model"; +import { readableDateFormat } from "../../utilities/ReadableDateFormat"; +import TestcasesGradingIndicator from "../TestcasesGradingIndicator"; +import { DataTable } from "./Prototype/DataTable"; + +const MyPreviousSubmissionsTable = ({ + submissions = [], +}: { + submissions?: SubmissionPopulateSubmissionTestcaseAndProblemSecureModel[]; +}) => { + const columns: ColumnDef[] = + [ + { + accessorKey: "problem", + header: "Problem", + cell: ({ row }) => ( +
+ + {row.original.problem.title} + +
+ ), + }, + { + accessorKey: "course", + header: "Course", + cell: ({ row }) => ( +
+ {row.original.topic ? ( +
+ + + {row.original.topic.name} + +
+ ) : ( +
+ Public Submitted +
+ )} +
+ ), + }, + { + accessorKey: "language", + header: () =>
Language
, + cell: ({ row }) => ( +
+ { + ProgrammingLanguageOptions.find( + (language) => + language.value === row.original.language + )?.badge + } +
+ ), + }, + { + accessorKey: "runtime_result", + header: "Runtime Result", + cell: ({ row }) => ( +
+ +
+ ), + }, + { + accessorKey: "date", + header: "Submitted Date", + cell: ({ row }) => ( +
+ {readableDateFormat(row.original.date)} +
+ ), + }, + // { + // accessorKey: "action", + // header: "", + // cell: ({ row }) => ( + //
+ // + // + // + //
+ // ), + // }, + ]; + + return ( +
+ +
+ ); +}; + +export default MyPreviousSubmissionsTable; diff --git a/src/components/Tables/MyProblemSubmissionsTable.tsx b/src/components/Tables/MyProblemSubmissionsTable.tsx index 8529c8e..43ffbab 100644 --- a/src/components/Tables/MyProblemSubmissionsTable.tsx +++ b/src/components/Tables/MyProblemSubmissionsTable.tsx @@ -1,13 +1,14 @@ import { ColumnDef } from "@tanstack/react-table"; -import { Maximize2 } from "lucide-react"; +import { LibraryBig, Maximize2 } from "lucide-react"; import { ProgrammingLanguageOptions } from "../../constants/ProgrammingLanguage"; import { ProblemPopulateAccountAndTestcasesAndProblemGroupPermissionsPopulateGroupModel } from "../../types/models/Problem.model"; import { SubmissionPopulateSubmissionTestcaseAndAccountModel } from "../../types/models/Submission.model"; import { readableDateFormat } from "../../utilities/ReadableDateFormat"; -import { DataTable } from "../DataTable"; +import { DataTable } from "./Prototype/DataTable"; import ProblemSubmissionSourceCodeAndRuntimeResultDialog from "../Dialogs/ProblemSubmissionSourceCodeAndRuntimeResultDialog"; import TestcasesGradingIndicator from "../TestcasesGradingIndicator"; import { Button } from "../shadcn/Button"; +import { Link } from "react-router-dom"; @@ -25,16 +26,38 @@ const MyProblemSubmissionsTable = ({ accessorKey: "username", header: "Username", cell: ({ row }) => ( -
+
{row.original.account.username}
), }, + { + accessorKey: "course", + header: "Course", + cell: ({ row }) => ( +
+ {row.original.topic ? ( +
+ + + {row.original.topic.name} + +
+ ) : ( +
+ Public Submitted +
+ )} +
+ ), + }, { accessorKey: "language", - header: "Language", + header: () =>
Language
, cell: ({ row }) => ( -
+
{ ProgrammingLanguageOptions.find( (language) => @@ -61,7 +84,7 @@ const MyProblemSubmissionsTable = ({ accessorKey: "date", header: "Submitted Date", cell: ({ row }) => ( -
{readableDateFormat(row.original.date)}
+
{readableDateFormat(row.original.date)}
), }, { diff --git a/src/components/Tables/ProblemTables/MyProblemsTable.tsx b/src/components/Tables/ProblemTables/MyProblemsTable.tsx index f07b5c5..59152a6 100644 --- a/src/components/Tables/ProblemTables/MyProblemsTable.tsx +++ b/src/components/Tables/ProblemTables/MyProblemsTable.tsx @@ -1,30 +1,35 @@ import { ColumnDef } from "@tanstack/react-table"; import { + Check, FileSpreadsheet, MoreHorizontal, Tally4, - Timer + Tally5, + Timer, + X } from "lucide-react"; import { Link } from "react-router-dom"; import { ProgrammingLanguageOptions } from "../../../constants/ProgrammingLanguage"; import { ProblemPopulateTestcases } from "../../../types/models/Problem.model"; import { checkRuntimeStatus } from "../../../utilities/CheckRuntimeStatus"; import { readableDateFormat } from "../../../utilities/ReadableDateFormat"; -import CheckBadge from "../../CheckBadge"; -import { DataTable } from "../../DataTable"; import MyProblemDropdown from "../../Dropdowns/MyProblemDropdown"; +import { DataTable } from "../Prototype/DataTable"; +import DataTableSortableLayout from "../Prototype/DataTableSortableLayout"; const columns: ColumnDef[] = [ { accessorKey: "title", - header: "Title", + header: ({column})=>( + column.toggleSorting(column.getIsSorted() === "asc")}> + Title + + ), cell: ({ row }) => { - console.log(row.original.allowed_languages); - return ( -
+
- + {row.original.title}
@@ -32,20 +37,100 @@ const columns: ColumnDef[] = [ }, }, + { + accessorKey: "creator", + header: ({column})=>( + column.toggleSorting(column.getIsSorted() === "asc")}> + Author + + ), + cell: ({ row }) => { + return ( +
+ {row.original.creator.username} +
+ ); + }, + }, + { accessorKey: "testcases", header: "Testcases", cell: ({ row }) => (
- + {row.original.testcases.length === 0 ? ( + + ) : ( + + )} {row.original.testcases.length}
), }, + // { + // accessorKey: "status", + // header: "Status", + // cell: ({ row }) => { + // return ( + //
+ // + // Source Code + // + // + // 0}> + // Testcases + // + // + // + // No Runtime Error + // + //
+ // ); + // }, + // }, + { + accessorKey: "source_code", + header: () =>
+ + Source Code +
, + cell: ({ row }) => { + return ( +
+ {row.original.solution !== "" ? ( + + ) : ( + + )} +
+ ); + }, + }, + { + accessorKey: "no_runtime_error", + header: () =>
No Runtime Error
, + cell: ({ row }) => { + return ( +
+ {checkRuntimeStatus(row.original.testcases) ? ( + + ) : ( + + )} +
+ ); + }, + }, + { accessorKey: "time_limit", header: "Time Limit", @@ -57,30 +142,6 @@ const columns: ColumnDef[] = [ ), }, - { - accessorKey: "testcases", - header: "Status", - cell: ({ row }) => { - return ( -
- - Source Code - - - 0}> - Testcases - - - - No Runtime Error - -
- ); - }, - }, - { accessorKey: "allowed_languages", header: "Allowed Languages", @@ -101,7 +162,12 @@ const columns: ColumnDef[] = [ { accessorKey: "updated_date", - header: "Updated Date", + header: ({ column }) => ( + column.toggleSorting(column.getIsSorted() === "asc")}> + Updated Date + + + ), cell: ({ row }) => (
{readableDateFormat(row.original.updated_date)} @@ -110,7 +176,12 @@ const columns: ColumnDef[] = [ }, { accessorKey: "created_date", - header: "Created Date", + header: ({ column }) => ( + column.toggleSorting(column.getIsSorted() === "asc")}> + Created Date + + + ), cell: ({ row }) => (
{readableDateFormat(row.original.created_date)} @@ -119,9 +190,13 @@ const columns: ColumnDef[] = [ }, { accessorKey: "action", - header: "Action", + header: () => ( +
+ Action +
+ ), cell: ({ row }) => ( -
+
diff --git a/src/components/Tables/ProblemTables/PublicProblemsTable.tsx b/src/components/Tables/ProblemTables/PublicProblemsTable.tsx index afa27e5..be688fa 100644 --- a/src/components/Tables/ProblemTables/PublicProblemsTable.tsx +++ b/src/components/Tables/ProblemTables/PublicProblemsTable.tsx @@ -3,17 +3,27 @@ import { FileSpreadsheet, Puzzle } from "lucide-react"; -import { Link } from "react-router-dom"; +import { Link, useParams } from "react-router-dom"; import { ProgrammingLanguageOptions } from "../../../constants/ProgrammingLanguage"; import { ProblemPopulateAccountAndSubmissionPopulateSubmissionTestcasesSecureModel } from "../../../types/models/Problem.model"; import { readableDateFormat } from "../../../utilities/ReadableDateFormat"; -import { DataTable } from "../../DataTable"; +import { DataTable } from "../Prototype/DataTable"; import TestcasesGradingIndicator from "../../TestcasesGradingIndicator"; import { Button } from "../../shadcn/Button"; -const columns: ColumnDef[] = + + +const PublicProblemsTable = ({ + problems, +}: { + problems: ProblemPopulateAccountAndSubmissionPopulateSubmissionTestcasesSecureModel[]; +}) => { + + const {courseId} = useParams() + + const columns: ColumnDef[] = [ { accessorKey: "title", @@ -92,7 +102,7 @@ const columns: ColumnDef (
- +