feat(nc-gui): assign random base icon color for new base

packages/nc-gui/components/general/BaseIconColorPicker.vue

@@ -19,13 +19,11 @@ const props = withDefaults(
 
 const emit = defineEmits(['update:modelValue'])
 
-const defaultIconColors = ['#36BFFF', '#FA8231', '#FCBE3A', '#27D665', '#6A7184', '#FF4A3F', '#FC3AC6', '#7D26CD']
-
 const { modelValue, size, readonly } = props
 
 const isOpen = ref(false)
 
-const colorRef = ref(tinycolor(modelValue).isValid() ? modelValue : defaultIconColors[0])
+const colorRef = ref(tinycolor(modelValue).isValid() ? modelValue : baseIconColors[0])
 
 const updateIconColor = (color: string) => {
   const tcolor = tinycolor(color)
@@ -86,7 +84,7 @@ watch(
           <div class="flex justify-start">
             <GeneralColorPicker
               :model-value="colorRef"
-              :colors="defaultIconColors"
+              :colors="baseIconColors"
               :is-new-design="true"
               class="nc-base-icon-color-picker"
               @input="updateIconColor"

packages/nc-gui/components/workspace/CreateProjectDlg.vue

@@ -3,7 +3,16 @@ import type { RuleObject } from 'ant-design-vue/es/form'
 import type { Form, Input } from 'ant-design-vue'
 import type { VNodeRef } from '@vue/runtime-core'
 import { computed } from '@vue/reactivity'
-import { NcProjectType, baseTitleValidator, extractSdkResponseErrorMsg, ref, useGlobal, useI18n, useVModel } from '#imports'
+import {
+  NcProjectType,
+  baseIconColors,
+  baseTitleValidator,
+  extractSdkResponseErrorMsg,
+  ref,
+  useGlobal,
+  useI18n,
+  useVModel,
+} from '#imports'
 
 const props = defineProps<{
   modelValue: boolean
@@ -38,6 +47,9 @@ const form = ref<typeof Form>()
 
 const formState = ref({
   title: '',
+  meta: {
+    iconColor: baseIconColors[Math.floor(Math.random() * 1000) % baseIconColors.length],
+  },
 })
 
 const creating = ref(false)
@@ -48,6 +60,7 @@ const createProject = async () => {
     const base = await _createProject({
       type: baseType.value,
       title: formState.value.title,
+      meta: formState.value.meta,
     })
 
     navigateToProject({
@@ -77,6 +90,9 @@ watch(dialogShow, async (n, o) => {
 
     formState.value = {
       title: 'Base',
+      meta: {
+        iconColor: baseIconColors[Math.floor(Math.random() * 1000) % baseIconColors.length],
+      },
     }
 
     await nextTick()
@@ -100,7 +116,7 @@ const typeLabel = computed(() => {
     <template #header>
       <!-- Create A New Table -->
       <div class="flex flex-row items-center">
-        <GeneralProjectIcon :type="baseType" class="mr-2.5 !text-lg !h-4" />
+        <GeneralProjectIcon :color="formState.meta.iconColor" :type="baseType" class="mr-2.5 !text-lg !h-4" />
         {{
           $t('general.createEntity', {
             entity: typeLabel,

packages/nc-gui/store/bases.ts

@@ -242,11 +242,15 @@ export const useBases = defineStore('basesStore', () => {
     workspaceId?: string
     type: string
     linkedDbProjectIds?: string[]
+    meta?: Record<string, unknown>
   }) => {
     const result = await api.base.create(
       {
         title: basePayload.title,
         linked_db_project_ids: basePayload.linkedDbProjectIds,
+        meta: JSON.stringify({
+          ...(basePayload.meta || {}),
+        }),
       },
       {
         baseURL: getBaseUrl('nc'),

packages/nc-gui/utils/colorsUtils.ts

@@ -111,6 +111,8 @@ export const baseThemeColors = [
   '#333333',
 ]
 
+export const baseIconColors = ['#36BFFF', '#FA8231', '#FCBE3A', '#27D665', '#6A7184', '#FF4A3F', '#FC3AC6', '#7D26CD']
+
 const designSystem = {
   light: [
     // '#EBF0FF',

packages/nocodb/src/models/Base.ts

@@ -62,6 +62,11 @@ export default class Base implements BaseType {
       insertObj.order = await ncMeta.metaGetNextOrder(MetaTable.PROJECT, {});
     }
 
+    // stringify meta
+    if (insertObj.meta) {
+      insertObj.meta = stringifyMetaProp(insertObj);
+    }
+
     const { id: baseId } = await ncMeta.metaInsert2(
       null,
       null,

packages/nocodb/src/schema/swagger-v2.json

@@ -16352,6 +16352,10 @@
             "items": {
               "type": "string"
             }
+          },
+          "meta": {
+            "$ref": "#/components/schemas/Meta",
+            "description": "Base Meta"
           }
         },
         "required": [

packages/nocodb/src/schema/swagger.json

@@ -22522,6 +22522,10 @@
             "items": {
               "type": "string"
             }
+          },
+          "meta": {
+            "$ref": "#/components/schemas/Meta",
+            "description": "Base Meta"
           }
         },
         "required": [