Merge branch 'develop' of https://github.com/nocodb/nocodb into fix/tooltip-showOnTruncate

packages/nc-gui/components.d.ts

@@ -49,6 +49,7 @@ declare module '@vue/runtime-core' {
     AModal: typeof import('ant-design-vue/es')['Modal']
     APagination: typeof import('ant-design-vue/es')['Pagination']
     APopover: typeof import('ant-design-vue/es')['Popover']
+    AProgress: typeof import('ant-design-vue/es')['Progress']
     ARadio: typeof import('ant-design-vue/es')['Radio']
     ARadioGroup: typeof import('ant-design-vue/es')['RadioGroup']
     ARate: typeof import('ant-design-vue/es')['Rate']

packages/nc-gui/components/cell/Percent.vue

@@ -12,6 +12,8 @@ const emits = defineEmits(['update:modelValue'])
 
 const { showNull } = useGlobal()
 
+const column = inject(ColumnInj)!
+
 const editEnabled = inject(EditModeInj)
 
 const isEditColumn = inject(EditColumnInj, ref(false))
@@ -32,18 +34,53 @@ const vModel = computed({
 const isExpandedFormOpen = inject(IsExpandedFormOpenInj, ref(false))!
 
 const focus: VNodeRef = (el) => !isExpandedFormOpen.value && !isEditColumn.value && (el as HTMLInputElement)?.focus()
+
+const cellFocused = ref(false)
+
+const expandedEditEnabled = ref(false)
+
+const percentMeta = computed(() => {
+  return {
+    is_progress: false,
+    ...parseProp(column.value?.meta),
+  }
+})
+
+const onBlur = () => {
+  if (editEnabled) {
+    editEnabled.value = false
+  }
+  cellFocused.value = false
+  expandedEditEnabled.value = false
+}
+
+const onFocus = () => {
+  cellFocused.value = true
+}
+
+const onMouseover = () => {
+  expandedEditEnabled.value = true
+}
+
+const onMouseleave = () => {
+  if (!cellFocused.value) {
+    expandedEditEnabled.value = false
+  }
+}
 </script>
 
 <template>
+  <div class="nc-filter-value-select w-full" @mouseover="onMouseover" @mouseleave="onMouseleave">
     <input
-    v-if="editEnabled"
+      v-if="(!isExpandedFormOpen && editEnabled) || (isExpandedFormOpen && expandedEditEnabled)"
       :ref="focus"
       v-model="vModel"
       class="w-full !text-sm !border-none !outline-none focus:ring-0 text-base p-1"
       :class="{ '!px-2': editEnabled }"
       type="number"
       :placeholder="isEditColumn ? $t('labels.optional') : ''"
-    @blur="editEnabled = false"
+      @blur="onBlur"
+      @focus="onFocus"
       @keydown.down.stop
       @keydown.left.stop
       @keydown.right.stop
@@ -53,5 +90,17 @@ const focus: VNodeRef = (el) => !isExpandedFormOpen.value && !isEditColumn.value
       @mousedown.stop
     />
     <span v-else-if="vModel === null && showNull" class="nc-null capitalize">{{ $t('general.null') }}</span>
-  <span v-else>{{ vModel }}</span>
+    <div v-else-if="percentMeta.is_progress === true && vModel !== null && vModel !== undefined" class="px-2">
+      <a-progress
+        :percent="Number(parseFloat(vModel.toString()).toFixed(2))"
+        size="small"
+        status="normal"
+        stroke-color="#3366FF"
+        trail-color="#E5E5E5"
+        :show-info="false"
+      />
+    </div>
+    <!-- nbsp to keep height even if vModel is zero length -->
+    <span v-else>{{ vModel }}&nbsp;</span>
+  </div>
 </template>

packages/nc-gui/components/smartsheet/column/EditOrAdd.vue

@@ -312,6 +312,7 @@ if (props.fromTableExplorer) {
             v-model:value="formState"
           />
           <LazySmartsheetColumnLinkOptions v-if="isEdit && formState.uidt === UITypes.Links" v-model:value="formState" />
+          <LazySmartsheetColumnPercentOptions v-if="formState.uidt === UITypes.Percent" v-model:value="formState" />
           <LazySmartsheetColumnSpecificDBTypeOptions v-if="formState.uidt === UITypes.SpecificDBType" />
           <SmartsheetColumnSelectOptions
             v-if="formState.uidt === UITypes.SingleSelect || formState.uidt === UITypes.MultiSelect"

packages/nc-gui/components/smartsheet/column/PercentOptions.vue

@@ -1,47 +1,36 @@
-<!-- File not in use for now -->
-
 <script setup lang="ts">
-import { precisions, useVModel } from '#imports'
+import { useVModel } from '#imports'
 
 const props = defineProps<{
   value: any
+  isEdit: boolean
 }>()
 
 const emit = defineEmits(['update:value'])
 
 const vModel = useVModel(props, 'value', emit)
 
-if (!vModel.value.meta) vModel.value.meta = {}
+const validators = {}
-if (!vModel.value.meta?.negative) vModel.value.meta.negative = false
+
-if (!vModel.value.meta?.default) vModel.value.meta.default = null
+const { setAdditionalValidations } = useColumnCreateStoreOrThrow()
-if (!vModel.value.meta?.precision) vModel.value.meta.precision = precisions[0].id
+
+setAdditionalValidations({
+  ...validators,
+})
+
+// set default value
+vModel.value.meta = {
+  is_progress: false,
+  ...vModel.value.meta,
+}
 </script>
 
 <template>
-  <div class="flex flex-col mt-2 gap-2">
+  <div class="flex flex-col">
-    <div class="flex flex-row space-x-2">
+    <div>
-      <a-form-item class="flex w-1/2" :label="$t('placeholder.precision')">
+      <a-checkbox v-if="vModel.meta" v-model:checked="vModel.meta.is_progress" class="ml-1 mb-1">
-        <a-select v-model:value="vModel.meta.precision" dropdown-class-name="nc-dropdown-precision">
+        <span class="text-[10px] text-gray-600">Display as progress</span>
-          <a-select-option v-for="(precision, i) of precisions" :key="i" :value="precision.id">
+      </a-checkbox>
-            <div class="flex flex-row items-center">
-              <div class="text-xs">
-                {{ precision.title }}
-              </div>
-            </div>
-          </a-select-option>
-        </a-select>
-      </a-form-item>
-      <a-form-item :label="$t('labels.defaultNumberPercent')">
-        <a-input v-model:value="vModel.meta.default" :name="$t('labels.default')" type="number" />
-      </a-form-item>
-    </div>
-    <div class="flex flex-row mt-2">
-      <a-form-item>
-        <div class="flex flex-row space-x-2 items-center">
-          <a-switch v-model:checked="vModel.meta.negative" :name="$t('labels.negative')" />
-          <div class="text-xs">{{ $t('placeholder.allowNegativeNumbers') }}</div>
-        </div>
-      </a-form-item>
     </div>
   </div>
 </template>

packages/nc-gui/components/smartsheet/column/PercentOptionsLegacy.vue

@@ -0,0 +1,47 @@
+<!-- File not in use for now -->
+
+<script setup lang="ts">
+import { precisions, useVModel } from '#imports'
+
+const props = defineProps<{
+  value: any
+}>()
+
+const emit = defineEmits(['update:value'])
+
+const vModel = useVModel(props, 'value', emit)
+
+if (!vModel.value.meta) vModel.value.meta = {}
+if (!vModel.value.meta?.negative) vModel.value.meta.negative = false
+if (!vModel.value.meta?.default) vModel.value.meta.default = null
+if (!vModel.value.meta?.precision) vModel.value.meta.precision = precisions[0].id
+</script>
+
+<template>
+  <div class="flex flex-col mt-2 gap-2">
+    <div class="flex flex-row space-x-2">
+      <a-form-item class="flex w-1/2" :label="$t('placeholder.precision')">
+        <a-select v-model:value="vModel.meta.precision" dropdown-class-name="nc-dropdown-precision">
+          <a-select-option v-for="(precision, i) of precisions" :key="i" :value="precision.id">
+            <div class="flex flex-row items-center">
+              <div class="text-xs">
+                {{ precision.title }}
+              </div>
+            </div>
+          </a-select-option>
+        </a-select>
+      </a-form-item>
+      <a-form-item :label="$t('labels.defaultNumberPercent')">
+        <a-input v-model:value="vModel.meta.default" :name="$t('labels.default')" type="number" />
+      </a-form-item>
+    </div>
+    <div class="flex flex-row mt-2">
+      <a-form-item>
+        <div class="flex flex-row space-x-2 items-center">
+          <a-switch v-model:checked="vModel.meta.negative" :name="$t('labels.negative')" />
+          <div class="text-xs">{{ $t('placeholder.allowNegativeNumbers') }}</div>
+        </div>
+      </a-form-item>
+    </div>
+  </div>
+</template>

packages/nc-gui/lang/ja.json

@@ -1,10 +1,10 @@
 {
   "dashboards": {
-    "create_new_dashboard_project": "Create New Interface",
+    "create_new_dashboard_project": "インターフェースを作成",
-    "connect_data_sources": "Connect data sources",
+    "connect_data_sources": "データソースに接続",
-    "alert": "Alert",
+    "alert": "アラート",
-    "alert-message": "No databases have been connected. Connect database bases to build interfaces. Skip this step and add databases from the base home page later.",
+    "alert-message": "データベースが接続されていません。DBベースを接続してインターフェースを構成してください。スキップして後でベースのホームページを追加することもできます。",
-    "select_database_projects_that_you_want_to_link_to_this_dashboard_projects": "Select Database Bases that you want to link to this Interface.",
+    "select_database_projects_that_you_want_to_link_to_this_dashboard_projects": "このインターフェースに接続するDBベースを選択します。",
     "create_interface": "Create interface",
     "project_name": "Base Name",
     "connect": "Connect",

packages/nocodb/src/controllers/attachments-secure.controller.ts

@@ -75,7 +75,11 @@ export class AttachmentsSecureController {
         path: path.join('nc', 'uploads', fpath),
       });
 
+      if (this.attachmentsService.previewAvailable(file.type)) {
         res.sendFile(file.path);
+      } else {
+        res.download(file.path);
+      }
     } catch (e) {
       res.status(404).send('Not found');
     }

packages/nocodb/src/controllers/attachments.controller.ts

@@ -68,7 +68,11 @@ export class AttachmentsController {
         path: path.join('nc', 'uploads', filename),
       });
 
+      if (this.attachmentsService.previewAvailable(file.type)) {
         res.sendFile(file.path);
+      } else {
+        res.download(file.path);
+      }
     } catch (e) {
       res.status(404).send('Not found');
     }
@@ -94,7 +98,11 @@ export class AttachmentsController {
         ),
       });
 
