From 0a070deebd53c55593e06adadb5e128780273062 Mon Sep 17 00:00:00 2001
From: Isaac Wise <iamisaacwise2006@gmail.com>
Date: Fri, 9 Feb 2024 23:24:22 -0600
Subject: [PATCH] Added selectedLinks to store & checkbox on list view

---
 components/LinkViews/LinkList.tsx | 14 ++++++++++++--
 store/links.ts                    |  4 ++++
 store/localSettings.ts            |  1 -
 types/global.ts                   |  2 +-
 4 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/components/LinkViews/LinkList.tsx b/components/LinkViews/LinkList.tsx
index 0ab489a..7d25c46 100644
--- a/components/LinkViews/LinkList.tsx
+++ b/components/LinkViews/LinkList.tsx
@@ -26,7 +26,11 @@ export default function LinkCardCompact({
   flipDropdown,
 }: Props) {
   const { collections } = useCollectionStore();
-  const { links } = useLinkStore();
+  const { links, setSelectedLinks, selectedLinks } = useLinkStore();
+
+  const handleCheckboxClick = (checkboxId: number) => {
+    setSelectedLinks((selectedLinks.includes(checkboxId) ? selectedLinks.filter((id) => id !== checkboxId) : [...selectedLinks, checkboxId]));
+  };
 
   let shortendURL;
 
@@ -56,9 +60,15 @@ export default function LinkCardCompact({
   return (
     <>
       <div
-        className={`border-neutral-content relative ${!showInfo && !isPWA() ? "hover:bg-base-300 p-3" : "py-3"
+        className={`border-neutral-content relative items-center flex ${!showInfo && !isPWA() ? "hover:bg-base-300 p-3" : "py-3"
           } duration-200 rounded-lg`}
       >
+        <input
+          type="checkbox"
+          className="checkbox checkbox-primary my-auto mr-2"
+          checked={selectedLinks.includes(link.id)}
+          onChange={() => handleCheckboxClick(link.id)}
+        />
         <Link
           href={generateLinkHref(link)}
           target="_blank"
diff --git a/store/links.ts b/store/links.ts
index ab74b03..aa55b59 100644
--- a/store/links.ts
+++ b/store/links.ts
@@ -10,10 +10,12 @@ type ResponseObject = {
 
 type LinkStore = {
   links: LinkIncludingShortenedCollectionAndTags[];
+  selectedLinks: number[];
   setLinks: (
     data: LinkIncludingShortenedCollectionAndTags[],
     isInitialCall: boolean
   ) => void;
+  setSelectedLinks: (linkIds: number[]) => void;
   addLink: (
     body: LinkIncludingShortenedCollectionAndTags
   ) => Promise<ResponseObject>;
@@ -27,6 +29,7 @@ type LinkStore = {
 
 const useLinkStore = create<LinkStore>()((set) => ({
   links: [],
+  selectedLinks: [],
   setLinks: async (data, isInitialCall) => {
     isInitialCall &&
       set(() => ({
@@ -45,6 +48,7 @@ const useLinkStore = create<LinkStore>()((set) => ({
       ),
     }));
   },
+  setSelectedLinks: (linkIds) => set({ selectedLinks: linkIds }),
   addLink: async (body) => {
     const response = await fetch("/api/v1/links", {
       body: JSON.stringify(body),
diff --git a/store/localSettings.ts b/store/localSettings.ts
index e38bae8..6c79d6b 100644
--- a/store/localSettings.ts
+++ b/store/localSettings.ts
@@ -1,5 +1,4 @@
 import { create } from "zustand";
-import { ViewMode } from "@/types/global";
 
 type LocalSettings = {
   theme?: string;
diff --git a/types/global.ts b/types/global.ts
index 3c8de79..717d046 100644
--- a/types/global.ts
+++ b/types/global.ts
@@ -9,7 +9,7 @@ export interface LinkIncludingShortenedCollectionAndTags
     Link,
     "id" | "createdAt" | "collectionId" | "updatedAt" | "lastPreserved"
   > {
-  id?: number;
+  id: number;
   createdAt?: string;
   collectionId?: number;
   tags: Tag[];