From efad9f0b9c9124b243ba46324be991e94e20d2ee Mon Sep 17 00:00:00 2001
From: Francisco Pessano <franpessano1@gmail.com>
Date: Tue, 24 May 2022 12:46:06 -0300
Subject: [PATCH] Clients support added

---
 .../ClockifyTaskForm/ClockifyTaskForm.jsx     | 28 +++++++++++++++++++
 .../ClockifyTaskForm/clockify-task-form.css   |  6 ++++
 .../clockify-task-form.css.map                |  2 +-
 .../ClockifyTaskForm/clockify-task-form.scss  |  7 +++++
 4 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/src/pages/Main/ClockifyTaskForm/ClockifyTaskForm.jsx b/src/pages/Main/ClockifyTaskForm/ClockifyTaskForm.jsx
index b8a93f8..29c7d63 100644
--- a/src/pages/Main/ClockifyTaskForm/ClockifyTaskForm.jsx
+++ b/src/pages/Main/ClockifyTaskForm/ClockifyTaskForm.jsx
@@ -116,6 +116,19 @@ const ClockifyTaskForm = ({timerOn, setTimerOn, signedIn, apiKey, setApiKey, tas
             const response = await fetch(`https://api.clockify.me/api/v1/workspaces/${e}/projects`, request)
             const data = await response.json()
 
+            data.forEach((project, index) => {
+                if (project.clientName !== "" && !project.archived) {
+                    
+                    if (!data.clients) {
+                        data.clients = {[project.clientName]: [project]}
+                    } else {
+                        data.clients[project.clientName].push(project)
+                    }
+
+                    project.archived = true
+                }
+            })
+
             changeClockifyData({projects: data})
 
         } catch (error) {
@@ -219,6 +232,21 @@ const ClockifyTaskForm = ({timerOn, setTimerOn, signedIn, apiKey, setApiKey, tas
                                         : null
                                     ))
                             }
+                            {
+                                (clockifyData.projects && clockifyData.projects.clients) &&
+                                    Object.keys(clockifyData.projects.clients).map((client, index) => (
+                                        <>
+                                        {index === 0 && <optgroup label='---' />}
+                                        <optgroup label={client} key={client}>
+                                            {
+                                                clockifyData.projects.clients[client].map(project => (
+                                                    <option value={project.id} key={project.id} style={{color: project.color}}>{project.name}</option>
+                                                ))
+                                            }
+                                        </optgroup>
+                                        </>
+                                    ))
+                            }
                         </select>
 
                         <select
diff --git a/src/pages/Main/ClockifyTaskForm/clockify-task-form.css b/src/pages/Main/ClockifyTaskForm/clockify-task-form.css
index 9618401..8b41209 100644
--- a/src/pages/Main/ClockifyTaskForm/clockify-task-form.css
+++ b/src/pages/Main/ClockifyTaskForm/clockify-task-form.css
@@ -22,6 +22,12 @@
   width: 15vw;
   height: 5vh;
 }
