From b23186d42a53693dda83819a3cfdf5e04e76f7de Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Sat, 9 Sep 2023 17:44:37 +0530
Subject: [PATCH 1/6] fix: attachment size

---
 .../components/cell/attachment/index.vue      | 24 +++++++++++++++----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index c7dada364a..a2bf9513fa 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -150,7 +150,7 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
       height: isForm ? undefined : `max(${(rowHeight || 1) * 1.8}rem, 41px)`,
     }"
     class="nc-attachment-cell relative flex color-transition flex items-center"
-    :class="{'justify-center': !active, 'justify-between': active}"
+    :class="{ 'justify-center': !active, 'justify-between': active }"
   >
     <LazyCellAttachmentCarousel />
 
@@ -209,15 +209,29 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
               <div class="text-center w-full">{{ item.title }}</div>
             </template>
             <div v-if="isImage(item.title, item.mimetype ?? item.type)">
-              <div class="nc-attachment flex items-center justify-center" :class="{'ml-2':active}" @click.stop="selectedImage = item">
+              <div
+                class="nc-attachment flex items-center justify-center"
+                :class="{ 'ml-2': active }"
+                @click.stop="selectedImage = item"
+              >
                 <LazyCellAttachmentImage
-                  class="max-h-[1.8rem] max-w-[1.8rem]"
+                  class="h-[1.8rem] w-[1.8rem]"
                   :alt="item.title || `#${i}`"
+                  :class="{
+                    'h-[2.8rem] w-[3.8rem]': rowHeight === 2,
+                    'h-[4.8rem] w-[5.8rem]': rowHeight === 4,
+                    'h-[5.8rem] w-[6rem]': rowHeight === 6,
+                  }"
                   :srcs="getPossibleAttachmentSrc(item)"
                 />
               </div>
             </div>
-            <div v-else class="nc-attachment flex items-center justify-center" :class="{'ml-2':active}" @click="openAttachment(item)">
+            <div
+              v-else
+              class="nc-attachment flex items-center justify-center"
+              :class="{ 'ml-2': active }"
+              @click="openAttachment(item)"
+            >
               <component :is="FileIcon(item.icon)" v-if="item.icon" />
 
               <IcOutlineInsertDriveFile v-else />
