diff --git a/packages/nc-gui/components.d.ts b/packages/nc-gui/components.d.ts
index 7809d0a39b..05d859d72c 100644
--- a/packages/nc-gui/components.d.ts
+++ b/packages/nc-gui/components.d.ts
@@ -69,6 +69,7 @@ declare module '@vue/runtime-core' {
     ATextarea: typeof import('ant-design-vue/es')['Textarea']
     ATimePicker: typeof import('ant-design-vue/es')['TimePicker']
     ATooltip: typeof import('ant-design-vue/es')['Tooltip']
+    ATree: typeof import('ant-design-vue/es')['Tree']
     ATypographyTitle: typeof import('ant-design-vue/es')['TypographyTitle']
     AUploadDragger: typeof import('ant-design-vue/es')['UploadDragger']
     BiFiletypeJson: typeof import('~icons/bi/filetype-json')['default']
diff --git a/packages/nc-gui/components/cell/attachment/Carousel.vue b/packages/nc-gui/components/cell/attachment/Carousel.vue
index 63a7c1bb0f..bf0bf3983b 100644
--- a/packages/nc-gui/components/cell/attachment/Carousel.vue
+++ b/packages/nc-gui/components/cell/attachment/Carousel.vue
@@ -70,13 +70,13 @@ onClickOutside(carouselRef, () => {
         >
           <template #prevArrow>
             <div class="custom-slick-arrow left-2 z-1">
-              <MaterialSymbolsArrowCircleLeftRounded class="bg-white rounded-full" />
+              <MaterialSymbolsArrowCircleLeftRounded class="rounded-full" />
             </div>
           </template>
 
           <template #nextArrow>
             <div class="custom-slick-arrow !right-2 z-1">
-              <MaterialSymbolsArrowCircleRightRounded class="bg-white rounded-full" />
+              <MaterialSymbolsArrowCircleRightRounded class="rounded-full" />
             </div>
           </template>
 
@@ -105,6 +105,9 @@ onClickOutside(carouselRef, () => {
 </template>
 
 <style scoped>
+.ant-carousel :deep(.custom-slick-arrow .nc-icon):hover {
+  @apply !bg-white;
+}
 .ant-carousel :deep(.slick-dots) {
   @apply relative mt-4;
 }
diff --git a/packages/nc-gui/components/cell/attachment/Modal.vue b/packages/nc-gui/components/cell/attachment/Modal.vue
index f2d317014b..23576227dd 100644
--- a/packages/nc-gui/components/cell/attachment/Modal.vue
+++ b/packages/nc-gui/components/cell/attachment/Modal.vue
@@ -20,6 +20,9 @@ const {
   downloadFile,
   updateModelValue,
   selectedImage,
+  selectedVisibleItems,
+  bulkDownloadFiles,
+  renameFile,
 } = useAttachmentCell()!
 
 // todo: replace placeholder var
@@ -44,15 +47,30 @@ function onClick(item: Record<string, any>) {
   selectedImage.value = item
   modalVisible.value = false
 
-  const stopHandle = watch(selectedImage, (nextImage, _, onCleanup) => {
+  const stopHandle = watch(selectedImage, (nextImage) => {
     if (!nextImage) {
       setTimeout(() => {
         modalVisible.value = true
       }, 50)
       stopHandle?.()
     }
+  })
+}
 
-    onCleanup(() => stopHandle?.())
+function onRemoveFileClick(title: any, i: number) {
+  Modal.confirm({
+    title: `Do you want to delete '${title}'?`,
+    wrapClassName: 'nc-modal-attachment-delete',
+    okText: 'Yes',
+    okType: 'danger',
+    cancelText: 'No',
+    onOk() {
+      try {
+        removeFile(i)
+      } catch (e: any) {
+        message.error(e.message)
+      }
+    },
   })
 }
 </script>
@@ -71,6 +89,7 @@ function onClick(item: Record<string, any>) {
         <div
           v-if="isSharedForm || (!readOnly && isUIAllowed('tableAttachment') && !isPublic && !isLocked)"
           class="nc-attach-file group"
+          data-testid="attachment-expand-file-picker-button"
           @click="open"
         >
           <MaterialSymbolsAttachFile class="transform group-hover:(text-accent scale-120)" />
@@ -82,6 +101,10 @@ function onClick(item: Record<string, any>) {
           Viewing Attachments of
           <div class="font-semibold underline">{{ column?.title }}</div>
         </div>
+
+        <div v-if="selectedVisibleItems.includes(true)" class="flex flex-1 items-center gap-3 justify-end mr-[30px]">
+          <a-button type="primary" class="nc-attachment-download-all" @click="bulkDownloadFiles"> Bulk Download </a-button>
+        </div>
       </div>
     </template>
 
@@ -100,23 +123,37 @@ function onClick(item: Record<string, any>) {
       <div ref="sortableRef" :class="{ dragging }" class="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-6 relative p-6">
         <div v-for="(item, i) of visibleItems" :key="`${item.title}-${i}`" class="flex flex-col gap-1">
           <a-card class="nc-attachment-item group">
+            <a-checkbox
+              v-model:checked="selectedVisibleItems[i]"
+              class="nc-attachment-checkbox group-hover:(opacity-100)"
+              :class="{ '!opacity-100': selectedVisibleItems[i] }"
+            />
+
             <a-tooltip v-if="!readOnly">
               <template #title> Remove File </template>
               <MdiCloseCircle
                 v-if="isSharedForm || (isUIAllowed('tableAttachment') && !isPublic && !isLocked)"
                 class="nc-attachment-remove"
-                @click.stop="removeFile(i)"
+                @click.stop="onRemoveFileClick(item.title, i)"
               />
             </a-tooltip>
 
             <a-tooltip placement="bottom">
-              <template #title> Download file </template>
+              <template #title> Download File </template>
 
               <div class="nc-attachment-download group-hover:(opacity-100)">
                 <MdiDownload @click.stop="downloadFile(item)" />
               </div>
             </a-tooltip>
 
+            <a-tooltip placement="bottom">
+              <template #title> Rename File </template>
+
+              <div class="nc-attachment-download group-hover:(opacity-100) mr-[35px]">
+                <MdiEditOutline @click.stop="renameFile(item, i)" />
+              </div>
+            </a-tooltip>
+
             <div
               :class="[dragging ? 'cursor-move' : 'cursor-pointer']"
               class="nc-attachment h-full w-full flex items-center justify-center"
@@ -195,6 +232,11 @@ function onClick(item: Record<string, any>) {
     @apply active:(ring border-0 ring-accent);
   }
 
+  .nc-attachment-checkbox {
+    @apply absolute top-2 left-2;
+    @apply transition-opacity duration-150 ease-in opacity-0;
+  }
+
   .nc-attachment-remove {
     @apply absolute top-2 right-2 bg-white;
     @apply hover:(ring ring-red-500);
diff --git a/packages/nc-gui/components/cell/attachment/RenameFile.vue b/packages/nc-gui/components/cell/attachment/RenameFile.vue
new file mode 100644
index 0000000000..5658a60f4a
--- /dev/null
+++ b/packages/nc-gui/components/cell/attachment/RenameFile.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import { generateUniqueName, onKeyStroke, onMounted, reactive, ref } from '#imports'
+
+const props = defineProps<{
+  title: string
+}>()
+
+const emit = defineEmits<{
+  (event: 'rename', value: string): void
+  (event: 'cancel'): void
+}>()
+
+const inputEl = ref()
+
+const visible = ref(true)
+
+const form = reactive({
+  title: props.title,
+})
+
+function renameFile(fileName: string) {
+  visible.value = false
+  emit('rename', fileName)
+}
+
+async function useRandomName() {
+  form.title = await generateUniqueName()
+}
+
+const rules = {
+  title: [{ required: true, message: 'title is required.' }],
+}
+
+function onCancel() {
+  visible.value = false
+  emit('cancel')
+}
+
+onKeyStroke('Escape', onCancel)
+
+onMounted(() => {
+  inputEl.value.select()
+  inputEl.value.focus()
+})
+</script>
+
+<template>
+  <a-modal
+    :visible="visible"
+    :closable="false"
+    :mask-closable="false"
+    destroy-on-close
+    title="Rename file"
+    class="nc-attachment-rename-modal"
+    width="min(100%, 620px)"
+    :footer="null"
+    centered
+    @cancel="onCancel"
+  >
+    <div class="flex flex-col items-center justify-center h-full">
+      <a-form class="w-full h-full" no-style :model="form" @finish="renameFile(form.title)">
+        <a-form-item class="w-full" name="title" :rules="rules.title">
+          <a-input ref="inputEl" v-model:value="form.title" class="w-full" :placeholder="$t('general.rename')" />
+        </a-form-item>
+        <div class="flex items-center justify-center gap-6 w-full mt-4">
+          <button class="scaling-btn bg-opacity-100" type="submit">
+            <span>{{ $t('general.confirm') }}</span>
+          </button>
+          <button class="scaling-btn bg-opacity-100" type="button" @click="useRandomName">
+            <span>{{ $t('title.generateRandomName') }}</span>
+          </button>
+        </div>
+      </a-form>
+    </div>
+  </a-modal>
+</template>
+
+<style scoped lang="scss">
+.nc-attachment-rename-modal {
+  .ant-input-affix-wrapper,
+  .ant-input {
+    @apply !appearance-none my-1 border-1 border-solid border-primary border-opacity-50 rounded;
+  }
+}
+</style>
diff --git a/packages/nc-gui/components/cell/attachment/index.vue b/packages/nc-gui/components/cell/attachment/index.vue
index 7a4e99a315..7cf0364f86 100644
--- a/packages/nc-gui/components/cell/attachment/index.vue
+++ b/packages/nc-gui/components/cell/attachment/index.vue
@@ -60,6 +60,7 @@ const {
   selectedImage,
   isReadonly,
   storedFiles,
+  getAttachmentUrl,
 } = useProvideAttachmentCell(updateModelValue)
 
 watch(
@@ -97,10 +98,19 @@ const { isOverDropZone } = useDropZone(currentCellRef as any, onDrop)
 /** on new value, reparse our stored attachments */
 watch(
   () => modelValue,
-  (nextModel) => {
+  async (nextModel) => {
     if (nextModel) {
       try {
-        const nextAttachments = ((typeof nextModel === 'string' ? JSON.parse(nextModel) : nextModel) || []).filter(Boolean)
+        let nextAttachments = ((typeof nextModel === 'string' ? JSON.parse(nextModel) : nextModel) || []).filter(Boolean)
+
+        // reconstruct the url
+        // See /packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts for the details
+        nextAttachments = await Promise.all(
+          nextAttachments.map(async (attachment: any) => ({
+            ...attachment,
+            url: await getAttachmentUrl(attachment),
+          })),
+        )
 
         if (isPublic.value && isForm.value) {
           storedFiles.value = nextAttachments
diff --git a/packages/nc-gui/components/cell/attachment/utils.ts b/packages/nc-gui/components/cell/attachment/utils.ts
index 637d967476..6b202c519c 100644
--- a/packages/nc-gui/components/cell/attachment/utils.ts
+++ b/packages/nc-gui/components/cell/attachment/utils.ts
@@ -1,3 +1,5 @@
+import type { AttachmentType } from 'nocodb-sdk'
+import RenameFile from './RenameFile.vue'
 import {
   ColumnInj,
   EditModeInj,
@@ -24,13 +26,6 @@ import MdiFilePowerpointBox from '~icons/mdi/file-powerpoint-box'
 import MdiFileExcelOutline from '~icons/mdi/file-excel-outline'
 import IcOutlineInsertDriveFile from '~icons/ic/outline-insert-drive-file'
 
-interface AttachmentProps extends File {
-  data?: any
-  file: File
-  title: string
-  mimetype: string
-}
-
 export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
   (updateModelValue: (data: string | Record<string, any>[]) => void) => {
     const isReadonly = inject(ReadonlyInj, ref(false))
@@ -46,12 +41,13 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
     const editEnabled = inject(EditModeInj, ref(false))
 
     /** keep user selected File object */
-    const storedFiles = ref<AttachmentProps[]>([])
+    const storedFiles = ref<AttachmentType[]>([])
 
-    const attachments = ref<File[]>([])
+    const attachments = ref<AttachmentType[]>([])
 
     const modalVisible = ref(false)
 
+    /** for image carousel */
     const selectedImage = ref()
 
     const { project } = useProject()
@@ -60,17 +56,37 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
 
     const { files, open } = useFileDialog()
 
+    const { appInfo } = useGlobal()
+
     const { t } = useI18n()
 
+    const defaultAttachmentMeta = {
+      ...(appInfo.value.ee && {
+        // Maximum Number of Attachments per cell
+        maxNumberOfAttachments: Math.max(1, +appInfo.value.ncMaxAttachmentsAllowed || 50) || 50,
+        // Maximum File Size per file
+        maxAttachmentSize: Math.max(1, +appInfo.value.ncMaxAttachmentsAllowed || 20) || 20,
+        supportedAttachmentMimeTypes: ['*'],
+      }),
+    }
+
+    /** our currently visible items, either the locally stored or the ones from db, depending on isPublic & isForm status */
+    const visibleItems = computed<any[]>(() => (isPublic.value && isForm.value ? storedFiles.value : attachments.value))
+
+    /** for bulk download */
+    const selectedVisibleItems = ref<boolean[]>(Array.from({ length: visibleItems.value.length }, () => false))
+
     /** remove a file from our stored attachments (either locally stored or saved ones) */
     function removeFile(i: number) {
       if (isPublic.value) {
         storedFiles.value.splice(i, 1)
         attachments.value.splice(i, 1)
+        selectedVisibleItems.value.splice(i, 1)
 
         updateModelValue(storedFiles.value)
       } else {
         attachments.value.splice(i, 1)
+        selectedVisibleItems.value.splice(i, 1)
 
         updateModelValue(JSON.stringify(attachments.value))
       }
@@ -80,12 +96,58 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
     async function onFileSelect(selectedFiles: FileList | File[]) {
       if (!selectedFiles.length) return
 
+      const attachmentMeta = {
+        ...defaultAttachmentMeta,
+        ...(typeof column.value?.meta === 'string' ? JSON.parse(column.value.meta) : column.value?.meta),
+      }
+
+      const newAttachments = []
+
+      const files: File[] = []
+
+      for (const file of selectedFiles) {
+        if (appInfo.value.ee) {
+          // verify number of files
+          if (visibleItems.value.length + selectedFiles.length > attachmentMeta.maxNumberOfAttachments) {
+            message.error(
+              `You can only upload at most ${attachmentMeta.maxNumberOfAttachments} file${
+                attachmentMeta.maxNumberOfAttachments > 1 ? 's' : ''
+              } to this cell.`,
+            )
+            return
+          }
+
+          // verify file size
+          if (file.size > attachmentMeta.maxAttachmentSize * 1024 * 1024) {
+            message.error(`The size of ${file.name} exceeds the maximum file size ${attachmentMeta.maxAttachmentSize} MB.`)
+            continue
+          }
+
+          // verify mime type
+          if (
+            !attachmentMeta.supportedAttachmentMimeTypes.includes('*') &&
+            !attachmentMeta.supportedAttachmentMimeTypes.includes(file.type) &&
+            !attachmentMeta.supportedAttachmentMimeTypes.includes(file.type.split('/')[0])
+          ) {
+            message.error(`${file.name} has the mime type ${file.type} which is not allowed in this column.`)
+            continue
+          }
+        }
+
+        files.push(file)
+      }
+
       if (isPublic.value && isForm.value) {
-        const newFiles = await Promise.all<AttachmentProps>(
-          Array.from(selectedFiles).map(
+        const newFiles = await Promise.all<AttachmentType>(
+          Array.from(files).map(
             (file) =>
-              new Promise<AttachmentProps>((resolve) => {
-                const res: AttachmentProps = { ...file, file, title: file.name, mimetype: file.type }
+              new Promise<AttachmentType>((resolve) => {
+                const res: { file: File; title: string; mimetype: string; data?: any } = {
+                  ...file,
+                  file,
+                  title: file.name,
+                  mimetype: file.type,
+                }
 
                 if (isImage(file.name, (<any>file).mimetype ?? file.type)) {
                   const reader = new FileReader()
@@ -107,35 +169,47 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
               }),
           ),
         )
-
         attachments.value = [...attachments.value, ...newFiles]
 
         return updateModelValue(attachments.value)
       }
 
-      const newAttachments = []
-
-      for (const file of selectedFiles) {
-        try {
-          const data = await api.storage.upload(
-            {
-              path: [NOCO, project.value.title, meta.value?.title, column.value?.title].join('/'),
-            },
-            {
-              files: file,
-              json: '{}',
-            },
-          )
-
-          newAttachments.push(...data)
-        } catch (e: any) {
-          message.error(e.message || t('msg.error.internalError'))
-        }
+      try {
+        const data = await api.storage.upload(
+          {
+            path: [NOCO, project.value.title, meta.value?.title, column.value?.title].join('/'),
+          },
+          {
+            files,
+            json: '{}',
+          },
+        )
+        newAttachments.push(...data)
+      } catch (e: any) {
+        message.error(e.message || t('msg.error.internalError'))
       }
 
       updateModelValue(JSON.stringify([...attachments.value, ...newAttachments]))
     }
 
+    async function renameFile(attachment: AttachmentType, idx: number) {
+      return new Promise<boolean>((resolve) => {
+        const { close } = useDialog(RenameFile, {
+          title: attachment.title,
+          onRename: (newTitle: string) => {
+            attachments.value[idx].title = newTitle
+            updateModelValue(JSON.stringify(attachments.value))
+            close()
+            resolve(true)
+          },
+          onCancel: () => {
+            close()
+            resolve(true)
+          },
+        })
+      })
+    }
+
     /** save files on drop */
     async function onDrop(droppedFiles: File[] | null) {
       if (droppedFiles) {
@@ -144,11 +218,41 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
       }
     }
 
+    /** bulk download selected files */
+    async function bulkDownloadFiles() {
+      await Promise.all(selectedVisibleItems.value.map(async (v, i) => v && (await downloadFile(visibleItems.value[i]))))
+      selectedVisibleItems.value = Array.from({ length: visibleItems.value.length }, () => false)
+    }
+
     /** download a file */
-    async function downloadFile(item: Record<string, any>) {
+    async function downloadFile(item: AttachmentType) {
       ;(await import('file-saver')).saveAs(item.url || item.data, item.title)
     }
 
+    /** construct the attachment url
+     * See /packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts for the details
+     * */
+    async function getAttachmentUrl(item: AttachmentType) {
+      const path = item?.path
+      // if path doesn't exist, use `item.url`
+      if (path) {
+        // try ${appInfo.value.ncSiteUrl}/${item.path} first
+        const url = `${appInfo.value.ncSiteUrl}/${item.path}`
+        try {
+          const res = await fetch(url)
+          if (res.ok) {
+            // use `url` if it is accessible
+            return Promise.resolve(url)
+          }
+        } catch {
+          // for some cases, `url` is not accessible as expected
+          // do nothing here
+        }
+      }
+      // if it fails, use the original url
+      return Promise.resolve(item.url)
+    }
+
     const FileIcon = (icon: string) => {
       switch (icon) {
         case 'mdi-pdf-box':
@@ -164,9 +268,6 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
       }
     }
 
-    /** our currently visible items, either the locally stored or the ones from db, depending on isPublic & isForm status */
-    const visibleItems = computed<any[]>(() => (isPublic.value && isForm.value ? storedFiles.value : attachments.value))
-
     watch(files, (nextFiles) => nextFiles && onFileSelect(nextFiles))
 
     return {
@@ -185,10 +286,15 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
       modalVisible,
       FileIcon,
       removeFile,
+      renameFile,
       downloadFile,
       updateModelValue,
       selectedImage,
+      selectedVisibleItems,
       storedFiles,
+      bulkDownloadFiles,
+      defaultAttachmentMeta,
+      getAttachmentUrl,
     }
   },
   'useAttachmentCell',
diff --git a/packages/nc-gui/components/smartsheet/column/AttachmentOptions.vue b/packages/nc-gui/components/smartsheet/column/AttachmentOptions.vue
new file mode 100644
index 0000000000..7dd3884cb7
--- /dev/null
+++ b/packages/nc-gui/components/smartsheet/column/AttachmentOptions.vue
@@ -0,0 +1,132 @@
+<script setup lang="ts">
+import type { TreeProps } from 'ant-design-vue'
+import type { CheckboxChangeEvent } from 'ant-design-vue/es/checkbox/interface'
+import { fileMimeTypeList, fileMimeTypes } from './utils'
+import { useGlobal, useVModel } from '#imports'
+
+const props = defineProps<{
+  value: any
+}>()
+
+const emit = defineEmits(['update:value'])
+
+const vModel = useVModel(props, 'value', emit)
+
+const validators = {}
+
+const { setAdditionalValidations, validateInfos } = useColumnCreateStoreOrThrow()
+
+const { appInfo } = useGlobal()
+
+const searchValue = ref<string>('')
+
+setAdditionalValidations({
+  ...validators,
+})
+
+// set default value
+vModel.value.meta = {
+  ...(appInfo.value.ee && {
+    // Maximum Number of Attachments per cell
+    maxNumberOfAttachments: Math.max(1, +appInfo.value.ncMaxAttachmentsAllowed || 50) || 50,
+    // Maximum File Size per file
+    maxAttachmentSize: Math.max(1, +appInfo.value.ncMaxAttachmentsAllowed || 20) || 20,
+    // allow all mime types by default
+    supportedAttachmentMimeTypes: ['*'],
+  }),
+  ...vModel.value.meta,
+}
+
+const expandedKeys = ref<(string | number)[]>([])
+
+const autoExpandParent = ref<boolean>(true)
+
+const allowAllMimeTypeCheckbox = ref(true)
+
+const getParentKey = (key: string | number, tree: TreeProps['treeData']): string | null => {
+  if (!tree) return null
+  let parentKey
+  for (let i = 0; i < tree.length; i++) {
+    const node = tree[i]
+    if (node.children) {
+      if (node.children.some((item) => item.key === key)) {
+        parentKey = node.key as string
+      } else if (getParentKey(key, node.children)) {
+        parentKey = getParentKey(key, node.children) as string
+      }
+    }
+  }
+  return parentKey as string
+}
+
+function allowAllMimeTypeCheckboxOnChange(evt: CheckboxChangeEvent) {
+  if (evt.target.checked) {
+    vModel.value.meta.supportedAttachmentMimeTypes = ['*']
+  } else {
+    vModel.value.meta.supportedAttachmentMimeTypes = ['application', 'audio', 'image', 'video', 'misc']
+  }
+}
+
+watch(searchValue, (value) => {
+  expandedKeys.value = fileMimeTypeList
+    ?.map((item: Record<string, any>) => {
+      if (item.title.includes(value)) {
+        return getParentKey(item.key, fileMimeTypes)
+      }
+      return null
+    })
+    .filter((item: any, i: number, self: any[]) => item && self.indexOf(item) === i) as string[]
+  searchValue.value = value
+  autoExpandParent.value = true
+})
+</script>
+
+<template>
+  <a-row class="my-2" gutter="8">
+    <a-col :span="12">
+      <a-form-item v-bind="validateInfos['meta.maxNumberOfAttachments']" label="Max Number of Attachments">
+        <a-input-number v-model:value="vModel.meta.maxNumberOfAttachments" :min="1" class="!w-full nc-attachment-max-count" />
+      </a-form-item>
+    </a-col>
+
+    <a-col :span="12">
+      <a-form-item v-bind="validateInfos['meta.maxAttachmentSize']" label="Max Attachment Size (MB)">
+        <a-input-number v-model:value="vModel.meta.maxAttachmentSize" :min="1" class="!w-full nc-attachment-max-size" />
+      </a-form-item>
+    </a-col>
+
+    <a-col class="mt-4" :span="24">
+      <a-form-item v-bind="validateInfos['meta.supportedAttachmentMimeTypes']" class="!p-[10px] border-2">
+        <a-checkbox
+          v-model:checked="allowAllMimeTypeCheckbox"
+          class="nc-allow-all-mime-type-checkbox"
+          name="virtual"
+          @change="allowAllMimeTypeCheckboxOnChange"
+        >
+          Allow All Mime Types
+        </a-checkbox>
+        <div v-if="!allowAllMimeTypeCheckbox" class="mt-[5px]">
+          <a-input-search v-model:value="searchValue" class="mt-[5px] mb-[15px]" placeholder="Search" />
+          <a-tree
+            v-model:expanded-keys="expandedKeys"
+            v-model:checkedKeys="vModel.meta.supportedAttachmentMimeTypes"
+            checkable
+            :height="250"
+            :tree-data="fileMimeTypes"
+            :auto-expand-parent="autoExpandParent"
+            class="!bg-gray-50 my-[10px]"
+          >
+            <template #title="{ title }">
+              <span v-if="title.indexOf(searchValue) > -1">
+                {{ title.substr(0, title.indexOf(searchValue)) }}
+                <span class="text-primary font-bold">{{ searchValue }}</span>
+                {{ title.substr(title.indexOf(searchValue) + searchValue.length) }}
+              </span>
+              <span v-else>{{ title }}</span>
+            </template>
+          </a-tree>
+        </div>
+      </a-form-item>
+    </a-col>
+  </a-row>
+</template>
diff --git a/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue b/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
index 8211e94759..603468b06b 100644
--- a/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
+++ b/packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
@@ -14,6 +14,7 @@ import {
   uiTypes,
   useColumnCreateStoreOrThrow,
   useEventListener,
+  useGlobal,
   useI18n,
   useMetas,
   useNuxtApp,
@@ -38,6 +39,8 @@ const { t } = useI18n()
 
 const { $e } = useNuxtApp()
 
+const { appInfo } = useGlobal()
+
 const meta = inject(MetaInj, ref())
 
 const isForm = inject(IsFormInj, ref(false))
@@ -133,7 +136,7 @@ useEventListener('keydown', (e: KeyboardEvent) => {
 <template>
   <div
     class="w-[400px] bg-gray-50 shadow p-4 overflow-auto border"
-    :class="{ '!w-[600px]': formState.uidt === UITypes.Formula }"
+    :class="{ '!w-[600px]': formState.uidt === UITypes.Formula, '!w-[500px]': formState.uidt === UITypes.Attachment }"
     @click.stop
   >
     <a-form v-model="formState" no-style name="column-create-or-edit" layout="vertical" data-testid="add-or-edit-column">
@@ -212,6 +215,11 @@ useEventListener('keydown', (e: KeyboardEvent) => {
             </span>
           </a-checkbox>
 
+          <LazySmartsheetColumnAttachmentOptions
+            v-if="appInfo.ee && formState.uidt === UITypes.Attachment"
+            v-model:value="formState"
+          />
+
           <LazySmartsheetColumnAdvancedOptions v-model:value="formState" />
         </div>
       </Transition>
diff --git a/packages/nc-gui/components/smartsheet/column/utils.ts b/packages/nc-gui/components/smartsheet/column/utils.ts
index 6a6a253c8b..c12bf237b2 100644
--- a/packages/nc-gui/components/smartsheet/column/utils.ts
+++ b/packages/nc-gui/components/smartsheet/column/utils.ts
@@ -7,3 +7,193 @@ const relationNames = {
 export function getRelationName(type: string) {
   return relationNames[type as keyof typeof relationNames]
 }
+
+// supported mime types
+// retrieved from https://github.com/sindresorhus/file-type/blob/main/supported.js#L146
+export const fileMimeTypes = [
+  {
+    title: 'Application',
+    key: 'application',
+    children: [
+      { title: 'application/dicom', key: 'application/dicom' },
+      { title: 'application/eps', key: 'application/eps' },
+      { title: 'application/epub+zip', key: 'application/epub+zip' },
+      { title: 'application/gzip', key: 'application/gzip' },
+      { title: 'application/mxf', key: 'application/mxf' },
+      { title: 'application/ogg', key: 'application/ogg' },
+      { title: 'application/pdf', key: 'application/pdf' },
+      { title: 'application/pgp-encrypted', key: 'application/pgp-encrypted' },
+      { title: 'application/postscript', key: 'application/postscript' },
+      { title: 'application/rtf', key: 'application/rtf' },
+      { title: 'application/vnd.ms-asf', key: 'application/vnd.ms-asf' },
+      { title: 'application/vnd.ms-cab-compressed', key: 'application/vnd.ms-cab-compressed' },
+      { title: 'application/vnd.ms-fontobject', key: 'application/vnd.ms-fontobject' },
+      { title: 'application/vnd.ms-htmlhelp', key: 'application/vnd.ms-htmlhelp' },
+      { title: 'application/vnd.ms-outlook', key: 'application/vnd.ms-outlook' },
+      { title: 'application/vnd.oasis.opendocument.presentation', key: 'application/vnd.oasis.opendocument.presentation' },
+      { title: 'application/vnd.oasis.opendocument.spreadsheet', key: 'application/vnd.oasis.opendocument.spreadsheet' },
+      { title: 'application/vnd.oasis.opendocument.text', key: 'application/vnd.oasis.opendocument.text' },
+      {
+        title: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
+        key: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
+      },
+      {
+        title: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+        key: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+      },
+      {
+        title: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+        key: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+      },
+      { title: 'application/vnd.sketchup.skp', key: 'application/vnd.sketchup.skp' },
+      { title: 'application/vnd.tcpdump.pcap', key: 'application/vnd.tcpdump.pcap' },
+      { title: 'application/wasm', key: 'application/wasm' },
+      { title: 'application/x-7z-compressed', key: 'application/x-7z-compressed' },
+      { title: 'application/x-apache-arrow', key: 'application/x-apache-arrow' },
+      { title: 'application/x-apple-diskimage', key: 'application/x-apple-diskimage' },
+      { title: 'application/x-asar', key: 'application/x-asar' },
+      { title: 'application/x-blender', key: 'application/x-blender' },
+      { title: 'application/x-bzip2', key: 'application/x-bzip2' },
+      { title: 'application/x-cfb', key: 'application/x-cfb' },
+      { title: 'application/x-compress', key: 'application/x-compress' },
+      { title: 'application/x-deb', key: 'application/x-deb' },
+      { title: 'application/x-elf', key: 'application/x-elf' },
+      { title: 'application/x-esri-shape', key: 'application/x-esri-shape' },
+      { title: 'application/x-google-chrome-extension', key: 'application/x-google-chrome-extension' },
+      { title: 'application/x-indesign', key: 'application/x-indesign' },
+      { title: 'application/x-lzh-compressed', key: 'application/x-lzh-compressed' },
+      { title: 'application/x-lzip', key: 'application/x-lzip' },
+      { title: 'application/x-mie', key: 'application/x-mie' },
+      { title: 'application/x-mobipocket-ebook', key: 'application/x-mobipocket-ebook' },
+      { title: 'application/x-msdownload', key: 'application/x-msdownload' },
+      { title: 'application/x-nintendo-nes-rom', key: 'application/x-nintendo-nes-rom' },
+      { title: 'application/x-rar-compressed', key: 'application/x-rar-compressed' },
+      { title: 'application/x-rpm', key: 'application/x-rpm' },
+      { title: 'application/x-shockwave-flash', key: 'application/x-shockwave-flash' },
+      { title: 'application/x-sqlite3', key: 'application/x-sqlite3' },
+      { title: 'application/x-tar', key: 'application/x-tar' },
+      { title: 'application/x-unix-archive', key: 'application/x-unix-archive' },
+      { title: 'application/x-xpinstall', key: 'application/x-xpinstall' },
+      { title: 'application/x-xz', key: 'application/x-xz' },
+      { title: 'application/x.apple.alias', key: 'application/x.apple.alias' },
+      { title: 'application/x.ms.shortcut', key: 'application/x.ms.shortcut' },
+      { title: 'application/xml', key: 'application/xml' },
+      { title: 'application/zip', key: 'application/zip' },
+      { title: 'application/zstd', key: 'application/zstd' },
+    ],
+  },
+  {
+    title: 'Audio',
+    key: 'audio',
+    children: [
+      { title: 'audio/aac', key: 'audio/aac' },
+      { title: 'audio/aiff', key: 'audio/aiff' },
+      { title: 'audio/amr', key: 'audio/amr' },
+      { title: 'audio/ape', key: 'audio/ape' },
+      { title: 'audio/midi', key: 'audio/midi' },
+      { title: 'audio/mp4', key: 'audio/mp4' },
+      { title: 'audio/mpeg', key: 'audio/mpeg' },
+      { title: 'audio/ogg', key: 'audio/ogg' },
+      { title: 'audio/opus', key: 'audio/opus' },
+      { title: 'audio/qcelp', key: 'audio/qcelp' },
+      { title: 'audio/vnd.dolby.dd-raw', key: 'audio/vnd.dolby.dd-raw' },
+      { title: 'audio/vnd.wave', key: 'audio/vnd.wave' },
+      { title: 'audio/wavpack', key: 'audio/wavpack' },
+      { title: 'audio/x-dsf', key: 'audio/x-dsf' },
+      { title: 'audio/x-flac', key: 'audio/x-flac' },
+      { title: 'audio/x-it', key: 'audio/x-it' },
+      { title: 'audio/x-m4a', key: 'audio/x-m4a' },
+      { title: 'audio/x-ms-asf', key: 'audio/x-ms-asf' },
+      { title: 'audio/x-musepack', key: 'audio/x-musepack' },
+      { title: 'audio/x-s3m', key: 'audio/x-s3m' },
+      { title: 'audio/x-voc', key: 'audio/x-voc' },
+      { title: 'audio/x-xm', key: 'audio/x-xm' },
+    ],
+  },
+  {
+    title: 'Image',
+    key: 'image',
+    children: [
+      { title: 'image/apng', key: 'image/apng' },
+      { title: 'image/avif', key: 'image/avif' },
+      { title: 'image/bmp', key: 'image/bmp' },
+      { title: 'image/bpg', key: 'image/bpg' },
+      { title: 'image/flif', key: 'image/flif' },
+      { title: 'image/gif', key: 'image/gif' },
+      { title: 'image/heic', key: 'image/heic' },
+      { title: 'image/heic-sequence', key: 'image/heic-sequence' },
+      { title: 'image/heif', key: 'image/heif' },
+      { title: 'image/heif-sequence', key: 'image/heif-sequence' },
+      { title: 'image/icns', key: 'image/icns' },
+      { title: 'image/jls', key: 'image/jls' },
+      { title: 'image/jp2', key: 'image/jp2' },
+      { title: 'image/jpeg', key: 'image/jpeg' },
+      { title: 'image/jpm', key: 'image/jpm' },
+      { title: 'image/jpx', key: 'image/jpx' },
+      { title: 'image/jxl', key: 'image/jxl' },
+      { title: 'image/ktx', key: 'image/ktx' },
+      { title: 'image/mj2', key: 'image/mj2' },
+      { title: 'image/png', key: 'image/png' },
+      { title: 'image/tiff', key: 'image/tiff' },
+      { title: 'image/vnd.adobe.photoshop', key: 'image/vnd.adobe.photoshop' },
+      { title: 'image/vnd.dwg', key: 'image/vnd.dwg' },
+      { title: 'image/vnd.ms-photo', key: 'image/vnd.ms-photo' },
+      { title: 'image/webp', key: 'image/webp' },
+      { title: 'image/x-adobe-dng', key: 'image/x-adobe-dng' },
+      { title: 'image/x-canon-cr2', key: 'image/x-canon-cr2' },
+      { title: 'image/x-canon-cr3', key: 'image/x-canon-cr3' },
+      { title: 'image/x-fujifilm-raf', key: 'image/x-fujifilm-raf' },
+      { title: 'image/x-icon', key: 'image/x-icon' },
+      { title: 'image/x-nikon-nef', key: 'image/x-nikon-nef' },
+      { title: 'image/x-olympus-orf', key: 'image/x-olympus-orf' },
+      { title: 'image/x-panasonic-rw2', key: 'image/x-panasonic-rw2' },
+      { title: 'image/x-sony-arw', key: 'image/x-sony-arw' },
+      { title: 'image/x-xcf', key: 'image/x-xcf' },
+    ],
+  },
+  {
+    title: 'Video',
+    key: 'video',
+    children: [
+      { title: 'video/3gpp', key: 'video/3gpp' },
+      { title: 'video/3gpp2', key: 'video/3gpp2' },
+      { title: 'video/MP1S', key: 'video/MP1S' },
+      { title: 'video/MP2P', key: 'video/MP2P' },
+      { title: 'video/mp2t', key: 'video/mp2t' },
+      { title: 'video/mp4', key: 'video/mp4' },
+      { title: 'video/mpeg', key: 'video/mpeg' },
+      { title: 'video/ogg', key: 'video/ogg' },
+      { title: 'video/quicktime', key: 'video/quicktime' },
+      { title: 'video/vnd.avi', key: 'video/vnd.avi' },
+      { title: 'video/webm', key: 'video/webm' },
+      { title: 'video/x-flv', key: 'video/x-flv' },
+      { title: 'video/x-m4v', key: 'video/x-m4v' },
+      { title: 'video/x-matroska', key: 'video/x-matroska' },
+      { title: 'video/x-ms-asf', key: 'video/x-ms-asf' },
+    ],
+  },
+  {
+    title: 'Misc',
+    key: 'misc',
+    children: [
+      { title: 'model/3mf', key: 'model/3mf' },
+      { title: 'model/gltf-binary', key: 'model/gltf-binary' },
+      { title: 'model/stl', key: 'model/stl' },
+      { title: 'text/calendar', key: 'text/calendar' },
+      { title: 'text/vcard', key: 'text/vcard' },
+      { title: 'text/plain', key: 'text/plain' },
+      { title: 'text/html', key: 'text/html' },
+      { title: 'text/xml', key: 'text/xml' },
+      { title: 'text/calendar', key: 'text/calendar' },
+      { title: 'text/javascript', key: 'text/javascript' },
+      { title: 'text/css', key: 'text/css' },
+      { title: 'text/csv', key: 'text/csv' },
+      { title: 'font/otf', key: 'font/otf' },
+      { title: 'font/ttf', key: 'font/ttf' },
+      { title: 'font/woff', key: 'font/woff' },
+      { title: 'font/woff2', key: 'font/woff2' },
+    ],
+  },
+]
+
+export const fileMimeTypeList = fileMimeTypes.map((o) => o.children).flat(1)
diff --git a/packages/nc-gui/components/virtual-cell/QrCode.vue b/packages/nc-gui/components/virtual-cell/QrCode.vue
index 14b772bc74..4ba96f3ab7 100644
--- a/packages/nc-gui/components/virtual-cell/QrCode.vue
+++ b/packages/nc-gui/components/virtual-cell/QrCode.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useQRCode } from '@vueuse/integrations/useQRCode'
-import { GridType } from 'nocodb-sdk'
+import type { GridType } from 'nocodb-sdk'
 import { ActiveViewInj } from '#imports'
 
 const maxNumberOfAllowedCharsForQrValue = 2000
@@ -68,7 +68,14 @@ const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning } = us
   <div v-if="tooManyCharsForQrCode" class="text-left text-wrap mt-2 text-[#e65100] text-xs">
     {{ $t('labels.qrCodeValueTooLong') }}
   </div>
-  <img v-if="showQrCode" class="mx-auto" :style="{ height: rowHeight ? `${rowHeight * 1.4}rem` : `1.4rem` }" :src="qrCode" alt="QR Code" @click="showQrModal" />
+  <img
+    v-if="showQrCode"
+    class="mx-auto"
+    :style="{ height: rowHeight ? `${rowHeight * 1.4}rem` : `1.4rem` }"
+    :src="qrCode"
+    alt="QR Code"
+    @click="showQrModal"
+  />
   <div v-if="showEditNonEditableFieldWarning" class="text-left text-wrap mt-2 text-[#e65100] text-xs">
     {{ $t('msg.warning.nonEditableFields.computedFieldUnableToClear') }}
   </div>
diff --git a/packages/nc-gui/components/virtual-cell/barcode/Barcode.vue b/packages/nc-gui/components/virtual-cell/barcode/Barcode.vue
index 0736c937da..8fa34136e4 100644
--- a/packages/nc-gui/components/virtual-cell/barcode/Barcode.vue
+++ b/packages/nc-gui/components/virtual-cell/barcode/Barcode.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
+import type { ComputedRef } from 'vue'
+import type { GridType } from 'nocodb-sdk'
 import JsBarcodeWrapper from './JsBarcodeWrapper.vue'
-import { ComputedRef } from 'vue'
-import { GridType } from 'nocodb-sdk'
 import { ActiveViewInj } from '#imports'
 
 const maxNumberOfAllowedCharsForBarcodeValue = 100
diff --git a/packages/nc-gui/composables/useGlobal/state.ts b/packages/nc-gui/composables/useGlobal/state.ts
index 373ab65bbc..2b1f7bc036 100644
--- a/packages/nc-gui/composables/useGlobal/state.ts
+++ b/packages/nc-gui/composables/useGlobal/state.ts
@@ -96,6 +96,8 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
     teleEnabled: true,
     type: 'nocodb',
     version: '0.0.0',
+    ncAttachmentFieldSize: 20,
+    ncMaxAttachmentsAllowed: 10,
   })
 
   /** reactive token payload */
diff --git a/packages/nc-gui/composables/useGlobal/types.ts b/packages/nc-gui/composables/useGlobal/types.ts
index 8b2a05ae27..9ef6ab3ddb 100644
--- a/packages/nc-gui/composables/useGlobal/types.ts
+++ b/packages/nc-gui/composables/useGlobal/types.ts
@@ -19,6 +19,8 @@ export interface AppInfo {
   type: string
   version: string
   ee?: boolean
+  ncAttachmentFieldSize: number
+  ncMaxAttachmentsAllowed: number
 }
 
 export interface StoredState {
diff --git a/packages/nc-gui/composables/useKanbanViewStore.ts b/packages/nc-gui/composables/useKanbanViewStore.ts
index b33ddd4f9c..e3c9f130aa 100644
--- a/packages/nc-gui/composables/useKanbanViewStore.ts
+++ b/packages/nc-gui/composables/useKanbanViewStore.ts
@@ -1,5 +1,15 @@
 import type { ComputedRef, Ref } from 'vue'
-import type { Api, ColumnType, KanbanType, SelectOptionType, SelectOptionsType, TableType, ViewType } from 'nocodb-sdk'
+import type {
+  Api,
+  AttachmentType,
+  ColumnType,
+  KanbanType,
+  SelectOptionType,
+  SelectOptionsType,
+  TableType,
+  ViewType,
+} from 'nocodb-sdk'
+import { UITypes } from 'nocodb-sdk'
 import type { Row } from '~/lib'
 import {
   IsPublicInj,
@@ -14,6 +24,7 @@ import {
   provide,
   ref,
   useApi,
+  useGlobal,
   useI18n,
   useInjectionState,
   useNuxtApp,
@@ -43,6 +54,8 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
 
     const { $e, $api } = useNuxtApp()
 
+    const { appInfo } = useGlobal()
+
     const { sorts, nestedFilters } = useSmartsheetStoreOrThrow()
 
     const { sharedView, fetchSharedViewData, fetchSharedViewGroupedData } = useSharedView()
@@ -53,6 +66,10 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
 
     const password = ref<string | null>(null)
 
+    const attachmentColumns = computed(() =>
+      (meta.value?.columns as ColumnType[])?.filter((c) => c.uidt === UITypes.Attachment).map((c) => c.title),
+    )
+
     provide(SharedViewPasswordInj, password)
 
     // kanban view meta data
@@ -102,6 +119,27 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
         rowMeta: {},
       }))
 
+    async function getAttachmentUrl(item: AttachmentType) {
+      const path = item?.path
+      // if path doesn't exist, use `item.url`
+      if (path) {
+        // try ${appInfo.value.ncSiteUrl}/${item.path} first
+        const url = `${appInfo.value.ncSiteUrl}/${item.path}`
+        try {
+          const res = await fetch(url)
+          if (res.ok) {
+            // use `url` if it is accessible
+            return Promise.resolve(url)
+          }
+        } catch {
+          // for some cases, `url` is not accessible as expected
+          // do nothing here
+        }
+      }
+      // if it fails, use the original url
+      return Promise.resolve(item.url)
+    }
+
     async function loadKanbanData() {
       if ((!project?.value?.id || !meta.value?.id || !viewMeta?.value?.id) && !isPublic.value) return
 
@@ -109,15 +147,15 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
       formattedData.value = new Map<string | null, Row[]>()
       countByStack.value = new Map<string | null, number>()
 
-      let res
+      let groupData
 
       if (isPublic.value) {
-        res = await fetchSharedViewGroupedData(groupingFieldColumn!.value!.id!, {
+        groupData = await fetchSharedViewGroupedData(groupingFieldColumn!.value!.id!, {
           sortsArr: sorts.value,
           filtersArr: nestedFilters.value,
         })
       } else {
-        res = await api.dbViewRow.groupedDataList(
+        groupData = await api.dbViewRow.groupedDataList(
           'noco',
           project.value.id!,
           meta.value!.id!,
@@ -128,9 +166,27 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
         )
       }
 
-      for (const data of res) {
+      for (const data of groupData) {
+        const records = []
         const key = data.key
-        formattedData.value.set(key, formatData(data.value.list))
+        // TODO: optimize
+        // reconstruct the url
+        // See /packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts for the details
+        for (const record of data.value.list) {
+          for (const attachmentColumn of attachmentColumns.value) {
+            const oldAttachment = JSON.parse(record[attachmentColumn!])
+            const newAttachment = []
+            for (const attachmentObj of oldAttachment) {
+              newAttachment.push({
+                ...attachmentObj,
+                url: await getAttachmentUrl(attachmentObj),
+              })
+            }
+            record[attachmentColumn!] = newAttachment
+          }
+          records.push(record)
+        }
+        formattedData.value.set(key, formatData(records))
         countByStack.value.set(key, data.value.pageInfo.totalRows || 0)
       }
     }
diff --git a/packages/nc-gui/composables/useMultiSelect/convertCellData.ts b/packages/nc-gui/composables/useMultiSelect/convertCellData.ts
index 37d60afd56..5cbc47e694 100644
--- a/packages/nc-gui/composables/useMultiSelect/convertCellData.ts
+++ b/packages/nc-gui/composables/useMultiSelect/convertCellData.ts
@@ -1,7 +1,12 @@
 import dayjs from 'dayjs'
+import type { ColumnType } from 'nocodb-sdk'
 import { UITypes } from 'nocodb-sdk'
+import type { AppInfo } from '~/composables/useGlobal'
 
-export default function convertCellData(args: { from: UITypes; to: UITypes; value: any }, isMysql = false) {
+export default function convertCellData(
+  args: { from: UITypes; to: UITypes; value: any; column: ColumnType; appInfo: AppInfo },
+  isMysql = false,
+) {
   const { from, to, value } = args
   if (from === to && ![UITypes.Attachment, UITypes.Date, UITypes.DateTime, UITypes.Time, UITypes.Year].includes(to)) {
     return value
@@ -76,7 +81,57 @@ export default function convertCellData(args: { from: UITypes; to: UITypes; valu
       if (parsedVal.some((v: any) => v && !(v.url || v.data))) {
         throw new Error('Invalid attachment data')
       }
-      return JSON.stringify(parsedVal)
+      // TODO(refactor): duplicate logic in attachment/utils.ts
+      const defaultAttachmentMeta = {
+        ...(args.appInfo.ee && {
+          // Maximum Number of Attachments per cell
+          maxNumberOfAttachments: Math.max(1, +args.appInfo.ncMaxAttachmentsAllowed || 50) || 50,
+          // Maximum File Size per file
+          maxAttachmentSize: Math.max(1, +args.appInfo.ncMaxAttachmentsAllowed || 20) || 20,
+          supportedAttachmentMimeTypes: ['*'],
+        }),
+      }
+
+      const attachmentMeta = {
+        ...defaultAttachmentMeta,
+        ...(typeof args.column?.meta === 'string' ? JSON.parse(args.column.meta) : args.column?.meta),
+      }
+
+      const attachments = []
+
+      for (const attachment of parsedVal) {
+        if (args.appInfo.ee) {
+          // verify number of files
+          if (parsedVal.length > attachmentMeta.maxNumberOfAttachments) {
+            message.error(
+              `You can only upload at most ${attachmentMeta.maxNumberOfAttachments} file${
+                attachmentMeta.maxNumberOfAttachments > 1 ? 's' : ''
+              } to this cell.`,
+            )
+            return
+          }
+
+          // verify file size
+          if (attachment.size > attachmentMeta.maxAttachmentSize * 1024 * 1024) {
+            message.error(`The size of ${attachment.name} exceeds the maximum file size ${attachmentMeta.maxAttachmentSize} MB.`)
+            continue
+          }
+
+          // verify mime type
+          if (
+            !attachmentMeta.supportedAttachmentMimeTypes.includes('*') &&
+            !attachmentMeta.supportedAttachmentMimeTypes.includes(attachment.type) &&
+            !attachmentMeta.supportedAttachmentMimeTypes.includes(attachment.type.split('/')[0])
+          ) {
+            message.error(`${attachment.name} has the mime type ${attachment.type} which is not allowed in this column.`)
+            continue
+          }
+        }
+
+        attachments.push(attachment)
+      }
+
+      return JSON.stringify(attachments)
     }
     case UITypes.LinkToAnotherRecord:
     case UITypes.Lookup:
diff --git a/packages/nc-gui/composables/useMultiSelect/index.ts b/packages/nc-gui/composables/useMultiSelect/index.ts
index a109cb2e2d..1648a9776e 100644
--- a/packages/nc-gui/composables/useMultiSelect/index.ts
+++ b/packages/nc-gui/composables/useMultiSelect/index.ts
@@ -17,6 +17,7 @@ import {
   unref,
   useCopy,
   useEventListener,
+  useGlobal,
   useI18n,
   useMetas,
   useProject,
@@ -47,6 +48,8 @@ export function useMultiSelect(
 
   const { getMeta } = useMetas()
 
+  const { appInfo } = useGlobal()
+
   const { isMysql } = useProject()
 
   let clipboardContext = $ref<{ value: any; uidt: UITypes } | null>(null)
@@ -298,6 +301,8 @@ export function useMultiSelect(
                         value: clipboardContext.value,
                         from: clipboardContext.uidt,
                         to: columnObj.uidt as UITypes,
+                        column: columnObj,
+                        appInfo: unref(appInfo),
                       },
                       isMysql(meta.value?.base_id),
                     )
@@ -330,6 +335,8 @@ export function useMultiSelect(
                         value: clipboardContext.value,
                         from: clipboardContext.uidt,
                         to: columnObj.uidt as UITypes,
+                        column: columnObj,
+                        appInfo: unref(appInfo),
                       },
                       isMysql(meta.value?.base_id),
                     )
diff --git a/packages/nc-gui/lang/en.json b/packages/nc-gui/lang/en.json
index 41c21090a1..d459b9bbf3 100644
--- a/packages/nc-gui/lang/en.json
+++ b/packages/nc-gui/lang/en.json
@@ -205,7 +205,8 @@
     "quickImport": "Quick Import",
     "advancedSettings": "Advanced Settings",
     "codeSnippet": "Code Snippet",
-    "keyboardShortcut": "Keyboard Shortcuts"
+    "keyboardShortcut": "Keyboard Shortcuts",
+    "generateRandomName": "Generate Random Name"
   },
   "labels": {
     "createdBy": "Created By",
diff --git a/packages/nocodb-sdk/src/lib/Api.ts b/packages/nocodb-sdk/src/lib/Api.ts
index 9ab6d9ed28..479617595a 100644
--- a/packages/nocodb-sdk/src/lib/Api.ts
+++ b/packages/nocodb-sdk/src/lib/Api.ts
@@ -470,6 +470,8 @@ export interface AttachmentType {
   mimetype?: string;
   size?: string;
   icon?: string;
+  path?: string;
+  data?: any;
 }
 
 export interface WebhookType {
diff --git a/packages/nocodb/src/lib/Noco.ts b/packages/nocodb/src/lib/Noco.ts
index 8a3397053d..fa4cbcc752 100644
--- a/packages/nocodb/src/lib/Noco.ts
+++ b/packages/nocodb/src/lib/Noco.ts
@@ -104,7 +104,7 @@ export default class Noco {
   constructor() {
     process.env.PORT = process.env.PORT || '8080';
     // todo: move
-    process.env.NC_VERSION = '0100002';
+    process.env.NC_VERSION = '0101002';
 
     // if env variable NC_MINIMAL_DBS is set, then disable project creation with external sources
     if (process.env.NC_MINIMAL_DBS) {
diff --git a/packages/nocodb/src/lib/meta/NcMetaIOImpl.ts b/packages/nocodb/src/lib/meta/NcMetaIOImpl.ts
index 578afa059f..a22dc63c16 100644
--- a/packages/nocodb/src/lib/meta/NcMetaIOImpl.ts
+++ b/packages/nocodb/src/lib/meta/NcMetaIOImpl.ts
@@ -468,6 +468,13 @@ export default class NcMetaIOImpl extends NcMetaIO {
 
   async startTransaction(): Promise<NcMetaIO> {
     const trx = await this.connection.transaction();
+
+    // todo: Extend transaction class to add our custom properties
+    Object.assign(trx, {
+      clientType: this.connection.clientType,
+      searchPath: (this.connection as any).searchPath,
+    });
+
     return new NcMetaIOImpl(this.app, this.config, trx);
   }
 
diff --git a/packages/nocodb/src/lib/meta/api/attachmentApis.ts b/packages/nocodb/src/lib/meta/api/attachmentApis.ts
index 53506414cf..b55b2472ef 100644
--- a/packages/nocodb/src/lib/meta/api/attachmentApis.ts
+++ b/packages/nocodb/src/lib/meta/api/attachmentApis.ts
@@ -12,6 +12,7 @@ import { Tele } from 'nc-help';
 import extractProjectIdAndAuthenticate from '../helpers/extractProjectIdAndAuthenticate';
 import catchError, { NcError } from '../helpers/catchError';
 import NcPluginMgrv2 from '../helpers/NcPluginMgrv2';
+import Local from '../../v1-legacy/plugins/adapters/storage/Local';
 import { NC_ATTACHMENT_FIELD_SIZE } from '../../constants';
 
 const isUploadAllowed = async (req: Request, _res: Response, next: any) => {
@@ -41,7 +42,6 @@ const isUploadAllowed = async (req: Request, _res: Response, next: any) => {
   NcError.badRequest('Upload not allowed');
 };
 
-// const storageAdapter = new Local();
 export async function upload(req: Request, res: Response) {
   const filePath = sanitizeUrlPath(
     req.query?.path?.toString()?.split('/') || ['']
@@ -49,23 +49,28 @@ export async function upload(req: Request, res: Response) {
   const destPath = path.join('nc', 'uploads', ...filePath);
 
   const storageAdapter = await NcPluginMgrv2.storageAdapter();
+
   const attachments = await Promise.all(
     (req as any).files?.map(async (file) => {
-      const fileName = `${nanoid(6)}${path.extname(file.originalname)}`;
+      const fileName = `${nanoid(18)}${path.extname(file.originalname)}`;
 
       let url = await storageAdapter.fileCreate(
         slash(path.join(destPath, fileName)),
         file
       );
 
+      let attachmentPath;
+
+      // if `url` is null, then it is local attachment
       if (!url) {
-        url = `${(req as any).ncSiteUrl}/download/${filePath.join(
-          '/'
-        )}/${fileName}`;
+        // then store the attachement path only
+        // url will be constructued in `useAttachmentCell`
+        attachmentPath = `download/${filePath.join('/')}/${fileName}`;
       }
 
       return {
-        url,
+        ...(url ? { url } : {}),
+        ...(attachmentPath ? { path: attachmentPath } : {}),
         title: file.originalname,
         mimetype: file.mimetype,
         size: file.size,
@@ -86,9 +91,11 @@ export async function uploadViaURL(req: Request, res: Response) {
   const destPath = path.join('nc', 'uploads', ...filePath);
 
   const storageAdapter = await NcPluginMgrv2.storageAdapter();
+
   const attachments = await Promise.all(
     req.body?.map?.(async (urlMeta) => {
       const { url, fileName: _fileName } = urlMeta;
+
       const fileName = `${nanoid(6)}${_fileName || url.split('/').pop()}`;
 
       let attachmentUrl = await (storageAdapter as any).fileCreateByUrl(
@@ -119,12 +126,12 @@ export async function uploadViaURL(req: Request, res: Response) {
 
 export async function fileRead(req, res) {
   try {
-    const storageAdapter = await NcPluginMgrv2.storageAdapter();
-    // const type = mimetypes[path.extname(req.s.fileName).slice(1)] || 'text/plain';
+    // get the local storage adapter to display local attachments
+    const storageAdapter = new Local();
     const type =
       mimetypes[path.extname(req.params?.[0]).split('/').pop().slice(1)] ||
       'text/plain';
-    // const img = await this.storageAdapter.fileRead(slash(path.join('nc', req.params.projectId, req.params.dbAlias, 'uploads', req.params.fileName)));
+
     const img = await storageAdapter.fileRead(
       slash(
         path.join(
@@ -192,6 +199,7 @@ router.post(
     catchError(upload),
   ]
 );
+
 router.post(
   '/api/v1/db/storage/upload-by-url',
 
@@ -201,6 +209,7 @@ router.post(
     catchError(uploadViaURL),
   ]
 );
+
 router.get(/^\/download\/(.+)$/, catchError(fileRead));
 
 export default router;
diff --git a/packages/nocodb/src/lib/meta/api/dataApis/helpers.ts b/packages/nocodb/src/lib/meta/api/dataApis/helpers.ts
index 2a9398fab0..a6ec17ea5a 100644
--- a/packages/nocodb/src/lib/meta/api/dataApis/helpers.ts
+++ b/packages/nocodb/src/lib/meta/api/dataApis/helpers.ts
@@ -160,6 +160,7 @@ async function getDbRows(baseModel, view: View, req: Request) {
         dbRow[column.title] = await serializeCellValue({
           value: row[column.title],
           column,
+          siteUrl: req['ncSiteUrl'],
         });
       }
       dbRows.push(dbRow);
@@ -171,9 +172,11 @@ async function getDbRows(baseModel, view: View, req: Request) {
 export async function serializeCellValue({
   value,
   column,
+  siteUrl,
 }: {
   column?: Column;
   value: any;
+  siteUrl: string;
 }) {
   if (!column) {
     return value;
@@ -192,7 +195,9 @@ export async function serializeCellValue({
 
       return (data || []).map(
         (attachment) =>
-          `${encodeURI(attachment.title)}(${encodeURI(attachment.url)})`
+          `${encodeURI(attachment.title)}(${encodeURI(
+            attachment.path ? `${siteUrl}/${attachment.path}` : attachment.url
+          )})`
       );
     }
     case UITypes.Lookup:
@@ -205,6 +210,7 @@ export async function serializeCellValue({
               serializeCellValue({
                 value: v,
                 column: lookupColumn,
+                siteUrl,
               })
             )
           )
diff --git a/packages/nocodb/src/lib/meta/api/utilApis.ts b/packages/nocodb/src/lib/meta/api/utilApis.ts
index 7db15d7243..0118420bb0 100644
--- a/packages/nocodb/src/lib/meta/api/utilApis.ts
+++ b/packages/nocodb/src/lib/meta/api/utilApis.ts
@@ -16,6 +16,7 @@ import NcConfigFactory, {
 import User from '../../models/User';
 import catchError from '../helpers/catchError';
 import axios from 'axios';
+import { NC_ATTACHMENT_FIELD_SIZE } from '../../constants';
 
 const versionCache = {
   releaseVersion: null,
@@ -55,6 +56,8 @@ export async function appInfo(req: Request, res: Response) {
     teleEnabled: !process.env.NC_DISABLE_TELE,
     ncSiteUrl: (req as any).ncSiteUrl,
     ee: Noco.isEE(),
+    ncAttachmentFieldSize: NC_ATTACHMENT_FIELD_SIZE,
+    ncMaxAttachmentsAllowed: +(process.env.NC_MAX_ATTACHMENTS_ALLOWED || 10),
   };
 
   res.json(result);
diff --git a/packages/nocodb/src/lib/version-upgrader/NcUpgrader.ts b/packages/nocodb/src/lib/version-upgrader/NcUpgrader.ts
index 9f7ae6d07f..f5693551fa 100644
--- a/packages/nocodb/src/lib/version-upgrader/NcUpgrader.ts
+++ b/packages/nocodb/src/lib/version-upgrader/NcUpgrader.ts
@@ -9,6 +9,7 @@ import ncProjectUpgraderV2_0090000 from './ncProjectUpgraderV2_0090000';
 import ncDataTypesUpgrader from './ncDataTypesUpgrader';
 import ncProjectRolesUpgrader from './ncProjectRolesUpgrader';
 import ncFilterUpgrader from './ncFilterUpgrader';
+import ncAttachmentUpgrader from './ncAttachmentUpgrader';
 
 const log = debug('nc:version-upgrader');
 import boxen from 'boxen';
@@ -37,6 +38,7 @@ export default class NcUpgrader {
         { name: '0098004', handler: ncDataTypesUpgrader },
         { name: '0098005', handler: ncProjectRolesUpgrader },
         { name: '0100002', handler: ncFilterUpgrader },
+        { name: '0101002', handler: ncAttachmentUpgrader },
       ];
       if (!(await ctx.ncMeta.knexConnection?.schema?.hasTable?.('nc_store'))) {
         return;
diff --git a/packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts b/packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts
new file mode 100644
index 0000000000..dd4e0c274f
--- /dev/null
+++ b/packages/nocodb/src/lib/version-upgrader/ncAttachmentUpgrader.ts
@@ -0,0 +1,112 @@
+import { NcUpgraderCtx } from './NcUpgrader';
+import { MetaTable } from '../utils/globals';
+import Base from '../models/Base';
+import Model from '../models/Model';
+import { XKnex } from '../db/sql-data-mapper/index';
+import NcConnectionMgrv2 from '../utils/common/NcConnectionMgrv2';
+import { UITypes } from 'nocodb-sdk';
+
+// before 0.103.0, an attachment object was like
+// [{
+//   "url": "http://localhost:8080/download/noco/xcdb/Sheet-1/title5/39A410.jpeg",
+//   "title": "foo.jpeg",
+//   "mimetype": "image/jpeg",
+//   "size": 6494
+// }]
+// in this way, if the base url is changed, the url will be broken
+// this upgrader is to convert the existing local attachment object to the following format
+// [{
+//   "url": "http://localhost:8080/download/noco/xcdb/Sheet-1/title5/39A410.jpeg",
+//   "path": "download/noco/xcdb/Sheet-1/title5/39A410.jpeg",
+//   "title": "foo.jpeg",
+//   "mimetype": "image/jpeg",
+//   "size": 6494
+// }]
+// the new url will be constructed by `${ncSiteUrl}/${path}` in UI. the old url will be used for fallback
+// while other non-local attachments will remain unchanged
+
+function getTnPath(knex: XKnex, tb: Model) {
+  const schema = (knex as any).searchPath?.();
+  const clientType = knex.clientType();
+  if (clientType === 'mssql' && schema) {
+    return knex.raw('??.??', [schema, tb.table_name]);
+  } else if (clientType === 'snowflake') {
+    return [
+      knex.client.config.connection.database,
+      knex.client.config.connection.schema,
+      tb.table_name,
+    ].join('.');
+  } else {
+    return tb.table_name;
+  }
+}
+
+export default async function ({ ncMeta }: NcUpgraderCtx) {
+  const bases: Base[] = await ncMeta.metaList2(null, null, MetaTable.BASES);
+  for (const base of bases) {
+    const knex: XKnex = base.is_meta
+      ? ncMeta.knexConnection
+      : NcConnectionMgrv2.get(base);
+    const models = await (await Base.get(base.id, ncMeta)).getModels(ncMeta);
+    for (const model of models) {
+      const updateRecords = [];
+      const columns = await (
+        await Model.get(model.id, ncMeta)
+      ).getColumns(ncMeta);
+      const attachmentColumns = columns
+        .filter((c) => c.uidt === UITypes.Attachment)
+        .map((c) => c.column_name);
+      if (attachmentColumns.length === 0) {
+        continue;
+      }
+      const primaryKeys = columns.filter((c) => c.pk).map((c) => c.column_name);
+      const records = await knex(getTnPath(knex, model)).select([
+        ...primaryKeys,
+        ...attachmentColumns,
+      ]);
+      for (const record of records) {
+        for (const attachmentColumn of attachmentColumns) {
+          const attachmentMeta =
+            typeof record[attachmentColumn] === 'string'
+              ? JSON.parse(record[attachmentColumn])
+              : record[attachmentColumn];
+          if (attachmentMeta) {
+            const newAttachmentMeta = [];
+            for (const attachment of attachmentMeta) {
+              if ('url' in attachment) {
+                const match = attachment.url.match(/^(.*)\/download\/(.*)$/);
+                if (match) {
+                  // e.g. http://localhost:8080/download/noco/xcdb/Sheet-1/title5/ee2G8p_nute_gunray.png
+                  // match[1] = http://localhost:8080
+                  // match[2] = download/noco/xcdb/Sheet-1/title5/ee2G8p_nute_gunray.png
+                  const path = `download/${match[2]}`;
+
+                  newAttachmentMeta.push({
+                    ...attachment,
+                    path,
+                  });
+                } else {
+                  // keep it as it is
+                  newAttachmentMeta.push(attachment);
+                }
+              }
+            }
+            const where = primaryKeys
+              .map((key) => {
+                return { [key]: record[key] };
+              })
+              .reduce((acc, val) => Object.assign(acc, val), {});
+            updateRecords.push(
+              await knex(getTnPath(knex, model))
+                .update({
+                  [attachmentColumn]: JSON.stringify(newAttachmentMeta),
+                })
+                .where(where)
+            );
+          }
+        }
+      }
+      await Promise.all(updateRecords);
+    }
+  }
+}
diff --git a/scripts/sdk/swagger.json b/scripts/sdk/swagger.json
index a3ed9da5d0..aee0db1105 100644
--- a/scripts/sdk/swagger.json
+++ b/scripts/sdk/swagger.json
@@ -9056,7 +9056,11 @@
           },
           "icon": {
             "type": "string"
-          }
+          },
+          "path": {
+            "type": "string"
+          },
+          "data": {}
         }
       },
       "Webhook": {
diff --git a/tests/playwright/fixtures/sampleFiles/Image/1.jpeg b/tests/playwright/fixtures/sampleFiles/Image/1.jpeg
new file mode 100644
index 0000000000..38f6296de1
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/1.jpeg differ
diff --git a/tests/playwright/fixtures/sampleFiles/Image/2.png b/tests/playwright/fixtures/sampleFiles/Image/2.png
new file mode 100644
index 0000000000..8a8062b9ad
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/2.png differ
diff --git a/tests/playwright/fixtures/sampleFiles/Image/3.jpeg b/tests/playwright/fixtures/sampleFiles/Image/3.jpeg
new file mode 100644
index 0000000000..f3a232b77e
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/3.jpeg differ
diff --git a/tests/playwright/fixtures/sampleFiles/Image/4.jpeg b/tests/playwright/fixtures/sampleFiles/Image/4.jpeg
new file mode 100644
index 0000000000..72fe2b94d9
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/4.jpeg differ
diff --git a/tests/playwright/fixtures/sampleFiles/Image/5.jpeg b/tests/playwright/fixtures/sampleFiles/Image/5.jpeg
new file mode 100644
index 0000000000..becc1dcdb9
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/5.jpeg differ
diff --git a/tests/playwright/fixtures/sampleFiles/Image/6_bigSize.png b/tests/playwright/fixtures/sampleFiles/Image/6_bigSize.png
new file mode 100644
index 0000000000..9fb77d9311
Binary files /dev/null and b/tests/playwright/fixtures/sampleFiles/Image/6_bigSize.png differ
diff --git a/tests/playwright/pages/Base.ts b/tests/playwright/pages/Base.ts
index 4aeed1e144..783f6c51ca 100644
--- a/tests/playwright/pages/Base.ts
+++ b/tests/playwright/pages/Base.ts
@@ -49,7 +49,7 @@ export default abstract class BasePage {
     ]);
   }
 
-  async attachFile({ filePickUIAction, filePath }: { filePickUIAction: Promise<any>; filePath: string }) {
+  async attachFile({ filePickUIAction, filePath }: { filePickUIAction: Promise<any>; filePath: string[] }) {
     const [fileChooser] = await Promise.all([
       // It is important to call waitForEvent before click to set up waiting.
       this.rootPage.waitForEvent('filechooser'),
diff --git a/tests/playwright/pages/Dashboard/Grid/Column/Attachment.ts b/tests/playwright/pages/Dashboard/Grid/Column/Attachment.ts
new file mode 100644
index 0000000000..14a1479ddb
--- /dev/null
+++ b/tests/playwright/pages/Dashboard/Grid/Column/Attachment.ts
@@ -0,0 +1,140 @@
+import { ColumnPageObject } from '.';
+import BasePage from '../../../Base';
+import { expect } from '@playwright/test';
+
+export class AttachmentColumnPageObject extends BasePage {
+  readonly column: ColumnPageObject;
+
+  constructor(column: ColumnPageObject) {
+    super(column.rootPage);
+    this.column = column;
+  }
+
+  get() {
+    return this.column.get();
+  }
+
+  async advanceConfig({
+    columnTitle,
+    fileCount,
+    fileSize,
+    fileTypesExcludeList,
+  }: {
+    columnTitle: string;
+    fileCount?: number;
+    fileSize?: number;
+    fileTypesExcludeList?: string[];
+  }) {
+    await this.column.openEdit({ title: columnTitle });
+    await this.column.editMenuShowMore();
+
+    // text box : nc-attachment-max-count
+    // text box : nc-attachment-max-size
+    // checkbox : ant-tree-checkbox
+    //     Checkbox order: Application, Audio, Image, Video, Misc
+
+    if (fileCount) {
+      const inputMaxCount = await this.column.get().locator(`.nc-attachment-max-count`);
+      await inputMaxCount.locator(`input`).fill(fileCount.toString());
+    }
+
+    if (fileSize) {
+      const inputMaxSize = await this.column.get().locator(`.nc-attachment-max-size`);
+      await inputMaxSize.locator(`input`).fill(fileSize.toString());
+    }
+
+    if (fileTypesExcludeList) {
+      // click on nc-allow-all-mime-type-checkbox
+      const allowAllMimeCheckbox = await this.column.get().locator(`.nc-allow-all-mime-type-checkbox`);
+      await allowAllMimeCheckbox.click();
+
+      const treeList = await this.column.get().locator(`.ant-tree-list`);
+      const checkboxList = await treeList.locator(`.ant-tree-treenode`);
+
+      for (let i = 0; i < fileTypesExcludeList.length; i++) {
+        const fileType = fileTypesExcludeList[i];
+        switch (fileType) {
+          case 'Application':
+            await checkboxList.nth(0).locator(`.ant-tree-checkbox`).click();
+            break;
+          case 'Audio':
+            await checkboxList.nth(1).locator(`.ant-tree-checkbox`).click();
+            break;
+          case 'Image':
+            await checkboxList.nth(2).locator(`.ant-tree-checkbox`).click();
+            break;
+          case 'Video':
+            await checkboxList.nth(3).locator(`.ant-tree-checkbox`).click();
+            break;
+          case 'Misc':
+            await checkboxList.nth(4).locator(`.ant-tree-checkbox`).click();
+            break;
+          default:
+            break;
+        }
+      }
+
+      await this.rootPage.waitForTimeout(1000);
+    }
+
+    await this.column.save({ isUpdated: true });
+  }
+
+  // add multiple options at once after column creation is completed
+  //
+  async addOptions({ columnTitle, options }: { columnTitle: string; options: string[] }) {
+    await this.column.openEdit({ title: columnTitle });
+    for (let i = 0; i < options.length; i++) {
+      await this.column.get().locator('button:has-text("Add option")').click();
+      await this.column.get().locator(`[data-testid="select-column-option-input-${i}"]`).click();
+      await this.column.get().locator(`[data-testid="select-column-option-input-${i}"]`).fill(options[i]);
+    }
+    await this.column.save({ isUpdated: true });
+  }
+
+  async editOption({ columnTitle, index, newOption }: { index: number; columnTitle: string; newOption: string }) {
+    await this.column.openEdit({ title: columnTitle });
+
+    await this.column.get().locator(`[data-testid="select-column-option-input-${index}"]`).click();
+    await this.column.get().locator(`[data-testid="select-column-option-input-${index}"]`).fill(newOption);
+
+    await this.column.save({ isUpdated: true });
+  }
+
+  async deleteOption({ columnTitle, index }: { index: number; columnTitle: string }) {
+    await this.column.openEdit({ title: columnTitle });
+    await this.column.get().locator(`svg[data-testid="select-column-option-remove-${index}"]`).click();
+    await expect(this.column.get().getByTestId(`select-column-option-${index}`)).toHaveClass(/removed/);
+    await this.column.save({ isUpdated: true });
+  }
+
+  async deleteOptionWithUndo({ columnTitle, index }: { index: number; columnTitle: string }) {
+    await this.column.openEdit({ title: columnTitle });
+    await this.column.get().locator(`svg[data-testid="select-column-option-remove-${index}"]`).click();
+    await expect(this.column.get().getByTestId(`select-column-option-${index}`)).toHaveClass(/removed/);
+    await this.column.get().locator(`svg[data-testid="select-column-option-remove-undo-${index}"]`).click();
+    await expect(this.column.get().getByTestId(`select-column-option-${index}`)).not.toHaveClass(/removed/);
+    await this.column.save({ isUpdated: true });
+  }
+
+  async reorderOption({
+    columnTitle,
+    sourceOption,
+    destinationOption,
+  }: {
+    columnTitle: string;
+    sourceOption: string;
+    destinationOption: string;
+  }) {
+    await this.column.openEdit({ title: columnTitle });
+    await this.column.rootPage.waitForTimeout(150);
+    await this.column.rootPage.dragAndDrop(
+      `svg[data-testid="select-option-column-handle-icon-${sourceOption}"]`,
+      `svg[data-testid="select-option-column-handle-icon-${destinationOption}"]`,
+      {
+        force: true,
+      }
+    );
+    await this.column.save({ isUpdated: true });
+  }
+}
diff --git a/tests/playwright/pages/Dashboard/Grid/Column/index.ts b/tests/playwright/pages/Dashboard/Grid/Column/index.ts
index 483e6945a3..064b2093b5 100644
--- a/tests/playwright/pages/Dashboard/Grid/Column/index.ts
+++ b/tests/playwright/pages/Dashboard/Grid/Column/index.ts
@@ -2,15 +2,18 @@ import { expect } from '@playwright/test';
 import { GridPage } from '..';
 import BasePage from '../../../Base';
 import { SelectOptionColumnPageObject } from './SelectOptionColumn';
+import { AttachmentColumnPageObject } from './Attachment';
 
 export class ColumnPageObject extends BasePage {
   readonly grid: GridPage;
   readonly selectOption: SelectOptionColumnPageObject;
+  readonly attachmentColumnPageObject: AttachmentColumnPageObject;
 
   constructor(grid: GridPage) {
     super(grid.rootPage);
     this.grid = grid;
     this.selectOption = new SelectOptionColumnPageObject(this);
+    this.attachmentColumnPageObject = new AttachmentColumnPageObject(this);
   }
 
   get() {
@@ -298,6 +301,10 @@ export class ColumnPageObject extends BasePage {
     }
   }
 
+  async editMenuShowMore() {
+    await this.rootPage.locator('.nc-more-options').click();
+  }
+
   async duplicateColumn({ title, expectedTitle = `${title}_copy` }: { title: string; expectedTitle?: string }) {
     await this.grid.get().locator(`th[data-title="${title}"] .nc-ui-dt-dropdown`).click();
     await this.rootPage.locator('li[role="menuitem"]:has-text("Duplicate"):visible').click();
diff --git a/tests/playwright/pages/Dashboard/common/Cell/AttachmentCell.ts b/tests/playwright/pages/Dashboard/common/Cell/AttachmentCell.ts
index 9e186aa862..37b41ff83c 100644
--- a/tests/playwright/pages/Dashboard/common/Cell/AttachmentCell.ts
+++ b/tests/playwright/pages/Dashboard/common/Cell/AttachmentCell.ts
@@ -18,14 +18,48 @@ export class AttachmentCellPageObject extends BasePage {
     return this.get({ index, columnHeader }).locator('[data-testid="attachment-cell-file-picker-button"]').click();
   }
 
-  async addFile({ index, columnHeader, filePath }: { index?: number; columnHeader: string; filePath: string }) {
+  // filePath: to attach multiple files, pass an array of file paths
+  // e.g. ['path/to/file1', 'path/to/file2']
+  //
+  async addFile({ index, columnHeader, filePath }: { index?: number; columnHeader: string; filePath: string[] }) {
     const attachFileAction = this.get({ index, columnHeader })
       .locator('[data-testid="attachment-cell-file-picker-button"]')
       .click();
     return await this.attachFile({ filePickUIAction: attachFileAction, filePath });
   }
 
+  async expandModalAddFile({ filePath }: { filePath: string[] }) {
+    const attachFileAction = this.rootPage
+      .locator('.ant-modal.nc-attachment-modal.active')
+      .locator('[data-testid="attachment-expand-file-picker-button"]')
+      .click();
+    return await this.attachFile({ filePickUIAction: attachFileAction, filePath });
+  }
+
+  async expandModalOpen({ index, columnHeader }: { index?: number; columnHeader: string }) {
+    return this.get({ index, columnHeader })
+      .locator('.nc-cell > .nc-attachment-cell > .group.cursor-pointer')
+      .last()
+      .click();
+  }
+
   async verifyFile({ index, columnHeader }: { index: number; columnHeader: string }) {
     await expect(await this.get({ index, columnHeader }).locator('.nc-attachment')).toBeVisible();
   }
+
+  async verifyFileCount({ index, columnHeader, count }: { index: number; columnHeader: string; count: number }) {
+    const attachments = await this.get({ index, columnHeader }).locator(
+      '.nc-cell > .nc-attachment-cell > .flex > .nc-attachment'
+    );
+
+    console.log(await attachments.count());
+    expect(await attachments.count()).toBe(count);
+
+    // attachments should be of count 'count'
+    // await expect(await attachments.count()).toBe(count);
+  }
+
+  async expandModalClose() {
+    return this.rootPage.locator('.ant-modal.nc-attachment-modal.active').press('Escape');
+  }
 }
diff --git a/tests/playwright/tests/columnAttachments.spec.ts b/tests/playwright/tests/columnAttachments.spec.ts
index f4ef56049e..fba2c41aa7 100644
--- a/tests/playwright/tests/columnAttachments.spec.ts
+++ b/tests/playwright/tests/columnAttachments.spec.ts
@@ -2,25 +2,32 @@ import { expect, test } from '@playwright/test';
 import { DashboardPage } from '../pages/Dashboard';
 import { SharedFormPage } from '../pages/SharedForm';
 import setup from '../setup';
+import { AccountPage } from '../pages/Account';
+import { AccountLicensePage } from '../pages/Account/License';
 
 test.describe('Attachment column', () => {
   let dashboard: DashboardPage;
-  let context: any;
+  let accountLicensePage: AccountLicensePage, accountPage: AccountPage, context: any;
 
   test.beforeEach(async ({ page }) => {
     context = await setup({ page });
     dashboard = new DashboardPage(page, context.project);
+    accountPage = new AccountPage(page);
+    accountLicensePage = new AccountLicensePage(accountPage);
   });
 
-  test('Create and verify atttachent column, verify it in shared form,', async ({ page, context }) => {
+  test('Create and verify attachment column, verify it in shared form,', async ({ page, context }) => {
+    // run tests slowly
+    test.slow();
+
     await dashboard.treeView.openTable({ title: 'Country' });
     await dashboard.grid.column.create({
       title: 'testAttach',
       type: 'Attachment',
     });
 
-    for (let i = 4; i <= 6; i++) {
-      const filepath = `${process.cwd()}/fixtures/sampleFiles/${i}.json`;
+    for (let i = 12; i >= 8; i -= 2) {
+      const filepath = [`${process.cwd()}/fixtures/sampleFiles/${i / 2}.json`];
       await dashboard.grid.cell.attachment.addFile({
         index: i,
         columnHeader: 'testAttach',
@@ -32,12 +39,12 @@ test.describe('Attachment column', () => {
       });
     }
     await dashboard.grid.cell.attachment.addFile({
-      index: 7,
+      index: 14,
       columnHeader: 'testAttach',
-      filePath: `${process.cwd()}/fixtures/sampleFiles/sampleImage.jpeg`,
+      filePath: [`${process.cwd()}/fixtures/sampleFiles/sampleImage.jpeg`],
     });
     await dashboard.grid.cell.attachment.verifyFile({
-      index: 7,
+      index: 14,
       columnHeader: 'testAttach',
     });
 
@@ -60,7 +67,7 @@ test.describe('Attachment column', () => {
     });
     await sharedForm.cell.attachment.addFile({
       columnHeader: 'testAttach',
-      filePath: `${process.cwd()}/fixtures/sampleFiles/1.json`,
+      filePath: [`${process.cwd()}/fixtures/sampleFiles/1.json`],
     });
     await sharedForm.submit();
     await sharedForm.verifySuccessMessage();
@@ -83,11 +90,125 @@ test.describe('Attachment column', () => {
     const csvArray = csvFileData.split('\r\n');
     const columns = csvArray[0];
     const rows = csvArray.slice(1);
-    const cells = rows[4].split(',');
+    const cells = rows[10].split(',');
 
     await expect(columns).toBe('Country,City List,testAttach');
-    await expect(cells[0]).toBe('Anguilla');
-    await expect(cells[1]).toBe('South Hill');
-    await expect(cells[2].includes('4.json(http://localhost:8080/download/')).toBe(true);
+    await expect(cells[0]).toBe('Bahrain');
+    await expect(cells[1]).toBe('al-Manama');
+    await expect(cells[2].includes('5.json(http://localhost:8080/download/')).toBe(true);
+  });
+
+  test('Attachment enterprise features,', async ({ page, context }) => {
+    // configure enterprise key
+    test.slow();
+    await accountLicensePage.goto();
+    await accountLicensePage.saveLicenseKey('1234567890');
+    await dashboard.goto();
+
+    await dashboard.treeView.openTable({ title: 'Country' });
+    await dashboard.grid.column.create({
+      title: 'testAttach',
+      type: 'Attachment',
+    });
+    await dashboard.grid.column.attachmentColumnPageObject.advanceConfig({
+      columnTitle: 'testAttach',
+      fileCount: 2,
+      fileSize: 1,
+      // allow only image type
+      fileTypesExcludeList: ['Application', 'Video', 'Audio', 'Misc'],
+    });
+
+    // in-cell, add big file, should get rejected
+    const bigFile = [`${process.cwd()}/fixtures/sampleFiles/Image/6_bigSize.png`];
+    await dashboard.grid.cell.attachment.addFile({
+      index: 1,
+      columnHeader: 'testAttach',
+      filePath: bigFile,
+    });
+    // The size of ${file.name} exceeds the maximum file size ${attachmentMeta.maxAttachmentSize} MB.
+    await dashboard.verifyToast({ message: 'The size of 6_bigSize.png exceeds the maximum file size 1 MB.' });
+
+    // in-cell, add 2 files, should get accepted
+    const twoFileArray = [
+      `${process.cwd()}/fixtures/sampleFiles/Image/1.jpeg`,
+      `${process.cwd()}/fixtures/sampleFiles/Image/2.png`,
+    ];
+    await dashboard.grid.cell.attachment.addFile({
+      index: 1,
+      columnHeader: 'testAttach',
+      filePath: twoFileArray,
+    });
+    await dashboard.rootPage.waitForTimeout(2000);
+    await dashboard.grid.cell.attachment.verifyFileCount({
+      index: 1,
+      columnHeader: 'testAttach',
+      count: 2,
+    });
+
+    // add another file, should get rejected
+    const oneFileArray = [`${process.cwd()}/fixtures/sampleFiles/Image/3.jpeg`];
+    await dashboard.grid.cell.attachment.addFile({
+      index: 1,
+      columnHeader: 'testAttach',
+      filePath: oneFileArray,
+    });
+    // wait for toast 'You can only upload at most 2 files to this cell'
+    await dashboard.verifyToast({ message: 'You can only upload at most 2 files to this cell' });
+
+    // try to upload 3 files in one go, should get rejected
+    const threeFileArray = [
+      `${process.cwd()}/fixtures/sampleFiles/Image/1.jpeg`,
+      `${process.cwd()}/fixtures/sampleFiles/Image/2.png`,
+      `${process.cwd()}/fixtures/sampleFiles/Image/3.jpeg`,
+    ];
+    await dashboard.grid.cell.attachment.addFile({
+      index: 2,
+      columnHeader: 'testAttach',
+      filePath: threeFileArray,
+    });
+    await dashboard.verifyToast({ message: 'You can only upload at most 2 files to this cell' });
+
+    // open expand modal, try to insert file type not supported
+    // message: ${file.name} has the mime type ${file.type} which is not allowed in this column.
+    await dashboard.grid.cell.attachment.addFile({
+      index: 3,
+      columnHeader: 'testAttach',
+      filePath: [`${process.cwd()}/fixtures/sampleFiles/1.json`],
+    });
+    await dashboard.verifyToast({
+      message: '1.json has the mime type application/json which is not allowed in this column.',
+    });
+
+    // Expand modal
+
+    // open expand modal, try to insert more files
+    await dashboard.grid.cell.attachment.expandModalOpen({
+      index: 1,
+      columnHeader: 'testAttach',
+    });
+    await dashboard.grid.cell.attachment.expandModalAddFile({
+      filePath: oneFileArray,
+    });
+    await dashboard.verifyToast({ message: 'You can only upload at most 2 files to this cell' });
+
+    // open expand modal, try to insert file type not supported
+    // message: ${file.name} has the mime type ${file.type} which is not allowed in this column.
+    await dashboard.grid.cell.attachment.expandModalAddFile({
+      filePath: [`${process.cwd()}/fixtures/sampleFiles/1.json`],
+    });
+    await dashboard.verifyToast({
+      message: '1.json has the mime type application/json which is not allowed in this column.',
+    });
+
+    // open expand modal, try to insert big file
+    // message: The size of ${file.name} exceeds the maximum file size ${attachmentMeta.maxAttachmentSize} MB.
+    await dashboard.grid.cell.attachment.expandModalAddFile({
+      filePath: bigFile,
+    });
+    await dashboard.verifyToast({ message: 'The size of 6_bigSize.png exceeds the maximum file size 1 MB.' });
+    await dashboard.grid.cell.attachment.expandModalClose();
+
+    // wait for timeout
+    // await dashboard.rootPage.waitForTimeout(20000);
   });
 });