fix: besar-besaran

sora-vp · Jun 16, 2024 · e146274 · e146274
1 parent c9a68ea
commit e146274
Show file tree

Hide file tree

Showing 14 changed files with 83 additions and 88 deletions.
diff --git a/apps/web/src/app/_components/candidate/candidate-action.tsx b/apps/web/src/app/_components/candidate/candidate-action.tsx
@@ -28,7 +28,7 @@ interface IProps {
   dialogOpen: boolean;
   openSetter: React.Dispatch<React.SetStateAction<boolean>>;
   name: string;
-  id: string;
+  id: number;
 }
 
 export function EditCandidate(props: IProps) {
@@ -80,6 +80,7 @@ export function EditCandidate(props: IProps) {
       return;
     }
 
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const file = values.image.item(0)!;
     const image = await toBase64(file);
 
@@ -170,6 +171,7 @@ export function EditCandidate(props: IProps) {
             <Button
               type="submit"
               className="md:w-fit"
+              // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
               disabled={stillTheSameValue || candidateEditMutation.isPending}
             >
               Edit

diff --git a/apps/web/src/app/_components/candidate/data-table.tsx b/apps/web/src/app/_components/candidate/data-table.tsx
@@ -1,19 +1,8 @@
 "use client";
 
 import type { RouterOutputs } from "@sora-vp/api";
-import type {
-  ColumnDef,
-  ColumnFiltersState,
-  SortingState,
-  VisibilityState,
-} from "@tanstack/react-table";
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useState,
-} from "react";
+import type { ColumnDef, VisibilityState } from "@tanstack/react-table";
+import { createContext, useContext, useEffect, useState } from "react";
 import {
   flexRender,
   getCoreRowModel,
@@ -28,7 +17,6 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuLabel,
-  DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@sora-vp/ui/dropdown-menu";
 import { Skeleton } from "@sora-vp/ui/skeleton";
@@ -40,13 +28,12 @@ import {
   TableHeader,
   TableRow,
 } from "@sora-vp/ui/table";
-import { toast } from "@sora-vp/ui/toast";
 
 import { api } from "~/trpc/react";
 import { DeleteCandidate, EditCandidate } from "./candidate-action";
 import { NewCandidate } from "./new-candidate";
 
-type CandidateList = RouterOutputs["candidate"]["candidateList"][number];
+type CandidateList = RouterOutputs["candidate"]["candidateQuery"][number];
 
 export const GlobalSystemAllowance = createContext(true);
 
@@ -59,17 +46,20 @@ const columns: ColumnDef<CandidateList>[] = [
     accessorKey: "counter",
     header: "Jumlah Pemilih",
     cell: ({ row }) => (
-      <span>{row.getValue("counter").toLocaleString("id-ID")} Orang</span>
+      <span>{row.original.counter.toLocaleString("id-ID")} Orang</span>
     ),
   },
   {
     accessorKey: "image",
     header: "Gambar Kandidat",
     cell: ({ row }) => (
-      <img
-        className="w-60 rounded border"
-        src={`/api/uploads/${row.getValue("image")}`}
-      />
+      <>
+        {/*  eslint-disable-next-line @next/next/no-img-element */}
+        <img
+          className="w-60 rounded border"
+          src={`/api/uploads/${row.original.image}`}
+        />
+      </>
     ),
   },
   {
@@ -245,7 +235,7 @@ export function DataTable() {
                 </TableRow>
               ) : null}
 
-              {candidateQuery.isLoading && !candidateQuery.isError ? (
+              {candidateQuery.isLoading ? (
                 <>
                   {Array.from({ length: 10 }).map((_, idx) => (
                     <TableRow key={idx}>
@@ -257,7 +247,7 @@ export function DataTable() {
                 </>
               ) : null}
 
-              {table.getRowModel().rows?.length ? (
+              {table.getRowModel().rows.length > 0 ? (
                 table.getRowModel().rows.map((row) => (
                   <TableRow
                     key={row.id}

diff --git a/apps/web/src/app/_components/candidate/new-candidate.tsx b/apps/web/src/app/_components/candidate/new-candidate.tsx
@@ -26,16 +26,20 @@ import { GlobalSystemAllowance } from "./data-table";
 
 export interface FormSchema {
   name: string;
-  image: File;
+  image: FileList;
 }
 
-export const toBase64 = (file: File) =>
+export const toBase64 = (file: File): Promise<string> =>
   new Promise((resolve, reject) => {
     const reader = new FileReader();
     reader.readAsDataURL(file);
     reader.onload = () => {
-      const splitted = reader.result!.split(",");
-      resolve(splitted.at(1) as string);
+      const outputResult = reader.result as string;
+
+      const splitted = outputResult.split(",");
+
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      resolve(splitted.at(1)!);
     };
     reader.onerror = reject;
   });
@@ -80,6 +84,7 @@ export function NewCandidate() {
   }, [candidateMutation.isPending]);
 
   async function onSubmit(values: FormSchema) {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const file = values.image.item(0)!;
     const image = await toBase64(file);
 

diff --git a/apps/web/src/app/_components/nav/resizeable-nav.tsx b/apps/web/src/app/_components/nav/resizeable-nav.tsx
@@ -18,7 +18,7 @@ import { NavItems } from "./nav-items";
 import { TopNavbar } from "./top-navbar";
 
 interface Props {
-  children: React.ReacNode;
+  children: React.ReactNode;
   role: "admin" | "comittee";
   defaultLayout: number[] | undefined;
   defaultCollapsed?: boolean;

diff --git a/apps/web/src/app/_components/participant/data-table.tsx b/apps/web/src/app/_components/participant/data-table.tsx
@@ -7,13 +7,7 @@ import type {
   SortingState,
   VisibilityState,
 } from "@tanstack/react-table";
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useState,
-} from "react";
+import { createContext, useContext, useEffect, useState } from "react";
 import { Space_Mono } from "next/font/google";
 import {
   flexRender,
@@ -32,8 +26,6 @@ import {
   ChevronRightIcon,
   ChevronsLeft,
   ChevronsRight,
-  FileJson,
-  FileSpreadsheet,
   MoreHorizontal,
   PencilLine,
   Trash2,
@@ -46,7 +38,6 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuLabel,
-  DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@sora-vp/ui/dropdown-menu";
 import { Input } from "@sora-vp/ui/input";
@@ -116,8 +107,8 @@ const columns: ColumnDef<ParticipantList>[] = [
     cell: ({ row }) => (
       <Tooltip>
         <TooltipTrigger
-          onClick={() => {
-            navigator.clipboard.writeText(row.getValue("qrId"));
+          onClick={async () => {
+            await navigator.clipboard.writeText(row.getValue("qrId"));
             toast.success("Berhasil menyalin QR ID!");
           }}
         >
@@ -142,7 +133,7 @@ const columns: ColumnDef<ParticipantList>[] = [
           </TooltipTrigger>
           <TooltipContent>
             <p>
-              {row.getValue("alreadyAttended")
+              {row.original.attendedAt
                 ? format(
                     row.original.attendedAt,
                     "EEEE, dd MMMM yyy, kk.mm.ss",
@@ -170,7 +161,7 @@ const columns: ColumnDef<ParticipantList>[] = [
           </TooltipTrigger>
           <TooltipContent>
             <p>
-              {row.getValue("alreadyChoosing")
+              {row.original.choosingAt
                 ? format(
                     row.original.choosingAt,
                     "EEEE, dd MMMM yyy, kk.mm.ss",
@@ -194,8 +185,11 @@ const columns: ColumnDef<ParticipantList>[] = [
           <span>
             {formatDuration(
               intervalToDuration({
-                start: row.original.attendedAt,
-                end: row.original.choosingAt,
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                start: row.original.attendedAt!,
+
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                end: row.original.choosingAt!,
               }),
               { locale: id },
             )}
@@ -271,14 +265,16 @@ const columns: ColumnDef<ParticipantList>[] = [
             dialogOpen={openEdit}
             openSetter={setOpenEdit}
             name={participant.name}
-            qrId={participant.qrId}
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            qrId={participant.qrId!}
             subpart={participant.subpart}
           />
           <DeleteParticipant
             dialogOpen={openDelete}
             openSetter={setOpenDelete}
             name={participant.name}
-            qrId={participant.qrId}
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            qrId={participant.qrId!}
           />
         </>
       );
@@ -346,9 +342,7 @@ export function DataTable() {
             <Input
               placeholder="Cari berdasarkan nama peserta..."
               value={
-                (table
-                  .getColumn("participantName")
-                  ?.getFilterValue() as string) ?? ""
+                table.getColumn("participantName")?.getFilterValue() as string
               }
               onChange={(event) =>
                 table
@@ -417,7 +411,7 @@ export function DataTable() {
                   </TableRow>
                 ) : null}
 
-                {participantQuery.isLoading && !participantQuery.isError ? (
+                {participantQuery.isLoading ? (
                   <>
                     {Array.from({ length: 10 }).map((_, idx) => (
                       <TableRow key={idx}>
@@ -430,7 +424,7 @@ export function DataTable() {
                 ) : null}
 
                 <TooltipProvider>
-                  {table.getRowModel().rows?.length ? (
+                  {table.getRowModel().rows.length ? (
                     table.getRowModel().rows.map((row) => (
                       <TableRow
                         key={row.id}

diff --git a/apps/web/src/app/_components/participant/export.tsx b/apps/web/src/app/_components/participant/export.tsx
@@ -139,11 +139,11 @@ export function ExportXLSX() {
             };
           }
 
-          worksheet.alignment = {
+          firstRow.alignment = {
             vertical: "middle",
             horizontal: "center",
           };
-          worksheet.font = {
+          firstRow.font = {
             bold: true,
           };
 

diff --git a/apps/web/src/app/_components/participant/new-participant.tsx b/apps/web/src/app/_components/participant/new-participant.tsx
@@ -1,19 +1,18 @@
 "use client";
 
-import { memo, useCallback, useEffect, useState } from "react";
+import type { z } from "zod";
+import { memo, useCallback, useState } from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { parse as parseCSV } from "csv-parse";
 import { FileText, UserPlus } from "lucide-react";
 import { useForm } from "react-hook-form";
-import { z } from "zod";
 
 import { Button } from "@sora-vp/ui/button";
 import {
   Dialog,
   DialogClose,
   DialogContent,
   DialogDescription,
-  DialogFooter,
   DialogHeader,
   DialogTitle,
   DialogTrigger,
@@ -34,7 +33,9 @@ import { participant } from "@sora-vp/validators";
 import { api } from "~/trpc/react";
 
 type SingleFormSchema = z.infer<typeof participant.SharedAddParticipant>;
-type UploadFormSchema = { csv: FileList };
+interface UploadFormSchema {
+  csv: FileList;
+}
 
 export const ReusableDialog = memo(function MemoizedReusable({
   dialogOpen,
@@ -182,7 +183,7 @@ export function SingleNewParticipant() {
   );
 }
 
-export function UploadNewParticipant(params: type) {
+export function UploadNewParticipant() {
   const [isOpen, setDialogOpen] = useState(false);
   const [readLock, setReadLock] = useState(false);
 
@@ -193,7 +194,7 @@ export function UploadNewParticipant(params: type) {
   });
 
   const insertManyMutation = api.participant.insertManyParticipant.useMutation({
-    onSuccess(result) {
+    onSuccess() {
       toast.success("Berhasil mengunggah file csv!", {
         description: "Seluruh peserta yang terdaftar berhasil ditambahkan!",
       });
@@ -217,6 +218,7 @@ export function UploadNewParticipant(params: type) {
   async function onSubmit(values: UploadFormSchema) {
     setReadLock(true);
 
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const file = values.csv.item(0)!;
     const text = await file.text();
 

diff --git a/apps/web/src/app/_components/participant/participant-action.tsx b/apps/web/src/app/_components/participant/participant-action.tsx
@@ -1,10 +1,9 @@
 "use client";
 
+import type { z } from "zod";
 import { useMemo, useState } from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { FileText, UserPlus } from "lucide-react";
 import { useForm, useWatch } from "react-hook-form";
-import { z } from "zod";
 
 import { Button } from "@sora-vp/ui/button";
 import { DialogClose, DialogDescription } from "@sora-vp/ui/dialog";
@@ -41,6 +40,7 @@ export function EditParticipant(props: IProps) {
     resolver: zodResolver(participant.SharedAddParticipant),
     defaultValues: {
       name: props.name,
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       subpart: props.subpart!,
     },
   });
@@ -79,7 +79,7 @@ export function EditParticipant(props: IProps) {
     <ReusableDialog
       dialogOpen={props.dialogOpen || participantEditMutation.isPending}
       setOpen={() => {
-        if (!participant.isPending)
+        if (!participantEditMutation.isPending)
           props.openSetter((prev) => {
             const newValue = !prev;