table child config refacvtor

packages/datalib/src/GridConfig.ts

@@ -27,6 +27,8 @@ export interface GridConfig extends GridConfigColumns {
     order: 'ASC' | 'DESC';
   }[];
   grouping: { [uniqueName: string]: GroupFunc };
+  childConfig?: GridConfig;
+  reference?: GridReferenceDefinition;
 }
 
 export interface GridCache {

packages/web/src/datagrid/TableDataGrid.js

@@ -43,15 +43,32 @@ export default function TableDataGrid({
   masterLoadedTime = undefined,
 }) {
   const [myConfig, setMyConfig] = React.useState(createGridConfig());
-  const [childConfig, setChildConfig] = React.useState(createGridConfig());
+  // const [childConfig, setChildConfig] = React.useState(createGridConfig());
   const [myCache, setMyCache] = React.useState(createGridCache());
   const [childCache, setChildCache] = React.useState(createGridCache());
   const [refReloadToken, setRefReloadToken] = React.useState(0);
   const [myLoadedTime, setMyLoadedTime] = React.useState(0);
 
+  const { childConfig } = config || myConfig;
+  const setChildConfig = (value, reference = undefined) => {
+    if (_.isFunction(value)) {
+      (setConfig || setMyConfig)((x) => ({
+        ...x,
+        childConfig: value(x.childConfig),
+      }));
+    } else {
+      (setConfig || setMyConfig)((x) => ({
+        ...x,
+        childConfig: value,
+        reference: reference === undefined ? x.reference : reference,
+      }));
+    }
+  };
+  const { reference } = config || myConfig;
+
   const connection = useConnectionInfo({ conid });
   const dbinfo = useDatabaseInfo({ conid, database });
-  const [reference, setReference] = React.useState(null);
+  // const [reference, setReference] = React.useState(null);
 
   function createDisplay() {
     return connection
@@ -125,7 +142,7 @@ export default function TableDataGrid({
   );
 
   const handleCloseReference = () => {
-    setReference(null);
+    setChildConfig(null, null);
   };
 
   if (!display) return null;
@@ -142,7 +159,7 @@ export default function TableDataGrid({
         dispatchChangeSet={dispatchChangeSet}
         toolbarPortalRef={toolbarPortalRef}
         showReferences
-        onReferenceClick={setReference}
+        onReferenceClick={(reference) => setChildConfig(createGridConfig(), reference)}
         onReferenceSourceChanged={reference ? handleReferenceSourceChanged : null}
         refReloadToken={refReloadToken.toString()}
         masterLoadedTime={masterLoadedTime}

packages/web/src/tabs/TableDataTab.js

@@ -1,17 +1,19 @@
 import React from 'react';
-import { createGridCache, createChangeSet } from '@dbgate/datalib';
+import { createGridCache, createChangeSet, createGridConfig } from '@dbgate/datalib';
 import useUndoReducer from '../utility/useUndoReducer';
 import usePropsCompare from '../utility/usePropsCompare';
 import { useUpdateDatabaseForTab } from '../utility/globalState';
 import TableDataGrid from '../datagrid/TableDataGrid';
 
-export default function TableDataTab({ conid, database, schemaName, pureName, tabVisible, toolbarPortalRef }) {
+export default function TableDataTab({ conid, database, schemaName, pureName, tabVisible, toolbarPortalRef, tabid }) {
   const [changeSetState, dispatchChangeSet] = useUndoReducer(createChangeSet());
   useUpdateDatabaseForTab(tabVisible, conid, database);
+  // const [config, setConfig] = React.useState(createGridConfig());
 
   return (
     <TableDataGrid
       conid={conid}
+      // config={config}
       database={database}
       schemaName={schemaName}
       pureName={pureName}