@necrolab/dashboard 0.5.14 → 0.5.16

package/src/components/Tasks/Controls/DesktopControls.vue

@@ -1,84 +1,39 @@
 <template>
-    <div class="task-controls flex-row">
-        <div class="control-buttons mb-4 xl:mb-0">
-            <button @click="$emit('startAll')" class="bg-green-400 smooth-hover responsive-button border-none">
-                Start <PlayIcon />
+    <div class="flex-row gap-x-3">
+        <div class="flex gap-x-3 items-center w-full mb-4 xl:mb-0">
+            <button @click="$emit('startAll')" class="btn-control-success" aria-label="Start all tasks">
+                Start <PlayIcon class="ml-2" />
             </button>
-            <button @click="$emit('stopAll')" class="bg-red-400 smooth-hover responsive-button border-none">
-                Stop <PauseIcon />
+            <button @click="$emit('stopAll')" class="btn-control-danger" aria-label="Stop all tasks">
+                Stop <PauseIcon class="ml-2" />
             </button>
-            <button @click="$emit('deleteAll')" class="bg-dark-400 smooth-hover responsive-button border border-dark-650 hover:border-dark-700">
-                Delete <TrashIcon />
+            <button @click="$emit('deleteAll')" class="btn-action-responsive bg-dark-400 border border-dark-650 hover:border-dark-700 smooth-hover min-w-20 max-w-30 flex-grow xl:flex-initial" aria-label="Delete all tasks">
+                Delete <TrashIcon class="ml-2" />
             </button>
             <h4 class="text-light-300 text-sm flex-grow xl:flex-initial"></h4>
         </div>
         <div class="flex gap-x-3">
             <button
                 :disabled="ui.disabledButtons['add-tasks']"
-                class="bg-dark-400 disabled:opacity-70 smooth-hover flex-grow xl:flex-initial w-36 border border-dark-650 hover:border-dark-700"
+                class="btn-modal disabled:opacity-70 flex-grow xl:flex-initial w-36"
                 @click="ui.toggleModal('create-task')"
-            >
-                Create Task
-                <PlusIcon class="ml-2" />
+                aria-label="Create new task">
+                Create Task <PlusIcon class="ml-2" />
             </button>
-
             <button
-                class="bg-dark-400 smooth-hover flex-grow xl:flex-initial w-36 border border-dark-650 hover:border-dark-700"
+                class="btn-modal flex-grow xl:flex-initial w-36"
                 @click="ui.toggleModal('mass-edit-presale-code')"
                 :disabled="ui.disabledButtons['mass-edit']"
                 v-if="ui.currentModule == 'TM'"
-            >
-                Mass Edit
-                <EditIcon class="ml-2" />
+                aria-label="Mass edit presale codes">
+                Mass Edit <EditIcon class="ml-2" />
             </button>
         </div>
     </div>
 </template>
 <script setup>
-import { ref } from "vue";
 import { useUIStore } from "@/stores/ui";
-import { PlayIcon, PauseIcon, TrashIcon, ExpandIcon, ShrinkIcon, PlusIcon, EditIcon } from "@/components/icons";
+import { PlayIcon, PauseIcon, TrashIcon, PlusIcon, EditIcon } from "@/components/icons";
 
 const ui = useUIStore();
-const isExpanded = ref(false);
 </script>
-<style lang="scss" scoped>
-button {
-    @apply text-white h-10 rounded-md text-xs flex items-center justify-center font-medium px-4;
-    transition: all 0.15s ease;
-
-    &.bg-dark-400:active, &.bg-dark-400:focus {
-        outline: 1px solid oklch(0.72 0.15 145);
-        outline-offset: 0;
-        border-color: oklch(0.72 0.15 145) !important;
-    }
-}
-
-.responsive-button {
-    min-width: 80px;
-    max-width: 120px;
-    @apply flex-grow xl:flex-initial;
-
-    @media (max-width: 768px) {
-        @apply h-10 text-xs;
-    }
-}
-
-.task-controls {
-    @apply gap-x-3;
-    .control-buttons {
-        @apply flex gap-x-3 items-center w-full;
-        button {
-            svg {
-                @apply ml-2;
-            }
-        }
-    }
-    .expand-shrink {
-        @apply flex gap-x-2;
-        button {
-            @apply text-white text-xs px-4 flex items-center justify-center gap-x-4 duration-200 border border-light-300 hover:border-light-400;
-        }
-    }
-}
-</style>

