From beed32a5a6222831269b196cdb15222acc37744f Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Wed, 3 Aug 2022 19:07:31 +0530
Subject: [PATCH 1/4] refactor/gui-v2-added-rollup-column

---
 .../smartsheet-column/EditOrAdd.vue           | 22 +++--
 .../smartsheet-column/RollupOptions.vue       | 94 +++++++++++++++++++
 2 files changed, 106 insertions(+), 10 deletions(-)
 create mode 100644 packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue

diff --git a/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue b/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
index 4cd8369692..a0a30bb131 100644
--- a/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
+++ b/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
@@ -1,5 +1,6 @@
 <script lang="ts" setup>
-import { UITypes } from 'nocodb-sdk'
+import { UITypes, isVirtualCol } from 'nocodb-sdk'
+import RollupOptions from './RollupOptions.vue'
 import { computed, inject, useColumnCreateStoreOrThrow, useMetas, watchEffect } from '#imports'
 import { MetaInj } from '~/context'
 import { uiTypes } from '~/utils/columnUtils'
@@ -93,16 +94,17 @@ watchEffect(() => {
       <SmartsheetColumnCheckboxOptions v-if="formState.uidt === UITypes.Checkbox" />
       <SmartsheetColumnLookupOptions v-if="formState.uidt === UITypes.Lookup" />
       <SmartsheetColumnDateOptions v-if="formState.uidt === UITypes.Date" />
-
-      <div>
-        <div
-          class="text-xs cursor-pointer text-grey nc-more-options my-2 flex align-center gap-1 justify-end"
-          @click="advancedOptions = !advancedOptions"
-        >
-          {{ advancedOptions ? $t('general.hideAll') : $t('general.showMore') }}
-          <component :is="advancedOptions ? MdiMinusIcon : MdiPlusIcon" />
-        </div>
+      <RollupOptions v-if="formState.uidt === UITypes.Rollup" />
+
+      <div
+        v-if="!isVirtualCol(formState.uidt)"
+        class="text-xs cursor-pointer text-grey nc-more-options my-2 flex align-center gap-1 justify-end"
+        @click="advancedOptions = !advancedOptions"
+      >
+        {{ advancedOptions ? $t('general.hideAll') : $t('general.showMore') }}
+        <component :is="advancedOptions ? MdiMinusIcon : MdiPlusIcon" />
       </div>
+
       <div class="overflow-hidden" :class="advancedOptions ? 'h-min' : 'h-0'">
         <a-checkbox
           v-if="formState.meta && columnToValidate.includes(formState.uidt)"
diff --git a/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
new file mode 100644
index 0000000000..45d0670b57
--- /dev/null
+++ b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
@@ -0,0 +1,94 @@
+<script setup lang="ts">
+import { UITypes, isSystemColumn, isVirtualCol } from 'nocodb-sdk'
+import { useColumnCreateStoreOrThrow } from '#imports'
+import { MetaInj } from '~/context'
+
+const { formState, validateInfos, onDataTypeChange, setAdditionalValidations } = $(useColumnCreateStoreOrThrow())
+const { tables } = $(useProject())
+const meta = $(inject(MetaInj))
+const { metas } = $(useMetas())
+
+setAdditionalValidations({
+  fk_relation_column_id: [{ required: true, message: 'Required' }],
+  fk_rollup_column_id: [{ required: true, message: 'Required' }],
+  rollup_function: [{ required: true, message: 'Required' }],
+})
+
+const relationNames = {
+  mm: 'Many To Many',
+  hm: 'Has Many',
+}
+
+const aggrFunctionsList = [
+  { text: 'count', value: 'count' },
+  { text: 'min', value: 'min' },
+  { text: 'max', value: 'max' },
+  { text: 'avg', value: 'avg' },
+  { text: 'min', value: 'min' },
+  { text: 'sum', value: 'sum' },
+  { text: 'countDistinct', value: 'countDistinct' },
+  { text: 'sumDistinct', value: 'sumDistinct' },
+  { text: 'avgDistinct', value: 'avgDistinct' },
+]
+
+const refTables = $computed(() => {
+  if (!tables || !tables.length) {
+    return []
+  }
+
+  return meta.columns
+    .filter((c) => c.uidt === UITypes.LinkToAnotherRecord && c.colOptions.type !== 'bt' && !c.system)
+    .map((c) => ({
+      col: c.colOptions,
+      column: c,
+      ...tables.find((t) => t.id === c.colOptions.fk_related_model_id),
+    }))
+})
+
+const columns = $computed(() => {
+  const selectedTable = refTables.find((t) => t.column.id === formState.fk_relation_column_id)
+  if (!selectedTable?.id) {
+    return []
+  }
+
+  return metas[selectedTable.id].columns.filter((c) => !isVirtualCol(c.uidt) && !isSystemColumn(c))
+})
+</script>
+
+<template>
+  <div class="p-4 w-full flex flex-col border-2 mb-2 mt-4">
+    <div class="w-full flex flex-row space-x-2">
+      <a-form-item class="flex w-1/2 pb-2" :label="$t('labels.childTable')" v-bind="validateInfos.fk_relation_column_id">
+        <a-select v-model:value="formState.fk_relation_column_id" size="small" @change="onDataTypeChange">
+          <a-select-option v-for="(table, index) in refTables" :key="index" :value="table.col.fk_column_id">
+            <div class="flex flex-row items-center">
+              <div class="font-weight-bold text-xs">{{ table.column.title }}</div>
+              <div class="text-[0.5rem]">({{ relationNames[table.col.type] }} {{ table.title || table.table_name }})</div>
+            </div>
+          </a-select-option>
+        </a-select>
+      </a-form-item>
+      <a-form-item class="flex w-1/2" :label="$t('labels.childColumn')" v-bind="validateInfos.fk_rollup_column_id">
+        <a-select
+          v-model:value="formState.fk_rollup_column_id"
+          name="fk_rollup_column_id"
+          size="small"
+          @change="onDataTypeChange"
+        >
+          <a-select-option v-for="(column, index) in columns" :key="index" :value="column.id">
+            {{ column.title }}
+          </a-select-option>
+        </a-select>
+      </a-form-item>
+    </div>
+    <a-form-item label="Aggregate function" v-bind="validateInfos.rollup_function">
+      <a-select v-model:value="formState.rollup_function" size="small" @change="onDataTypeChange">
+        <a-select-option v-for="(func, index) in aggrFunctionsList" :key="index" :value="func.value">
+          {{ func.text }}
+        </a-select-option>
+      </a-select>
+    </a-form-item>
+  </div>
+</template>
+
+<style scoped></style>

From 6f448f06a8a061cf6be669ca483be9f5524d0c71 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Wed, 3 Aug 2022 19:13:43 +0530
Subject: [PATCH 2/4] fix/gui-v2-rollup-column-style-fix

---
 .../nc-gui-v2/components/smartsheet-column/RollupOptions.vue  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
index 45d0670b57..86bd412256 100644
--- a/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
+++ b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
@@ -61,9 +61,9 @@ const columns = $computed(() => {
       <a-form-item class="flex w-1/2 pb-2" :label="$t('labels.childTable')" v-bind="validateInfos.fk_relation_column_id">
         <a-select v-model:value="formState.fk_relation_column_id" size="small" @change="onDataTypeChange">
           <a-select-option v-for="(table, index) in refTables" :key="index" :value="table.col.fk_column_id">
-            <div class="flex flex-row items-center">
+            <div class="flex flex-row items-center space-x-0.5">
               <div class="font-weight-bold text-xs">{{ table.column.title }}</div>
-              <div class="text-[0.5rem]">({{ relationNames[table.col.type] }} {{ table.title || table.table_name }})</div>
+              <div class="text-[0.45rem]">({{ relationNames[table.col.type] }} {{ table.title || table.table_name }})</div>
             </div>
           </a-select-option>
         </a-select>

From 0daab21eec7db649c32983ab40a5bc7e8b6a61bd Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Thu, 4 Aug 2022 11:14:31 +0530
Subject: [PATCH 3/4] fix/fixed rollup column validation issue

---
 .../nc-gui-v2/components/smartsheet-column/RollupOptions.vue  | 4 ++++
 packages/nc-gui-v2/composables/useColumnCreateStore.ts        | 3 ++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
index 86bd412256..e3fa65240d 100644
--- a/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
+++ b/packages/nc-gui-v2/components/smartsheet-column/RollupOptions.vue
@@ -31,6 +31,10 @@ const aggrFunctionsList = [
   { text: 'avgDistinct', value: 'avgDistinct' },
 ]
 
+if (!formState.fk_relation_column_id) formState.fk_relation_column_id = null
+if (!formState.fk_rollup_column_id) formState.fk_rollup_column_id = null
+if (!formState.rollup_function) formState.rollup_function = null
+
 const refTables = $computed(() => {
   if (!tables || !tables.length) {
     return []
diff --git a/packages/nc-gui-v2/composables/useColumnCreateStore.ts b/packages/nc-gui-v2/composables/useColumnCreateStore.ts
index 59c0b9dc37..f1d37686d1 100644
--- a/packages/nc-gui-v2/composables/useColumnCreateStore.ts
+++ b/packages/nc-gui-v2/composables/useColumnCreateStore.ts
@@ -198,7 +198,8 @@ const [useProvideColumnCreateStore, useColumnCreateStore] = createInjectionState
       }
       onSuccess()
     } catch (e: any) {
-      toast.error(await extractSdkResponseErrorMsg(e))
+      const error = await extractSdkResponseErrorMsg(e)
+      if (error) toast.error(await extractSdkResponseErrorMsg(e))
     }
   }
 

From 048c2d45fbdb037c15d7ad6a521d5655f40a270c Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Thu, 4 Aug 2022 11:26:31 +0530
Subject: [PATCH 4/4] chore/removed unnecassary rollup option import

---
 packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue b/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
index a0a30bb131..3f196a7af4 100644
--- a/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
+++ b/packages/nc-gui-v2/components/smartsheet-column/EditOrAdd.vue
@@ -1,6 +1,5 @@
 <script lang="ts" setup>
 import { UITypes, isVirtualCol } from 'nocodb-sdk'
-import RollupOptions from './RollupOptions.vue'
 import { computed, inject, useColumnCreateStoreOrThrow, useMetas, watchEffect } from '#imports'
 import { MetaInj } from '~/context'
 import { uiTypes } from '~/utils/columnUtils'
@@ -94,7 +93,7 @@ watchEffect(() => {
       <SmartsheetColumnCheckboxOptions v-if="formState.uidt === UITypes.Checkbox" />
       <SmartsheetColumnLookupOptions v-if="formState.uidt === UITypes.Lookup" />
       <SmartsheetColumnDateOptions v-if="formState.uidt === UITypes.Date" />
-      <RollupOptions v-if="formState.uidt === UITypes.Rollup" />
+      <SmartsheetColumnRollupOptions v-if="formState.uidt === UITypes.Rollup" />
 
       <div
         v-if="!isVirtualCol(formState.uidt)"