@@ -252,7 +266,7 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
 .nc-cell {
   .nc-attachment-cell {
     .nc-attachment {
-      @apply w-[1.8rem] h-[1.8rem] min-h-[1.8rem] min-w-[1.8rem] ring-1 ring-gray-300 rounded;
+      // @apply w-[1.8rem] h-[1.8rem] min-h-[1.8rem] min-w-[1.8rem] ring-1 ring-gray-300 rounded;
     }
 
     .ghost,

From fc10153ba8d1feedc1aa2aeefde03d49a8d4af43 Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Sat, 9 Sep 2023 17:47:42 +0530
Subject: [PATCH 2/6] fix: css

---
 packages/nc-gui/components/cell/attachment/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index a2bf9513fa..35d67ace7b 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -266,7 +266,7 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
 .nc-cell {
   .nc-attachment-cell {
     .nc-attachment {
-      // @apply w-[1.8rem] h-[1.8rem] min-h-[1.8rem] min-w-[1.8rem] ring-1 ring-gray-300 rounded;
+      @apply min-h-[1.8rem] min-w-[1.8rem] ring-1 ring-gray-300 rounded;
     }
 
     .ghost,

From 5497056fd3d44159ebb03426f5ae98b2b45d45ef Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Mon, 11 Sep 2023 11:27:10 +0530
Subject: [PATCH 3/6] feat: large attachment size on drawer

---
 packages/nc-gui/components/cell/attachment/index.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index 35d67ace7b..1fda397520 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -2,6 +2,7 @@
 import { onKeyDown } from '@vueuse/core'
 import { useProvideAttachmentCell } from './utils'
 import { useSortable } from './sort'
+import { isDrawerExist } from '~/utils/browserUtils'
 import {
   ActiveCellInj,
   CurrentCellInj,
@@ -139,7 +140,7 @@ useSelectedCellKeyupListener(inject(ActiveCellInj, ref(false)), (e) => {
   }
 })
 
-const rowHeight = inject(RowHeightInj, ref(1.8))
+const rowHeight = inject(RowHeightInj, ref())
 </script>
 
 <template>
@@ -220,7 +221,7 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
                   :class="{
                     'h-[2.8rem] w-[3.8rem]': rowHeight === 2,
                     'h-[4.8rem] w-[5.8rem]': rowHeight === 4,
-                    'h-[5.8rem] w-[6rem]': rowHeight === 6,
+                    'h-[5.8rem] w-[6rem]': rowHeight === 6 || isDrawerExist(),
                   }"
                   :srcs="getPossibleAttachmentSrc(item)"
                 />
@@ -266,7 +267,7 @@ const rowHeight = inject(RowHeightInj, ref(1.8))
 .nc-cell {
   .nc-attachment-cell {
     .nc-attachment {
-      @apply min-h-[1.8rem] min-w-[1.8rem] ring-1 ring-gray-300 rounded;
+      @apply min-h-[1.8rem] min-w-[1.8rem] !ring-1 !ring-gray-300 !rounded;
     }
 
     .ghost,

From 36a10dbb492a396085a19548e8a028bb220c6943 Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Mon, 11 Sep 2023 21:48:08 +0530
Subject: [PATCH 4/6] fix: added drawer injection

---
 packages/nc-gui/components/cell/attachment/index.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index 1fda397520..7d6f9e63e5 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -2,11 +2,11 @@
 import { onKeyDown } from '@vueuse/core'
 import { useProvideAttachmentCell } from './utils'
 import { useSortable } from './sort'
-import { isDrawerExist } from '~/utils/browserUtils'
 import {
   ActiveCellInj,
   CurrentCellInj,
   DropZoneRef,
+  IsExpandedFormOpenInj,
   RowHeightInj,
   iconMap,
   inject,
@@ -43,6 +43,8 @@ const currentCellRef = inject(CurrentCellInj, dropZoneInjection.value)
 
 const isLockedMode = inject(IsLockedInj, ref(false))
 
+const isDrawerExist = inject(IsExpandedFormOpenInj, ref())
+
 const { isSharedForm } = useSmartsheetStoreOrThrow()!
 
 const { getPossibleAttachmentSrc, openAttachment } = useAttachment()
@@ -219,9 +221,9 @@ const rowHeight = inject(RowHeightInj, ref())
                   class="h-[1.8rem] w-[1.8rem]"
                   :alt="item.title || `#${i}`"
                   :class="{
-                    'h-[2.8rem] w-[3.8rem]': rowHeight === 2,
+                    'h-11.5 w-[3.8rem]': rowHeight === 2,
                     'h-[4.8rem] w-[5.8rem]': rowHeight === 4,
-                    'h-[5.8rem] w-[6rem]': rowHeight === 6 || isDrawerExist(),
+                    'h-[5.8rem] w-[6rem]': rowHeight === 6 || isDrawerExist,
                   }"
                   :srcs="getPossibleAttachmentSrc(item)"
                 />

From a453e41e5d159b7c69cf228c6f0db7f41eaae5cc Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Tue, 12 Sep 2023 11:00:24 +0530
Subject: [PATCH 5/6] fix: tailwind measures

---
 packages/nc-gui/components/cell/attachment/index.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index 7d6f9e63e5..04d7c71c49 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -43,7 +43,7 @@ const currentCellRef = inject(CurrentCellInj, dropZoneInjection.value)
 
 const isLockedMode = inject(IsLockedInj, ref(false))
 
-const isDrawerExist = inject(IsExpandedFormOpenInj, ref())
+const isExpandedForm = inject(IsExpandedFormOpenInj, ref())
 
 const { isSharedForm } = useSmartsheetStoreOrThrow()!
 
@@ -218,12 +218,12 @@ const rowHeight = inject(RowHeightInj, ref())
                 @click.stop="selectedImage = item"
               >
                 <LazyCellAttachmentImage
-                  class="h-[1.8rem] w-[1.8rem]"
+                  class="h-7 w-7"
                   :alt="item.title || `#${i}`"
                   :class="{
-                    'h-11.5 w-[3.8rem]': rowHeight === 2,
-                    'h-[4.8rem] w-[5.8rem]': rowHeight === 4,
-                    'h-[5.8rem] w-[6rem]': rowHeight === 6 || isDrawerExist,
+                    'h-11.5 w-12.8': rowHeight === 2,
+                    'h-16.8 w-20.8': rowHeight === 4,
+                    'h-20.8 w-30': rowHeight === 6 || isExpandedForm,
                   }"
                   :srcs="getPossibleAttachmentSrc(item)"
                 />

From de5433e741283b6fbe0f140a9b2584fd2f8dd54c Mon Sep 17 00:00:00 2001
From: sreehari jayaraj <sreeharivijaya2003@gmail.com>
Date: Tue, 12 Sep 2023 15:00:42 +0530
Subject: [PATCH 6/6] fix: deafult styles

---
 packages/nc-gui/components/cell/attachment/index.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index 04d7c71c49..4c4a35a267 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -43,7 +43,7 @@ const currentCellRef = inject(CurrentCellInj, dropZoneInjection.value)
 
 const isLockedMode = inject(IsLockedInj, ref(false))
 
-const isExpandedForm = inject(IsExpandedFormOpenInj, ref())
+const isExpandedForm = inject(IsExpandedFormOpenInj, ref(false))
 
 const { isSharedForm } = useSmartsheetStoreOrThrow()!
 
@@ -200,8 +200,8 @@ const rowHeight = inject(RowHeightInj, ref())
     <template v-if="visibleItems.length">
       <div
         ref="sortableRef"
-        :class="{ dragging }"
-        class="flex cursor-pointer justify-center items-center flex-wrap gap-2 py-1.5 scrollbar-thin-dull overflow-hidden mt-0 items-start"
+        :class="{ dragging, 'justify-center': !isExpandedForm }"
+        class="flex cursor-pointer items-center flex-wrap gap-2 py-1.5 scrollbar-thin-dull overflow-hidden mt-0 items-start"
         :style="{
           maxHeight: isForm ? undefined : `max(${(rowHeight || 1) * 1.8}rem, 41px)`,
         }"
@@ -213,17 +213,17 @@ const rowHeight = inject(RowHeightInj, ref())
             </template>
             <div v-if="isImage(item.title, item.mimetype ?? item.type)">
               <div
-                class="nc-attachment flex items-center justify-center"
+                class="nc-attachment flex items-center flex-col flex-wrap justify-center"
                 :class="{ 'ml-2': active }"
                 @click.stop="selectedImage = item"
               >
                 <LazyCellAttachmentImage
-                  class="h-7 w-7"
                   :alt="item.title || `#${i}`"
                   :class="{
+                    'h-7.5 w-8.8': rowHeight === 1,
                     'h-11.5 w-12.8': rowHeight === 2,
                     'h-16.8 w-20.8': rowHeight === 4,
-                    'h-20.8 w-30': rowHeight === 6 || isExpandedForm,
+                    'h-20.8 !w-30': isExpandedForm || rowHeight === 6,
                   }"
                   :srcs="getPossibleAttachmentSrc(item)"
                 />