package/src/components/Tasks/Controls/MobileControls.vue

@@ -1,11 +1,11 @@
 <template>
-    <div class="mobile-controls flex items-center justify-between" v-once>
-        <div class="expand-shrink">
-            <button class="mobile-btn" @click="$emit('expand')">
+    <div class="flex items-center justify-between" v-once>
+        <div class="flex gap-x-2">
+            <button class="btn-control-mobile" @click="$emit('expand')" aria-label="Expand all tasks">
                 Expand
                 <ExpandIcon />
             </button>
-            <button class="mobile-btn" @click="$emit('fold')">
+            <button class="btn-control-mobile" @click="$emit('fold')" aria-label="Collapse all tasks">
                 Fold
                 <ShrinkIcon />
             </button>
@@ -13,20 +13,5 @@
     </div>
 </template>
 <script setup>
-import { useUIStore } from "@/stores/ui";
-
-import { PlayIcon, PauseIcon, TrashIcon, ExpandIcon, ShrinkIcon, EditIcon } from "@/components/icons";
-const ui = useUIStore();
+import { ExpandIcon, ShrinkIcon } from "@/components/icons";
 </script>
-<style lang="scss" scoped>
-.mobile-controls {
-    .expand-shrink {
-        @apply flex gap-x-2;
-        .mobile-btn {
-            @apply text-white text-xs px-3 flex items-center justify-center gap-x-1 h-10 rounded-md bg-dark-400 border border-dark-650 hover:border-dark-700 transition-all duration-150 font-medium;
-            width: 80px;
-            font-size: 11px;
-        }
-    }
-}
-</style>

package/src/components/Tasks/CreateTaskAXS.vue

@@ -6,7 +6,7 @@
         </template>
 
         <!-- Task Form -->
-        <div class="form-grid mb-4 mt-4">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4 mt-4">
             <!-- Event ID -->
             <FormField label="Event ID" :icon="StadiumIcon" required>
                 <input placeholder="827474" v-model="task.eventId" required />
@@ -38,30 +38,12 @@
             </FormField>
 
             <!-- Task Amount -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Amount
-                    <span class="ml-2 h-[18px]">#</span>
-                </label>
-                <div class="input-default">
-                    <input placeholder="20" min="1" type="number" pattern="\d*" v-model="task.taskQuantity" />
-                    <div class="input-incrementer">
-                        <button @click="task.taskQuantity++">
-                            <UpIcon />
-                        </button>
-                        <button @click="if (task.taskQuantity > 1) task.taskQuantity--;">
-                            <DownIcon />
-                        </button>
-                    </div>
-                </div>
-            </div>
+            <FormField label="Amount" :icon="HashIcon" incrementer @increment="task.taskQuantity++" @decrement="task.taskQuantity > 1 && task.taskQuantity--">
+                <input placeholder="20" min="1" type="number" pattern="\d*" v-model="task.taskQuantity" />
+            </FormField>
 
             <!-- Profile Tag(s)  -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Profile Tag(s)
-                    <TagIcon />
-                </label>
+            <FormField label="Profile Tag(s)" :icon="TagIcon" noWrapper>
                 <MultiDropdown
                     class="w-full will-change-auto"
                     :onSelect="(v) => (task.profileTags = v)"
@@ -71,14 +53,10 @@
                             return { label: opt, value: opt };
                         })
                     " />
-            </div>
+            </FormField>
 
             <!-- Account Tag  -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Account Tag