+.clockify-tasks-display-container .clockify-task-form .workspace-selector optgroup, .clockify-tasks-display-container .clockify-task-form .project-selector optgroup {
+  color: grey;
+  font-style: inherit;
+  font-weight: 300;
+  text-shadow: none;
+}
 .clockify-tasks-display-container .clockify-task-form .add-task {
   width: 3.5vh;
   height: 3.5vh;
diff --git a/src/pages/Main/ClockifyTaskForm/clockify-task-form.css.map b/src/pages/Main/ClockifyTaskForm/clockify-task-form.css.map
index 5a702c8..734e778 100644
--- a/src/pages/Main/ClockifyTaskForm/clockify-task-form.css.map
+++ b/src/pages/Main/ClockifyTaskForm/clockify-task-form.css.map
@@ -1 +1 @@
-{"version":3,"sources":["clockify-task-form.scss","clockify-task-form.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,kBAAA;EAEA,SAAA;EACA,WAAA;ACAJ;ADGQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADIQ;EACI,WAAA;EACA,YAAA;EACA,gBAAA;ACFZ;ADKQ;EACI,WAAA;EACA,WAAA;ACHZ;ADMQ;EACI,YAAA;EACA,aAAA;EAEA,kBAAA;EAEA,eAAA;EAEA,wCAAA;EACA,mBAAA;EAEA,WAAA;EAEA,eAAA;ACTZ;ADWY;EACI,uBAAA;ACThB;ADYY;EACI,wBAAA;ACVhB;ADcQ;EACI,gBAAA;EACA,mBAAA;EACA,uBAAA;ACZZ;ADeQ;EACI,WAAA;EACA,WAAA;EAEA,eAAA;EAEA,aAAA;EACA,gBAAA;EAEA,sBAAA;AChBZ;ADmBQ;EACI,yBAAA;KAAA,sBAAA;MAAA,qBAAA;UAAA,iBAAA;EACA,eAAA;EACA,oBAAA;EACA,YAAA;ACjBZ;ADqBI;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,6BAAA;IAEA,gBAAA;ECtBV;EDwBU;IACI,UAAA;IACA,YAAA;ECtBd;EDyBU;IACI,WAAA;IACA,WAAA;ECvBd;AACF;AD4BI;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,sBAAA;IACA,mBAAA;EC5BV;ED8BU;IACI,UAAA;IACA,YAAA;EC5Bd;ED+BU;IACI,UAAA;IACA,WAAA;IACA,eAAA;EC7Bd;AACF","file":"clockify-task-form.css"}
\ No newline at end of file
+{"version":3,"sources":["clockify-task-form.scss","clockify-task-form.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,kBAAA;EAEA,SAAA;EACA,WAAA;ACAJ;ADGQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADIQ;EACI,WAAA;EACA,YAAA;EACA,gBAAA;ACFZ;ADKQ;EACI,WAAA;EACA,WAAA;ACHZ;ADKY;EACI,WAAA;EACA,mBAAA;EACA,gBAAA;EACA,iBAAA;ACHhB;ADOQ;EACI,YAAA;EACA,aAAA;EAEA,kBAAA;EAEA,eAAA;EAEA,wCAAA;EACA,mBAAA;EAEA,WAAA;EAEA,eAAA;ACVZ;ADYY;EACI,uBAAA;ACVhB;ADaY;EACI,wBAAA;ACXhB;ADeQ;EACI,gBAAA;EACA,mBAAA;EACA,uBAAA;ACbZ;ADgBQ;EACI,WAAA;EACA,WAAA;EAEA,eAAA;EAEA,aAAA;EACA,gBAAA;EAEA,sBAAA;ACjBZ;ADoBQ;EACI,yBAAA;KAAA,sBAAA;MAAA,qBAAA;UAAA,iBAAA;EACA,eAAA;EACA,oBAAA;EACA,YAAA;AClBZ;ADsBI;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,6BAAA;IAEA,gBAAA;ECvBV;EDyBU;IACI,UAAA;IACA,YAAA;ECvBd;ED0BU;IACI,WAAA;IACA,WAAA;ECxBd;AACF;AD6BI;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,sBAAA;IACA,mBAAA;EC7BV;ED+BU;IACI,UAAA;IACA,YAAA;EC7Bd;EDgCU;IACI,UAAA;IACA,WAAA;IACA,eAAA;EC9Bd;AACF","file":"clockify-task-form.css"}
\ No newline at end of file
diff --git a/src/pages/Main/ClockifyTaskForm/clockify-task-form.scss b/src/pages/Main/ClockifyTaskForm/clockify-task-form.scss
index 42fdbf4..e996bf1 100644
--- a/src/pages/Main/ClockifyTaskForm/clockify-task-form.scss
+++ b/src/pages/Main/ClockifyTaskForm/clockify-task-form.scss
@@ -19,6 +19,13 @@
         .workspace-selector, .project-selector {
             width: 15vw;
             height: 5vh;
+        
+            optgroup {
+                color: grey;
+                font-style: inherit;
+                font-weight: 300;
+                text-shadow: none;
+            }
         }
 
         .add-task {