From 1d114affa1f09e9dd13a0163c27bf3ef38ac98f6 Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Thu, 9 Jun 2022 19:00:12 -0500
Subject: SVG wrapper component `Icon.svelte` for storing all SVGs, allowing
 SVG paths to be hidden away in one file

---
 src/components/helpers/Icon.svelte | 44 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 src/components/helpers/Icon.svelte

(limited to 'src/components/helpers/Icon.svelte')

diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
new file mode 100644
index 0000000..eb430fb
--- /dev/null
+++ b/src/components/helpers/Icon.svelte
@@ -0,0 +1,44 @@
+<script>
+    export let name;
+    export let width = "1rem";
+    export let height = "1rem";
+    export let focusable = false;
+    let icons = [
+        {
+            box: 24,
+            name: "plus-circle",
+            path: `<path
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        d="M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z"
+                    />`,
+        },
+        {
+            box: 24,
+            name: "minus-circle",
+            path: `<path stroke-linecap="round" stroke-linejoin="round" d="M15 12H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z" />`,
+        },
+        {
+            name: "info",
+            box: 24,
+            path: `<path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+                />`,
+        },
+    ];
+    let displayIcon = icons.find((e) => e.name === name);
+</script>
+
+<svg
+    class={$$props.class}
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 {displayIcon.box} {displayIcon.box}"
+    stroke="currentColor"
+    stroke-width={2}
+    {width}
+    {height}
+    {focusable}>{@html displayIcon.path}</svg
+>
-- 
cgit v1.2.3


From a059ee3c7c7c0b502eb4d796f3e42736cdb70a50 Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Sun, 26 Jun 2022 18:03:06 -0500
Subject: Icon on:click is now a parameter

---
 src/components/helpers/Icon.svelte | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/components/helpers/Icon.svelte')

diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
index eb430fb..7c96dd2 100644
--- a/src/components/helpers/Icon.svelte
+++ b/src/components/helpers/Icon.svelte
@@ -1,8 +1,11 @@
-<script>
+<script lang="ts">
     export let name;
     export let width = "1rem";
     export let height = "1rem";
     export let focusable = false;
+    export let handleClick = () => {
+        console.log("Default icon on:click function prints this");
+    };
     let icons = [
         {
             box: 24,
@@ -32,6 +35,7 @@
 </script>
 
 <svg
+    on:click={handleClick}
     class={$$props.class}
     xmlns="http://www.w3.org/2000/svg"
     fill="none"
-- 
cgit v1.2.3


From 0f290ef69316311eda5179f2d64ee22be822c8e7 Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Fri, 15 Jul 2022 22:12:01 -0400
Subject: `focusable` should be string, not bool

---
 src/components/helpers/Icon.svelte | 72 ++++++++++++++++++++------------------
 1 file changed, 37 insertions(+), 35 deletions(-)

(limited to 'src/components/helpers/Icon.svelte')

diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
index 7c96dd2..c9154f3 100644
--- a/src/components/helpers/Icon.svelte
+++ b/src/components/helpers/Icon.svelte
@@ -1,48 +1,50 @@
 <script lang="ts">
-    export let name;
-    export let width = "1rem";
-    export let height = "1rem";
-    export let focusable = false;
-    export let handleClick = () => {
-        console.log("Default icon on:click function prints this");
-    };
-    let icons = [
-        {
-            box: 24,
-            name: "plus-circle",
-            path: `<path
+  export let name;
+  export let width = "1rem";
+  export let height = "1rem";
+  export let focusable = "false";
+  export let handleClick = () => {
+    console.log("Default icon on:click function prints this");
+  };
+  let icons = [
+    {
+      box: 24,
+      name: "plus-circle",
+      path: `<path
                         stroke-linecap="round"
                         stroke-linejoin="round"
                         d="M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z"
                     />`,
-        },
-        {
-            box: 24,
-            name: "minus-circle",
-            path: `<path stroke-linecap="round" stroke-linejoin="round" d="M15 12H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z" />`,
-        },
-        {
-            name: "info",
-            box: 24,
-            path: `<path
+    },
+    {
+      box: 24,
+      name: "minus-circle",
+      path: `<path stroke-linecap="round" stroke-linejoin="round" d="M15 12H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z" />`,
+    },
+    {
+      name: "info",
+      box: 24,
+      path: `<path
                     stroke-linecap="round"
                     stroke-linejoin="round"
                     d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
                 />`,
-        },
-    ];
-    let displayIcon = icons.find((e) => e.name === name);
+    },
+  ];
+  let displayIcon = icons.find((e) => e.name === name);
 </script>
 
 <svg
-    on:click={handleClick}
-    class={$$props.class}
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 {displayIcon.box} {displayIcon.box}"
-    stroke="currentColor"
-    stroke-width={2}
-    {width}
-    {height}
-    {focusable}>{@html displayIcon.path}</svg
+  on:click={handleClick}
+  class={$$props.class}
+  xmlns="http://www.w3.org/2000/svg"
+  fill="none"
+  viewBox="0 0 {displayIcon?.box} {displayIcon?.box}"
+  stroke="currentColor"
+  stroke-width={2}
+  {width}
+  {height}
+  {focusable}
+>
+  {@html displayIcon?.path}</svg
 >
-- 
cgit v1.2.3


From 62705aefd79764b00f86bdfd16188fdec81c8b76 Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Sat, 16 Jul 2022 00:20:01 -0400
Subject: Successfully adding/removing labs from PeerTeachers; however need to
 bugfix the icon always showing a minus-circle along with the bottom
 unassigned-labs sections not updating