-                    <ScannerIcon />
-                </label>
+            <FormField label="Account Tag" :icon="ScannerIcon" noWrapper>
                 <Dropdown
                     :onClick="(f) => (task.accountTag = f)"
                     default="Default tag"
@@ -87,7 +65,7 @@
                     :allowDefault="false"
                     :capitalize="true"
                     class="dropdown w-full" />
-            </div>
+            </FormField>
 
             <!-- Start Offset -->
             <FormField label="Start Offset (Minutes)" :icon="ShieldIcon" incrementer @increment="task.startOffset = (task.startOffset || 0) + 1" @decrement="task.startOffset > 0 && task.startOffset--">
@@ -101,47 +79,18 @@
         </div>
         <div class="mb-3 border border-dark-650" />
         <!-- Task Switches -->
-        <div class="task-switches mb-4 grid grid-cols-4 justify-between gap-y-4">
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Do Not Pay</span>
-                    <span class="block xs:hidden">DNP</span>
-                    <SavingsIcon class="scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.doNotPay" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Smart Timer</span>
-                    <span class="block xs:hidden">Timer</span>
-                    <TimerIcon class="scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.smartTimer" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Quick Queue</span>
-                    <span class="block xs:hidden">Quick Q.</span>
-                    <SkiIcon class="scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.quickQueue" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    Manual
-                    <HandIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.manual" />
-            </div>
+        <div class="mb-4 grid grid-cols-4 justify-between gap-y-4">
+            <TaskToggle :icon="SavingsIcon" label="Do Not Pay" responsive-label="DNP" v-model="task.doNotPay" />
+            <TaskToggle :icon="TimerIcon" label="Smart Timer" responsive-label="Timer" v-model="task.smartTimer" />
+            <TaskToggle :icon="SkiIcon" label="Quick Queue" responsive-label="Quick Q." v-model="task.quickQueue" />
+            <TaskToggle :icon="HandIcon" label="Manual" v-model="task.manual" icon-class="" />
         </div>
 
         <!-- Task prefab -->
         <div class="my-3 border border-dark-650" />
-        <button
-            class="button-default ml-auto mt-4 bg-dark-400"
-            @click="createTask">
+        <button class="btn-modal ml-auto mt-4 w-36" @click="createTask">
             Create
-            <EditIcon />
+            <EditIcon class="ml-2" />
         </button>
     </Modal>
 </template>
@@ -151,7 +100,7 @@ import { ref, watch } from "vue";
 import { countries } from "@/stores/countries";
 import Modal from "@/components/ui/Modal.vue";
 import FormField from "@/components/ui/FormField.vue";
