fixed drizzle rust logic

src/components/haex/desktop/index.vue

@@ -17,6 +17,7 @@
       class="w-full h-full"
       @swiper="onSwiperInit"
       @slide-change="onSlideChange"
+      direction="vertical"
     >
       <SwiperSlide
         v-for="workspace in workspaces"

src/components/haex/extension/marketplace-card.vue

@@ -52,7 +52,7 @@
 
         <p
           v-if="extension.description"
-          class="text-sm text-gray-600 dark:text-gray-300 mt-2 line-clamp-2"
+          class="hidden @lg:flex text-sm text-gray-600 dark:text-gray-300 mt-2 line-clamp-2"
         >
           {{ extension.description }}
         </p>
@@ -67,7 +67,9 @@
           >
             <UIcon name="i-heroicons-check-circle-solid" />
             <span v-if="!extension.installedVersion">{{ t('installed') }}</span>
-            <span v-else>{{ t('installedVersion', { version: extension.installedVersion }) }}</span>
+            <span v-else>{{
+              t('installedVersion', { version: extension.installedVersion })
+            }}</span>
           </div>
           <div
             v-if="extension.downloads"
@@ -114,10 +116,16 @@
       <div class="flex items-center justify-between gap-2">
         <UButton
           :label="getInstallButtonLabel()"
-          :color="extension.isInstalled && !extension.installedVersion ? 'neutral' : 'primary'"
+          :color="
+            extension.isInstalled && !extension.installedVersion
+              ? 'neutral'
+              : 'primary'
+          "
           :disabled="extension.isInstalled && !extension.installedVersion"
           :icon="
-            extension.isInstalled && !extension.installedVersion ? 'i-heroicons-check' : 'i-heroicons-arrow-down-tray'
+            extension.isInstalled && !extension.installedVersion
+              ? 'i-heroicons-check'
+              : 'i-heroicons-arrow-down-tray'
           "
           size="sm"
           @click.stop="$emit('install')"

src/components/haex/system/marketplace.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="flex flex-col h-full">
+  <div class="flex flex-col h-full bg-default">
     <!-- Header with Actions -->
     <div
-      class="flex flex-col sm:flex-row sm:items-center justify-between gap-4 p-6 border-b border-gray-200 dark:border-gray-800"
+      class="flex flex-col @lg:flex-row @lg:items-center justify-between gap-4 p-6 border-b border-gray-200 dark:border-gray-800"
     >
       <div>
         <h1 class="text-2xl font-bold">
@@ -14,14 +14,14 @@
       </div>
 
       <div
-        class="flex flex-col sm:flex-row items-stretch sm:items-center gap-3"
+        class="flex flex-col @lg:flex-row items-stretch @lg:items-center gap-3"
       >
         <!-- Marketplace Selector -->
         <USelectMenu
           v-model="selectedMarketplace"
           :items="marketplaces"
           value-key="id"
-          class="w-full sm:w-48"
+          class="w-full @lg:w-48"
         >
           <template #leading>
             <UIcon name="i-heroicons-building-storefront" />
@@ -34,13 +34,14 @@
           icon="i-heroicons-arrow-up-tray"
           color="neutral"
           @click="onSelectExtensionAsync"
+          block
         />
       </div>
     </div>
 
     <!-- Search and Filters -->
     <div
-      class="flex flex-col sm:flex-row items-stretch sm:items-center gap-4 p-6 border-b border-gray-200 dark:border-gray-800"
+      class="flex flex-col @lg:flex-row items-stretch @lg:items-center gap-4 p-6 border-b border-gray-200 dark:border-gray-800"
     >
       <UInput
         v-model="searchQuery"
@@ -53,7 +54,7 @@
         :items="categories"
         :placeholder="t('filter.category')"
         value-key="id"
-        class="w-full sm:w-48"
+        class="w-full @lg:w-48"
       >
         <template #leading>
           <UIcon name="i-heroicons-tag" />
@@ -65,7 +66,7 @@
     <div class="flex-1 overflow-auto p-6">
       <div
         v-if="filteredExtensions.length"
-        class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"
+        class="grid grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3 gap-4"
       >
         <!-- Marketplace Extension Card -->
         <HaexExtensionMarketplaceCard

src/components/haex/system/settings.vue

@@ -1,8 +1,6 @@
 <template>
-  <div>
-    <div
-      class="grid grid-rows-2 sm:grid-cols-2 sm:gap-2 p-2 max-w-2xl w-full h-fit"
-    >
+  <div class="w-full h-full bg-default">
+    <div class="grid grid-cols-2 p-2">
       <div class="p-2">{{ t('language') }}</div>
       <div><UiDropdownLocale @select="onSelectLocaleAsync" /></div>
 
@@ -34,6 +32,8 @@
           @change="onUpdateDeviceNameAsync"
         />
       </div>
+
+      <div class="h-full"></div>
     </div>
   </div>
 </template>

src/components/haex/window/index.vue

@@ -5,7 +5,7 @@
     :class="[
       'absolute bg-default/80 backdrop-blur-xl rounded-xl shadow-2xl overflow-hidden isolate',
       'border border-gray-200 dark:border-gray-700 transition-all ease-out duration-600 ',
-      'flex flex-col',
+      'flex flex-col @container',
       { 'select-none': isResizingOrDragging },
       isActive ? 'z-50' : 'z-10',
     ]"
@@ -208,6 +208,7 @@ useDrag(
         }
       }
 
+      globalThis.getSelection()?.removeAllRanges()
       emit('positionChanged', x.value, y.value)
       emit('sizeChanged', width.value, height.value)
       emit('dragEnd')

src/components/haex/workspace/card.vue

@@ -2,7 +2,7 @@
   <UCard
     class="cursor-pointer transition-all h-32 w-72 shrink-0 group duration-500"
     :class="[
-      workspace.position === currentWorkspaceIndex
+      workspace.id === currentWorkspace?.id
         ? 'ring-2 ring-secondary bg-secondary/10'
         : 'hover:ring-2 hover:ring-gray-300',
     ]"
@@ -31,5 +31,5 @@ defineProps<{ workspace: IWorkspace }>()
 
 const workspaceStore = useWorkspaceStore()
 
-const { currentWorkspaceIndex } = storeToRefs(workspaceStore)
+const { currentWorkspace } = storeToRefs(workspaceStore)
 </script>