+      if (this.attachmentsService.previewAvailable(file.type)) {
         res.sendFile(file.path);
+      } else {
+        res.download(file.path);
+      }
     } catch (e) {
       res.status(404).send('Not found');
     }
@@ -109,7 +117,11 @@ export class AttachmentsController {
         path: path.join('nc', 'uploads', fpath),
       });
 
+      if (this.attachmentsService.previewAvailable(file.type)) {
         res.sendFile(file.path);
+      } else {
+        res.download(file.path);
+      }
     } catch (e) {
       res.status(404).send('Not found');
     }

packages/nocodb/src/services/attachments.service.ts

@@ -161,6 +161,14 @@ export class AttachmentsService {
     return { path: filePath, type };
   }
 
+  previewAvailable(mimetype: string) {
+    const available = ['image', 'pdf', 'text/plain'];
+    if (available.some((type) => mimetype.includes(type))) {
+      return true;
+    }
+    return false;
+  }
+
   sanitizeUrlPath(paths) {
     return paths.map((url) => url.replace(/[/.?#]+/g, '_'));
   }

packages/nocodb/src/strategies/authtoken.strategy/authtoken.strategy.ts

@@ -31,7 +31,7 @@ export class AuthTokenStrategy extends PassportStrategy(Strategy, 'authtoken') {
         const dbUser: Record<string, any> = await User.getWithRoles(
           apiToken.fk_user_id,
           {
-            baseId: req['ncBaseId'],
+            baseId: req['ncProjectId'],
             ...(req['ncWorkspaceId']
               ? { workspaceId: req['ncWorkspaceId'] }
               : {}),