-import Switch from "@/components/ui/controls/atomic/Switch.vue";
+import TaskToggle from "@/components/ui/TaskToggle.vue";
 import {
     MailIcon,
     CameraIcon,
@@ -162,20 +111,17 @@ import {
     TagIcon,
     SkiIcon,
     HandIcon,
-    GroupIcon,
     ShieldIcon,
     TimerIcon,
     SavingsIcon,
-    EditIcon,
-    UpIcon,
-    DownIcon,
-    SandclockIcon,
-    CartIcon
+    EditIcon
 } from "@/components/icons";
 import { useUIStore } from "@/stores/ui";
 import Dropdown from "@/components/ui/controls/atomic/Dropdown.vue";
 import MultiDropdown from "@/components/ui/controls/atomic/MultiDropdown.vue";
-import { firstUpper, parseAxsEventUrl, removeDuplicates } from "@/stores/utils";
+import { firstUpper } from "@/libs/utils/string";
+import { parseAxsEventUrl } from "@/libs/utils/eventUrl";
+import { removeDuplicates } from "@/libs/utils/array";
 
 const ui = useUIStore();
 
@@ -250,7 +196,6 @@ watch(
             if (country) ui.setCurrentCountry(country, false, ui.currentModule);
 
             task.value.eventId = parsed.eventId;
-            debugger;
             if (parsed.promoId) task.value.promoId = parsed.promoId;
         } catch (ex) {
             ui.logger.Error("Could not parse url (2)", ex);
@@ -258,47 +203,4 @@ watch(
     }
 );
 
-// fetchConfigs();
 </script>
-
-<style lang="scss" scoped>
-.label-override {
-    @apply flex items-center;
-    color: #e1e1e4 !important;
-
-    svg {
-        @apply ml-2;
-
-        path {
-            fill: #e1e1e4 !important;
-        }
-    }
-}
-
-.task-switches {
-    h4 {
-        color: #e1e1e4;
-        @apply mx-auto flex items-center gap-x-2 text-center text-xs;
-    }
-
-    .switch-wrapper {
-        @apply gap-y-2;
-    }
-}
-
-@media (max-width: 720px) {
-    .task-switches {
-        h4 {
-            font-size: 12px !important;
-        }
-    }
-}
-
-.switch-wrapper {
-    svg {
-        path {
-            fill: oklch(0.65 0 0) !important;
-        }
-    }
-}
-</style>

package/src/components/Tasks/CreateTaskTM.vue

@@ -8,7 +8,7 @@
         </template>
 
         <!-- Task Form -->
-        <div class="grid-responsive-1-2 gap-responsive mb-4 mt-4">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4 mt-4">
             <!-- Event ID -->
             <FormField label="Event ID" :icon="StadiumIcon" required>
                 <input
@@ -43,30 +43,12 @@
             </FormField>
 
             <!-- Task Amount -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Amount
-                    <span class="ml-2 h-[18px]">#</span>
-                </label>
-                <div class="input-default">
-                    <input placeholder="20" min="1" type="number" pattern="\d*" v-model="task.taskQuantity" />
-                    <div class="input-incrementer">
-                        <button @click="task.taskQuantity++">
-                            <UpIcon />
-                        </button>
-                        <button @click="if (task.taskQuantity > 1) task.taskQuantity--;">
-                            <DownIcon />
-                        </button>
-                    </div>
-                </div>
-            </div>
+            <FormField label="Amount" :icon="HashIcon" incrementer @increment="task.taskQuantity++" @decrement="task.taskQuantity > 1 && task.taskQuantity--">
+                <input placeholder="20" min="1" type="number" pattern="\d*" v-model="task.taskQuantity" />
+            </FormField>
 
             <!-- Profile Tag(s)  -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Profile Tag(s)
-                    <TagIcon />
-                </label>
+            <FormField label="Profile Tag(s)" :icon="TagIcon" noWrapper>
                 <MultiDropdown
                     class="w-full will-change-auto"
                     :onSelect="(v) => (task.profileTags = v)"
@@ -76,7 +58,7 @@
                             return { label: opt, value: opt };
                         })
                     " />
-            </div>
+            </FormField>
 
             <!-- CL Origin -->
             <FormField v-if="isEU(ui.currentCountry.siteId)" label="CL Origin" :icon="AwardIcon">
@@ -84,11 +66,7 @@
             </FormField>
 
             <!-- Account Tag  -->
-            <div class="input-wrapper">
-                <label class="label-override mb-2">
-                    Account Tag
-                    <ScannerIcon />
-                </label>
+            <FormField label="Account Tag" :icon="ScannerIcon" noWrapper>
                 <Dropdown
                     :onClick="(f) => (task.accountTag = f)"
                     default="Default tag"
@@ -97,7 +75,7 @@
                     :allowDefault="false"
                     :capitalize="true"
                     class="dropdown w-full" />
-            </div>
+            </FormField>
 
             <!-- Start Offset -->
             <FormField label="Start Offset (Minutes)" :icon="ShieldIcon" incrementer @increment="task.startOffset = (task.startOffset || 0) + 1" @decrement="task.startOffset > 0 && task.startOffset--">
@@ -111,150 +89,37 @@
         </div>
         <div class="mb-3 border border-dark-650" />
         <!-- Task Switches -->
