fix(gui-v2): chrome applying pointer events while dragging sortable el

packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue

@@ -31,6 +31,9 @@ const { api } = useApi()
 /** Selected view(s) for menu */
 const selected = ref<string[]>([])
 
+/** dragging renamable view items */
+let dragging = $ref(false)
+
 let deleteModalVisible = $ref(false)
 
 /** view to delete for modal */
@@ -197,3 +200,18 @@ function onDeleted() {
 
   <dlg-view-delete v-model="deleteModalVisible" :view="toDelete" @deleted="onDeleted" />
 </template>
+
+<style>
+.ghost,
+.ghost > * {
+  @apply !pointer-events-none;
+}
+
+.dragging .nc-drag-icon {
+  @apply !hidden;
+}
+
+.dragging .nc-icon:not(.nc-drag-icon) {
+  @apply !block;
+}
+</style>

packages/nc-gui-v2/components/smartsheet/sidebar/RenameableMenuItem.vue

@@ -137,8 +137,9 @@ function onStopEdit() {
     <div v-t="['a:view:open', { view: vModel.type }]" class="text-xs flex items-center w-full gap-2">
       <div class="flex w-auto">
         <MdiDrag
-          class="hidden group-hover:block transition-opacity opacity-0 group-hover:opacity-100 text-gray-500 nc-drag-icon cursor-move"
+          class="nc-drag-icon hidden group-hover:block transition-opacity opacity-0 group-hover:opacity-100 text-gray-500 cursor-move"
           :class="`nc-child-draggable-icon-${vModel.title}`"
+          @click.stop.prevent
         />
 
         <component :is="viewIcons[vModel.type].icon" class="group-hover:hidden" :class="`text-${viewIcons[vModel.type].color}`" />