fix(gui-v2): reload data after linking/unlinking

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue

@@ -2,11 +2,12 @@
 import type { ColumnType } from 'nocodb-sdk'
 import ItemChip from './components/ItemChip.vue'
 import ListItems from './components/ListItems.vue'
-import { ColumnInj, ValueInj, RowInj } from '~/context'
 import { useProvideLTARStore } from '#imports'
+import { ColumnInj, ReloadViewDataHookInj, RowInj, ValueInj } from '~/context'
 import MdiExpandIcon from '~icons/mdi/arrow-expand'
 
 const column = inject(ColumnInj)
+const reloadTrigger = inject(ReloadViewDataHookInj)
 const value = inject(ValueInj)
 const row = inject(RowInj)
 const active = false
@@ -16,6 +17,7 @@ const listItemsDlg = ref(false)
 const { relatedTableMeta, loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
   column as Required<ColumnType>,
   row,
+  () => reloadTrigger?.trigger()
 )
 await loadRelatedTableMeta()
 </script>

packages/nc-gui-v2/components/virtual-cell/HasMany.vue

@@ -4,13 +4,14 @@ import ItemChip from './components/ItemChip.vue'
 import ListChildItems from './components/ListChildItems.vue'
 import ListItems from './components/ListItems.vue'
 import { useProvideLTARStore } from '~/composables'
-import { ColumnInj, RowInj, ValueInj } from '~/context'
+import { ColumnInj, ReloadViewDataHookInj, RowInj, ValueInj } from '~/context'
 import MdiExpandIcon from '~icons/mdi/arrow-expand'
 import MdiPlusIcon from '~icons/mdi/plus'
 
 const column = inject(ColumnInj)
 const value = inject(ValueInj)
 const row = inject(RowInj)
+const reloadTrigger = inject(ReloadViewDataHookInj)
 
 const listItemsDlg = ref(false)
 const childListDlg = ref(false)
@@ -18,6 +19,7 @@ const childListDlg = ref(false)
 const { relatedTableMeta, loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
   column as Required<ColumnType>,
   row,
+  () => reloadTrigger?.trigger()
 )
 await loadRelatedTableMeta()
 </script>

packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue

@@ -4,13 +4,14 @@ import ItemChip from './components/ItemChip.vue'
 import ListChildItems from './components/ListChildItems.vue'
 import ListItems from './components/ListItems.vue'
 import { useProvideLTARStore } from '~/composables'
-import { ColumnInj, RowInj, ValueInj } from '~/context'
+import { ColumnInj, ReloadViewDataHookInj, RowInj, ValueInj } from '~/context'
 import MdiExpandIcon from '~icons/mdi/arrow-expand'
 import MdiPlusIcon from '~icons/mdi/plus'
 
 const column = inject(ColumnInj)
 const row = inject(RowInj)
 const value = inject(ValueInj)
+const reloadTrigger = inject(ReloadViewDataHookInj)
 
 const listItemsDlg = ref(false)
 const childListDlg = ref(false)
@@ -18,6 +19,7 @@ const childListDlg = ref(false)
 const { relatedTableMeta, loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
   column as Required<ColumnType>,
   row,
+  () => reloadTrigger?.trigger()
 )
 
 await loadRelatedTableMeta()

packages/nc-gui-v2/composables/useLTARStore.ts

@@ -11,7 +11,7 @@ interface DataApiResponse {
   pageInfo: PaginatedType
 }
 
-const [useProvideLTARStore, useLTARStore] = useInjectionState((column: Required<ColumnType>, row?: Ref<Row>) => {
+const [useProvideLTARStore, useLTARStore] = useInjectionState((column: Required<ColumnType>, row?: Ref<Row>, reloadData = () => {}) => {
   // state
   const { metas, getMeta } = useMetas()
   const { project } = useProject()
@@ -124,6 +124,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState((column: Required<
       getRelatedTableRowId(row) as string,
     )
 
+    reloadData?.()
     // todo: reload table data and children list
     // this.$emit('loadTableData');
     // if (this.isForm && this.$refs.childList) {
@@ -164,6 +165,8 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState((column: Required<
     // if (this.isForm && this.$refs.childList) {
     //   this.$refs.childList.loadData();
     // }
+
+    reloadData?.()
   }
 
   // watchers