-        <div v-if="!isEU(ui.currentCountry.siteId)" class="task-switches grid grid-cols-3 justify-between gap-y-1">
-            <div class="switch-wrapper mb-2 flex flex-col">
-                <h4 class="text-responsive-sm">
-                    Aged
-                    <span class="hidden xs:block">Account</span>
-                    <SandclockIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.agedAccount" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    Manual
-                    <HandIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.manual" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Do Not Pay</span>
-                    <span class="block xs:hidden">DNP</span>
-                    <SavingsIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.doNotPay" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Quick Queue</span>
-                    <span class="block xs:hidden">Quick Q.</span>
-                    <SkiIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.quickQueue" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Login Later</span>
-                    <span class="block xs:hidden">Login Lat.</span>
-
-                    <GroupIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.loginAfterCart" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Smart Timer</span>
-                    <span class="block xs:hidden">Timer</span>
-                    <TimerIcon />
-                </h4>
-                <Switch class="mx-auto" v-model="task.smartTimer" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    <span class="hidden xs:block">Supports</span>
-                    OTP
-                    <MailIcon class="h-[17px] scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.otpAccount" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    Presale
-                    <span class="hidden xs:block">Queue</span>
-                    <AwardIcon class="scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.presaleMode" />
-            </div>
-            <div class="switch-wrapper flex flex-col">
-                <h4>
-                    Strict
-                    <span class="hidden xs:block">Presale</span>
-                    <AwardIcon class="scale-90" />
-                </h4>
-                <Switch class="mx-auto" v-model="task.presaleStrict" />
-            </div>
+        <div v-if="!isEU(ui.currentCountry.siteId)" class="grid grid-cols-3 justify-between gap-y-1">
+            <TaskToggle class="mb-2" :icon="SandclockIcon" label="Aged Account" responsive-label="Aged" v-model="task.agedAccount" icon-class="" />
+            <TaskToggle :icon="HandIcon" label="Manual" v-model="task.manual" icon-class="" />
+            <TaskToggle :icon="SavingsIcon" label="Do Not Pay" responsive-label="DNP" v-model="task.doNotPay" icon-class="" />
+            <TaskToggle :icon="SkiIcon" label="Quick Queue" responsive-label="Quick Q." v-model="task.quickQueue" icon-class="" />
+            <TaskToggle :icon="GroupIcon" label="Login Later" responsive-label="Login Lat." v-model="task.loginAfterCart" icon-class="" />
+            <TaskToggle :icon="TimerIcon" label="Smart Timer" responsive-label="Timer" v-model="task.smartTimer" icon-class="" />
+            <TaskToggle :icon="MailIcon" label="Supports OTP" responsive-label="OTP" v-model="task.otpAccount" icon-class="h-4.25 scale-90" />
+            <TaskToggle :icon="AwardIcon" label="Presale Queue" responsive-label="Presale" v-model="task.presaleMode" />
+            <TaskToggle :icon="AwardIcon" label="Strict Presale" responsive-label="Strict" v-model="task.presaleStrict" />
         </div>
         <div v-if="isEU(ui.currentCountry.siteId)">
-            <div class="task-switches mb-4 grid grid-cols-4 justify-between gap-y-4">
-                <div class="switch-wrapper flex flex-col">
-                    <h4 class="text-xs">
-                        Manual
-                        <HandIcon class="scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.manual" />
-                </div>
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        <span class="hidden xs:block">Do Not Pay</span>
-                        <span class="block xs:hidden">DNP</span>
-                        <SavingsIcon class="scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.doNotPay" />
-                </div>
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        <span class="hidden xs:block">Smart Timer</span>
-                        <span class="block xs:hidden">Timer</span>
-                        <TimerIcon class="scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.smartTimer" />
-                </div>
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        <span class="hidden xs:block">Login Later</span>
-                        <span class="block xs:hidden">Login Lat.</span>
-                        <GroupIcon class="scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.loginAfterCart" />
-                </div>
+            <div class="mb-4 grid grid-cols-4 justify-between gap-y-4">
+                <TaskToggle :icon="HandIcon" label="Manual" v-model="task.manual" />
+                <TaskToggle :icon="SavingsIcon" label="Do Not Pay" responsive-label="DNP" v-model="task.doNotPay" />
+                <TaskToggle :icon="TimerIcon" label="Smart Timer" responsive-label="Timer" v-model="task.smartTimer" />
+                <TaskToggle :icon="GroupIcon" label="Login Later" responsive-label="Login Lat." v-model="task.loginAfterCart" />
             </div>
 