---
 src/components/AssignLabs/AssignLabs.svelte |  6 ++---
 src/components/AssignLabs/LabBox.svelte     | 34 +++++++++++++++--------------
 src/components/helpers/Icon.svelte          |  2 +-
 3 files changed, 22 insertions(+), 20 deletions(-)

(limited to 'src/components/helpers/Icon.svelte')

diff --git a/src/components/AssignLabs/AssignLabs.svelte b/src/components/AssignLabs/AssignLabs.svelte
index 9623560..1bbc006 100644
--- a/src/components/AssignLabs/AssignLabs.svelte
+++ b/src/components/AssignLabs/AssignLabs.svelte
@@ -78,6 +78,7 @@
   }
 
   function unassignLab(id: number) {
+    console.log("unassiging", id)
     const lab = $labStore.get(id);
     if (lab === undefined) return;
     lab.assigned = false;
@@ -119,7 +120,6 @@
               : ""}
             on:click={() => {
               selectedPeerTeacher = pt;
-              console.log(pt);
             }}
           >
             <svelte:component this={PT} {pt} />
@@ -133,7 +133,7 @@
       <div class="assign-box-header">Labs</div>
       <div class="assign-box-body">
         {#each compatibleLabs as lab}
-          <svelte:component this={Lab} {lab} {selectedPeerTeacher} />
+          <svelte:component this={Lab} {lab} iconClick={()=>{assignLab(lab.id)}} />
         {/each}
       </div>
     </div>
@@ -145,7 +145,7 @@
       </div>
       <div class="assign-box-body">
         {#each assignedLabs as lab}
-          <svelte:component this={Lab} {lab} assign={false} />
+          <svelte:component this={Lab} {lab} icon="minus-circle" iconClick={()=>{unassignLab(lab.id)}} />
         {/each}
       </div>
     </div>
diff --git a/src/components/AssignLabs/LabBox.svelte b/src/components/AssignLabs/LabBox.svelte
index 7888884..0b9c8f2 100644
--- a/src/components/AssignLabs/LabBox.svelte
+++ b/src/components/AssignLabs/LabBox.svelte
@@ -5,10 +5,8 @@
     export let lab: Lab;
     export let assign: boolean = true;
     export let selectedPeerTeacher: PeerTeacher | null = null;
-
-    function onIconClick() {
-        console.log("Clicked lab", lab.course, lab.section);
-    }
+    export let iconClick = () => {}
+    export let iconName :string = "plus-circle";
 </script>
 
 <!-- Lab box -->
@@ -20,15 +18,27 @@
         <!-- Top Half -->
         <div class="flex flex-row">
             <strong class="flex-grow">CSCE {lab.course} - {lab.section}</strong>
-            {#if assign}
+            <Icon name="minus-circle" class="h-6 w-6" handleClick={()=>{iconClick()}}/>
+        </div>
+    </div>
+    <!-- Bottom half -->
+    <div>
+        <p class="text-xs">{lab.event.info}</p>
+        <p class="text-xs">{lab.building} {lab.room}</p>
+    </div>
+</div>
+
+ <!-- {#if assign}
                 <Icon
                     name="plus-circle"
                     class="h-6 w-6"
                     handleClick={() => {
-                        selectedPeerTeacher?.assignLab(lab.id);
+                        iconClick()
+                        // selectedPeerTeacher?.assignLab(lab.id);
                         //TODO Adding a lab to a PT doesn't update the current "Labs" and "PT's Labs" columns 
                         //TODO This was handled by self assignment in the assign labs function in Scott's version, but now this logic is passed down into a child component (this component) and self-assigning down here does not seem to help
-                        selectedPeerTeacher = selectedPeerTeacher;
+
+                        //// selectedPeerTeacher = selectedPeerTeacher;
                     }}
                 />
             {:else}
@@ -43,12 +53,4 @@
                         );
                     }}
                 />
-            {/if}
-        </div>
-    </div>
-    <!-- Bottom half -->
-    <div>
-        <p class="text-xs">{lab.event.info}</p>
-        <p class="text-xs">{lab.building} {lab.room}</p>
-    </div>
-</div>
+            {/if} -->
\ No newline at end of file
diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
index c9154f3..8dc2a89 100644
--- a/src/components/helpers/Icon.svelte
+++ b/src/components/helpers/Icon.svelte
@@ -4,7 +4,7 @@
   export let height = "1rem";
   export let focusable = "false";
   export let handleClick = () => {
-    console.log("Default icon on:click function prints this");
+    console.log("Default on:click handler for Icon.svelte. No handler passed");
   };
   let icons = [
     {
-- 
cgit v1.2.3


From 3e9a18c412acf28ea5a23d686244c77e4342bd68 Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Sat, 16 Jul 2022 00:34:57 -0400
Subject: default click handler changed

---
 src/components/helpers/Icon.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/helpers/Icon.svelte')

diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
index 8dc2a89..e7b68d6 100644
--- a/src/components/helpers/Icon.svelte
+++ b/src/components/helpers/Icon.svelte
@@ -4,7 +4,7 @@
   export let height = "1rem";
   export let focusable = "false";
   export let handleClick = () => {
-    console.log("Default on:click handler for Icon.svelte. No handler passed");
+    console.log(`No click handler passed to icon "${name}"`);
   };
   let icons = [
     {
-- 
cgit v1.2.3