@necrolab/dashboard 0.4.31 → 0.4.33

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@necrolab/dashboard",
-    "version": "0.4.31",
+    "version": "0.4.33",
     "scripts": {
         "build": "rm -rf dist && vite build && npx workbox-cli generateSW workbox-config.js",
         "dev": "vite",

package/src/components/Editors/Profile/CreateProfile.vue

@@ -111,7 +111,7 @@
                             :options="usStates"
                             :allowDefault="false"
                             rightAmount="right-2"
-                            :chosen="profile.state"
+                            :value="profile.state"
                         />
                     </div>
                     <div v-else :class="`input-default ${errors.includes('state') ? 'error' : ''}`">

package/src/components/Filter/Filter.vue

@@ -288,11 +288,23 @@ props.filterBuilder.onUpdate(() => {
 
 <style scoped>
 .filter-card {
-    @apply bg-dark-500 border border-dark-550 mb-1 shadow-sm relative;
+    @apply bg-dark-500 border-dark-550 relative;
+    border: 1px solid rgba(74, 74, 97, 0.3);
+    margin-bottom: 8px;
+    transition: all 0.15s ease-out;
 }
 
-.filter-card:not(:last-child) {
-    border-bottom: 2px solid #1B1C2B;
+.filter-card:hover:not(.expanded-filter) {
+    border-color: rgba(74, 74, 97, 0.6);
+    background-color: rgba(45, 47, 74, 0.8);
+}
+
+.expanded-filter:hover {
+    border-color: rgba(74, 74, 97, 0.8);
+}
+
+.filter-card + .filter-card {
+    border-top: 1px solid rgba(74, 74, 97, 0.2);
 }
 
 .filter-type-badge {

package/src/components/Tasks/Task.vue

@@ -34,7 +34,8 @@
                 <span
                     class="ml-1 font-bold"
                     :class="{
-                        'text-red-400': props.task._timeLeftString === '00:00' || props.task._timeLeftString === 'No Cartholds'
+                        'text-red-400':
+                            props.task._timeLeftString === '00:00' || props.task._timeLeftString === 'No Cartholds'
                     }"
                 >
                     {{ props.task._timeLeftString !== "00:00" ? props.task._timeLeftString : "Expired" }}
@@ -46,11 +47,13 @@
                 <!-- Status circle -->
                 <div
                     class="status-indicator mx-1 md:ml-3 ml-2"
-                    :class="colorToClass(
-                        props.task.active || props.task.status.toLowerCase() === 'idle'
-                            ? props.task.statusColor
-                            : 'red'
-                    )"
+                    :class="
+                        colorToClass(
+                            props.task.active || props.task.status.toLowerCase() === 'idle'
+                                ? props.task.statusColor
+                                : 'red'
+                        )
+                    "
                 ></div>
                 <!-- Actual status -->
                 <span class="font-bold text-sm p-1 md:mr-3 mr-2 truncate uppercase">{{
@@ -68,12 +71,12 @@
                         <PlayIcon />
                     </button>
                 </li>
-                <li v-if="task.status?.toLowerCase().includes('waiting') && props.task._timeLeftString !== '00:00'">
+                <li v-if="task.status?.toLowerCase() == 'waiting' && props.task._timeLeftString !== '00:00'">
                     <button @click="ui.continueTask(task.taskId, 'autocheckout')">
                         <BagWhiteIcon />
                     </button>
                 </li>
-                <li v-if="task.status?.toLowerCase().includes('waiting')">
+                <li v-if="task.status?.toLowerCase() == 'waiting'">
                     <button @click="ui.continueTask(task.taskId, 'change_reservation')">
                         <EditIcon />
                     </button>
@@ -83,7 +86,10 @@
                         <TrashIcon />
                     </button>
                 </li>
-                <li class="text-xl -mt-2" @click.right.prevent="window.setTimeout(() => ui.setOpenContextMenu(task.taskId), 10)">
+                <li
+                    class="text-xl -mt-2"
+                    @click.right.prevent="window.setTimeout(() => ui.setOpenContextMenu(task.taskId), 10)"
+                >
                     <button class="mt-1" @click="props.task.isExpanded = !props.task.isExpanded">
                         <span>{{ props.task.isExpanded ? "-" : "+" }}</span>
                     </button>
@@ -100,7 +106,6 @@
                 class="col-span-12 flex flex-wrap gap-x-4 gap-y-4 lg:gap-x-10 pt-8 pb-2 xl:justify-around will-change-auto"
                 v-if="props.task.isExpanded"
             >
-
                 <!-- Details -->
                 <TaskLabel
                     class="md:hidden"
@@ -180,15 +185,15 @@ h4 {
 
 .task-buttons {
     @apply flex mx-auto gap-x-2;
-    
+
     button {
         @apply p-1 rounded transition-colors hover:bg-dark-500;
     }
-    
+
     svg {
         @apply w-4 h-4;
     }
-    
+
     img {
         @apply w-4 h-4;
     }
@@ -198,15 +203,15 @@ h4 {
     h4 {
         font-size: 10px;
     }
-    
+
     .task-buttons {
         @apply gap-x-1;
     }
-    
+
     .task-id {
         font-size: 6px;
     }
-    
+
     .task-id-alt {
         font-size: 7px;
     }

package/src/components/ui/controls/atomic/Dropdown.vue

@@ -30,7 +30,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from "vue";
+import { ref, computed, watch } from "vue";
 import { DownIcon, CheckmarkIcon } from "@/components/icons";
 import { useUIStore } from "@/stores/ui";
 const ui = useUIStore();
@@ -47,6 +47,11 @@ const props = defineProps({
 });
 
 const currentValue = ref(props.value);
+
+// Watch for changes to the value prop and update currentValue
+watch(() => props.value, (newValue) => {
+    currentValue.value = newValue;
+});
 const id = Math.random();
 const opened = computed(() => ui.currentDropdown === id);
 

package/src/stores/ui.js

@@ -236,7 +236,10 @@ export const useUIStore = defineStore("ui", () => {
         queueStats.value.sleeping = relevantTasks.filter((t) =>
             sleepingStatuses.includes(t.status.toLowerCase())
         ).length;
-        const positions = relevantTasks.map((t) => t.queuePosition).filter((e) => !isNaN(e));
+        const positions = relevantTasks
+            .map((t) => t.queuePosition)
+            .filter((e) => !isNaN(e))
+            .filter(Boolean);
         queueStats.value.nextQueuePasses = positions.sort((a, b) => a - b);
     };
 

package/src/views/FilterBuilder.vue

@@ -356,7 +356,10 @@ const hasWildcardFilter = computed(() => {
 
 const addWildcardFilter = () => {
     if (!hasWildcardFilter.value) {
+        // Close any expanded filter first
+        filterBuilder.value.setExpandedFilter(null);
         filterBuilder.value.addFilter({ buyAny: true, eventId: filterBuilder.value.currentEventId });
+        filterBuilder.value.updateCss();
     }
 };
 
@@ -636,7 +639,8 @@ watch(renderSeats, async () => {
 
 /* Enhanced table and filter styling */
 .filters-container {
-    @apply space-y-1;
+    @apply space-y-0;
+    padding: 4px;
 }
 
 /* Dragging states for better UX */