-            <div class="task-switches grid grid-cols-4 justify-between gap-y-4">
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        <span class="hidden xs:block">Quick Queue</span>
-                        <span class="block xs:hidden">Quick Q.</span>
-                        <SkiIcon class="scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.quickQueue" />
-                </div>
-
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        Supports OTP
-                        <MailIcon class="h-[17px] scale-90" />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.otpAccount" />
-                </div>
-                <div class="switch-wrapper flex flex-col">
-                    <h4>
-                        Aged
-                        <span class="hidden xs:block">Account</span>
-                        <SandclockIcon />
-                    </h4>
-                    <Switch class="mx-auto" v-model="task.agedAccount" />
-                </div>
+            <div class="grid grid-cols-4 justify-between gap-y-4">
+                <TaskToggle :icon="SkiIcon" label="Quick Queue" responsive-label="Quick Q." v-model="task.quickQueue" />
+                <TaskToggle :icon="MailIcon" label="Supports OTP" v-model="task.otpAccount" icon-class="h-4.25 scale-90" />
+                <TaskToggle :icon="SandclockIcon" label="Aged Account" responsive-label="Aged" v-model="task.agedAccount" icon-class="" />
             </div>
         </div>
 
         <!-- Task prefab -->
         <div class="my-3 border border-dark-650" />
-        <button
-            class="button-default ml-auto mt-4 bg-dark-400"
-            @click="createTask">
+        <button class="btn-modal ml-auto mt-4 w-36" @click="createTask">
             Create
-            <EditIcon />
+            <EditIcon class="ml-2" />
         </button>
     </Modal>
 </template>
@@ -263,7 +128,7 @@
 import { ref, watch } from "vue";
 import Modal from "@/components/ui/Modal.vue";
 import FormField from "@/components/ui/FormField.vue";
-import Switch from "@/components/ui/controls/atomic/Switch.vue";
+import TaskToggle from "@/components/ui/TaskToggle.vue";
 import {
     MailIcon,
     CameraIcon,
@@ -279,17 +144,16 @@ import {
     TimerIcon,
     SavingsIcon,
     EditIcon,
-    UpIcon,
-    DownIcon,
     SandclockIcon,
-    CartIcon,
     PencilIcon
 } from "@/components/icons";
 import { useUIStore } from "@/stores/ui";
 import { countries } from "@/stores/countries";
 import Dropdown from "@/components/ui/controls/atomic/Dropdown.vue";
 import MultiDropdown from "@/components/ui/controls/atomic/MultiDropdown.vue";
-import { isEU, firstUpper, parseTmEventUrl, removeDuplicates } from "@/stores/utils";
+import { firstUpper } from "@/libs/utils/string";
+import { isEU, parseTmEventUrl } from "@/libs/utils/eventUrl";
+import { removeDuplicates } from "@/libs/utils/array";
 
 const ui = useUIStore();
 
@@ -388,23 +252,3 @@ watch(
 );
 </script>
 
-<style lang="scss" scoped>
-.label-override {
-    @apply flex items-center;
-    color: #e1e1e4 !important;
-
-    svg {
-        @apply ml-2;
-
-        path {
-            fill: #e1e1e4 !important;
-        }
-    }
-}
-
-.switch-wrapper {
-    svg path {
-        fill: oklch(0.65 0 0) !important;
-    }
-}
-</style>