From 7fcd62d89d855df5104c5a1e1c78ef986176b101 Mon Sep 17 00:00:00 2001
From: "ANTOND." <71350868+antond15@users.noreply.github.com>
Date: Sun, 22 Dec 2024 22:33:41 +0100
Subject: [PATCH] feat: add optional icons before group name

---
 config.lua                       | 2 ++
 fxmanifest.lua                   | 2 +-
 modules/client/main.lua          | 1 +
 web/src/components/groups.svelte | 8 +++++++-
 web/src/store/data.ts            | 4 ++--
 web/src/types/data.ts            | 1 +
 6 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/config.lua b/config.lua
index f452a2f..1ec3939 100644
--- a/config.lua
+++ b/config.lua
@@ -54,6 +54,7 @@ return {
             label = 'Police',
             groups = {'police', 'sheriff'},
             includeOffDuty = false,
+            icon = 'ic:round-local-police',
         },
         {
             label = 'EMS',
@@ -64,6 +65,7 @@ return {
             label = 'Mechanics',
             groups = {'lsc', 'bennys', 'hayes'},
             includeOffDuty = true,
+            icon = 'mdi:wrench',
         },
         {
             label = 'Taxi',
diff --git a/fxmanifest.lua b/fxmanifest.lua
index 98f3f6c..e00e13d 100644
--- a/fxmanifest.lua
+++ b/fxmanifest.lua
@@ -5,7 +5,7 @@ use_experimental_fxv2_oal 'yes'
 
 name 'ac_scoreboard'
 author 'AC Scripts'
-version '2.1.0'
+version '2.2.0'
 description 'A framework-standalone scoreboard UI for FiveM.'
 repository 'https://github.com/acscripts/ac_scoreboard'
 
diff --git a/modules/client/main.lua b/modules/client/main.lua
index 3e494b4..cf53f0c 100644
--- a/modules/client/main.lua
+++ b/modules/client/main.lua
@@ -22,6 +22,7 @@ local function openScoreboard()
             groups[index] = {
                 label = group.label,
                 count = data.groups[index],
+                icon = group.icon,
             }
         end
 
diff --git a/web/src/components/groups.svelte b/web/src/components/groups.svelte
index d170209..8790df9 100644
--- a/web/src/components/groups.svelte
+++ b/web/src/components/groups.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import Icon from '@iconify/svelte';
   import data from '$store/data';
   import config from '$store/config';
   import locales from '$store/locales';
@@ -17,7 +18,12 @@
             $config.compactGroups ? 'py-1' : 'py-2'
           )}
         >
-          <span class="truncate">{group.label}</span>
+          <div class="flex items-center gap-2 truncate">
+            {#if group.icon}
+              <Icon icon={group.icon} class="h-4 min-w-4" />
+            {/if}
+            <span class="truncate">{group.label}</span>
+          </div>
           <span
             class={cn(
               'min-w-9 flex-shrink-0 select-none rounded-md bg-slate-800 px-2 text-center',
diff --git a/web/src/store/data.ts b/web/src/store/data.ts
index 799a42f..8fccb68 100644
--- a/web/src/store/data.ts
+++ b/web/src/store/data.ts
@@ -8,9 +8,9 @@ export default writable<SheetData>({
     maxPlayers: 100,
   },
   groups: [
-    { label: 'Police', count: 7 },
+    { label: 'Police', count: 7, icon: 'ic:round-local-police' },
     { label: 'EMS', count: 6 },
-    { label: 'Mechanics', count: 2 },
+    { label: 'Mechanics', count: 2, icon: 'mdi:wrench' },
     { label: 'Taxi', count: 0 },
     { label: 'Unemployed', count: 47 },
   ],
diff --git a/web/src/types/data.ts b/web/src/types/data.ts
index c333cf7..ac49c32 100644
--- a/web/src/types/data.ts
+++ b/web/src/types/data.ts
@@ -7,6 +7,7 @@ type Footer = {
 type Group = {
   label: string;
   count: number;
+  icon?: string;
 };
 
 type Player = {