style(components:data-table): format code

## what - format code ## how ## why ## where - ./src/app/components/data-table/columns.tsx ## usage
Clumsy-Coder · Jan 3, 2024 · f6fdd33 · f6fdd33
1 parent eb3c6a1
commit f6fdd33
Showing 1 changed file with 61 additions and 71 deletions.
diff --git a/src/app/components/data-table/columns.tsx b/src/app/components/data-table/columns.tsx
@@ -1,120 +1,121 @@
-"use client"
+"use client";
 
-import { ColumnDef } from "@tanstack/react-table"
+import { ColumnDef } from "@tanstack/react-table";
 import moment from "moment";
 import Link from "next/link";
 
 import { Badge } from "@/components/ui/badge";
-import { buttonVariants } from "@/components/ui/button";
 import {
   Tooltip,
   TooltipContent,
   TooltipProvider,
   TooltipTrigger,
-} from "@/components/ui/tooltip"
+} from "@/components/ui/tooltip";
 import { DataTableColumnHeader } from "@/components/ui/data-table/column-header";
-import { Submission } from "@/types"
+import { Submission } from "@/types";
 import { cn } from "@/lib/utils";
 
 export const columns: ColumnDef<Submission>[] = [
   {
     accessorKey: "submissionId",
-    accessorFn: row => row.msg.sid,
+    accessorFn: (row) => row.msg.sid,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Submission ID"
+      headerTitle: "Submission ID",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Submission ID" />
-      );
+      return <DataTableColumnHeader column={column} title="Submission ID" />;
     },
     cell: ({ row }) => {
       return (
-        <Link href={`/submissions/${row.getValue("submissionId")}`} className="text-primary underline-offset-4 hover:underline">
+        <Link
+          href={`/submissions/${row.getValue("submissionId")}`}
+          className="text-primary underline-offset-4 hover:underline"
+        >
           {row.getValue("submissionId")}
         </Link>
       );
     },
   },
   {
     accessorKey: "problemNum",
-    accessorFn: row => row.msg.pnum,
+    accessorFn: (row) => row.msg.pnum,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Problem Number"
+      headerTitle: "Problem Number",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Problem number" />
-      );
+      return <DataTableColumnHeader column={column} title="Problem number" />;
     },
     cell: ({ row }) => {
       return (
-        <Link href={`/problems/${row.getValue("problemNum")}`} className="text-primary underline-offset-4 hover:underline">
+        <Link
+          href={`/problems/${row.getValue("problemNum")}`}
+          className="text-primary underline-offset-4 hover:underline"
+        >
           {row.getValue("problemNum")}
         </Link>
       );
     },
   },
   {
     accessorKey: "problemTitle",
-    accessorFn: row => row.msg.pTitle,
+    accessorFn: (row) => row.msg.pTitle,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Problem Title"
+      headerTitle: "Problem Title",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Problem Title" />
-      );
+      return <DataTableColumnHeader column={column} title="Problem Title" />;
     },
     cell: ({ row }) => {
       return (
-        <Link href={`/problems/${row.original.msg.pnum}`} className="text-primary underline-offset-4 hover:underline">
+        <Link
+          href={`/problems/${row.original.msg.pnum}`}
+          className="text-primary underline-offset-4 hover:underline"
+        >
           {row.getValue("problemTitle")}
         </Link>
       );
     },
   },
   {
     accessorKey: "username",
-    accessorFn: row => `${row.msg.name} (${row.msg.uname})`,
+    accessorFn: (row) => `${row.msg.name} (${row.msg.uname})`,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "User (username)"
+      headerTitle: "User (username)",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="User (username)" />
-      );
+      return <DataTableColumnHeader column={column} title="User (username)" />;
     },
     cell: ({ row }) => {
       return (
-        <Link href={`/users/${row.original.msg.uname}`} className="text-primary underline-offset-4 hover:underline">
+        <Link
+          href={`/users/${row.original.msg.uname}`}
+          className="text-primary underline-offset-4 hover:underline"
+        >
           {row.getValue("username")}
         </Link>
       );
     },
   },
   {
     accessorKey: "verdict",
-    accessorFn: row => row.msg.verdict.title,
+    accessorFn: (row) => row.msg.verdict.title,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Verdict"
+      headerTitle: "Verdict",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Verdict" />
-      );
+      return <DataTableColumnHeader column={column} title="Verdict" />;
     },
     cell: ({ row }) => {
       return (
         <Badge
           variant="outline"
           className={cn(
-            'rounded-md text-md capitalize whitespace-nowrap',
+            "rounded-md text-md capitalize whitespace-nowrap",
             row.original.msg.verdict.bgColor,
             row.original.msg.verdict.fgColor,
           )}
@@ -126,77 +127,63 @@ export const columns: ColumnDef<Submission>[] = [
   },
   {
     accessorKey: "language",
-    accessorFn: row => row.msg.lan,
+    accessorFn: (row) => row.msg.lan,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Language"
+      headerTitle: "Language",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Language" />
-      );
+      return <DataTableColumnHeader column={column} title="Language" />;
     },
     cell: ({ row }) => {
-      return (
-        <p>
-          {row.getValue("language")}
-        </p>
-      );
+      return <p>{row.getValue("language")}</p>;
     },
     enableSorting: false,
   },
   {
     accessorKey: "runtime",
-    accessorFn: row => row.msg.run,
+    accessorFn: (row) => row.msg.run,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Runtime"
+      headerTitle: "Runtime",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Runtime" />
-      );
+      return <DataTableColumnHeader column={column} title="Runtime" />;
     },
     cell: ({ row }) => {
-      return (
-        <p>
-          {(row.getValue('runtime') as number / 1000).toFixed(3)}
-        </p>
-      );
+      return <p>{((row.getValue("runtime") as number) / 1000).toFixed(3)}</p>;
     },
     enableSorting: false,
   },
   {
     accessorKey: "rank",
-    accessorFn: row => row.msg.rank,
+    accessorFn: (row) => row.msg.rank,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Rank"
+      headerTitle: "Rank",
     },
     header: ({ column }) => {
-      return (
-        <DataTableColumnHeader column={column} title="Rank" />
-      );
+      return <DataTableColumnHeader column={column} title="Rank" />;
     },
     cell: ({ row }) => {
-      return (
-        <p>
-          {row.getValue('rank')}
-        </p>
-      );
+      return <p>{row.getValue("rank")}</p>;
     },
     enableSorting: false,
   },
   {
     accessorKey: "submitTime",
-    accessorFn: row => row.msg.sbt,
+    accessorFn: (row) => row.msg.sbt,
     meta: {
       // for displaying the columns dropdown
-      headerTitle: "Submit Time"
+      headerTitle: "Submit Time",
     },
     header: ({ column }) => {
       return (
-        <DataTableColumnHeader column={column} title="Submit Time" className="whitespace-nowrap text-right" />
+        <DataTableColumnHeader
+          column={column}
+          title="Submit Time"
+          className="whitespace-nowrap text-right"
+        />
       );
     },
     cell: ({ row }) => {
@@ -205,16 +192,19 @@ export const columns: ColumnDef<Submission>[] = [
           <Tooltip>
             <TooltipTrigger asChild>
               <p className="text-right">
-                {moment.unix(row.getValue('submitTime')).fromNow()}
+                {moment.unix(row.getValue("submitTime")).fromNow()}
               </p>
             </TooltipTrigger>
             <TooltipContent>
-              <p>Submitted at {moment.unix(row.getValue('submitTime')).toLocaleString()}</p>
+              <p>
+                Submitted at{" "}
+                {moment.unix(row.getValue("submitTime")).toLocaleString()}
+              </p>
             </TooltipContent>
           </Tooltip>
         </TooltipProvider>
       );
     },
     enableSorting: false,
   },
-]
+];