All the issues are fixed reported in #7884

* Show the icon for the 'Reset' button. (Reference #7884) * Reload the server list after connecting to a server in the 'New connection' dialog (QueryTool). (Reference: #7884) * Pass the grid path during the bulk update (click on a radio action) * Don't assign the cell value to the 'rowValue' variable.
pgadmin-org · Sep 11, 2024 · e21911b · e21911b
1 parent d3d1eb3
commit e21911b
Show file tree

Hide file tree

Showing 4 changed files with 96 additions and 65 deletions.
diff --git a/web/pgadmin/static/js/SchemaView/DataGridView/mappedCell.jsx b/web/pgadmin/static/js/SchemaView/DataGridView/mappedCell.jsx
@@ -27,7 +27,7 @@ export function getMappedCell({field}) {
 
     const [key, setKey] = useState(0);
     const schemaState = useContext(SchemaStateContext);
-    const { dataDispatch } = useContext(DataGridContext);
+    const { dataDispatch, accessPath } = useContext(DataGridContext);
     const { rowAccessPath, row } = useContext(DataGridRowContext);
     const colAccessPath = schemaState.accessPath(rowAccessPath, field.id);
 
@@ -44,7 +44,6 @@ export function getMappedCell({field}) {
       colOptions = { disabled: true, readonly: true };
     } else {
       colOptions['readonly'] = !colOptions['editable'];
-      rowValue = value;
     }
 
     let cellProps = {};
@@ -70,7 +69,7 @@ export function getMappedCell({field}) {
         if(field.radioType) {
           dataDispatch({
             type: SCHEMA_STATE_ACTIONS.BULK_UPDATE,
-            path: rowAccessPath,
+            path: accessPath,
             value: changeValue,
             id: field.id
           });

diff --git a/web/pgadmin/static/js/SchemaView/ResetButton.jsx b/web/pgadmin/static/js/SchemaView/ResetButton.jsx
@@ -13,7 +13,7 @@ import { DefaultButton } from 'sources/components/Buttons';
 import { SchemaStateContext } from './SchemaState';
 
 
-export function ResetButton({label, Icon, onClick}) {
+export function ResetButton({label, icon, onClick}) {
   const [key, setKey] = useState(0);
   const schemaState = useContext(SchemaStateContext);
   const checkDisabled = (state) => (state.isSaving || !state.isDirty);
@@ -33,7 +33,7 @@ export function ResetButton({label, Icon, onClick}) {
   return (
     <DefaultButton
       data-test='Reset' onClick={onClick}
-      startIcon={Icon}
+      startIcon={icon}
       disabled={isDisabled}
       className='Dialog-buttonMargin'>
       { label }

diff --git a/web/pgadmin/static/js/SchemaView/base_schema.ui.js b/web/pgadmin/static/js/SchemaView/base_schema.ui.js
@@ -27,6 +27,7 @@ export default class BaseUISchema {
 
     this._state = null;
     this._id = Date.now();
+    this._dynamicFields = false;
   }
 
   /* Top schema is helpful if this is used as child */
@@ -96,9 +97,8 @@ export default class BaseUISchema {
   */
   get fields() {
     if (!this.__filteredFields) {
-      // Memoize the results
-      this.__filteredFields = memoizeFn(
-        (baseFields, keys, filterGroups) =>  baseFields.filter((field) => {
+      const getFields = (baseFields, keys, filterGroups) => baseFields.filter(
+        (field) => {
           let retval;
 
           // If any groups are to be filtered.
@@ -110,8 +110,12 @@ export default class BaseUISchema {
           }
 
           return retval;
-        })
+        }
       );
+
+      // Memoize the results (if required)
+      this.__filteredFields =
+        this._dynamicFields ? getFields : memoizeFn(getFields);
     }
 
     return this.__filteredFields(

diff --git a/web/pgadmin/tools/sqleditor/static/js/components/dialogs/NewConnectionDialog.jsx b/web/pgadmin/tools/sqleditor/static/js/components/dialogs/NewConnectionDialog.jsx
@@ -18,7 +18,10 @@ class NewConnectionSchema extends BaseUISchema {
       role: null,
       server_name: null,
       database_name: null,
+      connected: false,
     });
+    // Regenerate the fields on every render.
+    this._dynamicFields = true;
     this.flatServers = [];
     this.groupedServers = [];
     this.dbs = [];
@@ -41,7 +44,7 @@ class NewConnectionSchema extends BaseUISchema {
   }
 
   isServerConnected(sid) {
-    return _.find(this.flatServers, (s)=>s.value==sid)?.connected;
+    return _.find(this.flatServers, (s) => s.value == sid)?.connected;
   }
 
   getServerList() {
@@ -106,16 +109,21 @@ class NewConnectionSchema extends BaseUISchema {
     let self = this;
     return [
       {
-        id: 'sid', label: gettext('Server'), type: 'select', noEmpty: true,
-        controlProps: {
-          allowClear: false,
-        }, options: ()=>this.getServerList(),
-        optionsLoaded: (res)=>this.flatServers=flattenSelectOptions(res),
-        optionsReloadBasis: this.flatServers.map((s)=>s.connected).join(''),
+        id: 'sid', label: gettext('Server'), deps: ['connected'],
+        noEmpty: true,
+        controlProps: { allowClear: false },
+        type: () => ({
+          type: 'select',
+          options: () => self.getServerList(),
+          optionsLoaded: (res) => self.flatServers = flattenSelectOptions(res),
+          optionsReloadBasis: self.flatServers.map((s) => s.connected).join(''),
+        }),
         depChange: (state)=>{
           /* Once the option is selected get the name */
           /* Force sid to null, and set only if connected */
-          let selectedServer = _.find(this.flatServers, (s)=>s.value==state.sid);
+          let selectedServer = _.find(
+            self.flatServers, (s) => s.value == state.sid
+          );
           return {
             server_name: selectedServer?.label,
             did: null,
@@ -124,62 +132,74 @@ class NewConnectionSchema extends BaseUISchema {
             sid: null,
             fgcolor: selectedServer?.fgcolor,
             bgcolor: selectedServer?.bgcolor,
+            connected: selectedServer?.connected,
           };
         },
-        deferredDepChange: (state, source, topState, actionObj)=>{
-          return new Promise((resolve)=>{
+        deferredDepChange: (state, source, topState, actionObj) => {
+          return new Promise((resolve) => {
             let sid = actionObj.value;
-            if(!_.find(this.flatServers, (s)=>s.value==sid)?.connected) {
-              this.connectServer(sid, state.user, null, (data)=>{
+            if(!_.find(self.flatServers, (s) => s.value == sid)?.connected) {
+              this.connectServer(sid, state.user, null, (data) => {
                 self.setServerConnected(sid, data.icon);
-                resolve(()=>({sid: sid}));
+                resolve(() => ({ sid: sid, connected: true }));
               });
             } else {
-              resolve(()=>({sid: sid}));
+              resolve(()=>({ sid: sid, connected: true }));
             }
           });
         },
       }, {
-        id: 'did', label: gettext('Database'), deps: ['sid'], noEmpty: true,
+        id: 'did', label: gettext('Database'), deps: ['sid', 'connected'],
+        noEmpty: true,
         controlProps: {
           allowClear: false,
         },
-        type: (state)=>({
-          type: 'select',
-          options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_database'),
-          optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
-        }),
-        optionsLoaded: (res)=>this.dbs=res,
-        depChange: (state)=>{
+        type: (state) => {
+          return {
+            type: 'select',
+            options: () => this.getOtherOptions(
+              state.sid, 'get_new_connection_database'
+            ),
+            optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
+          };
+        },
+        optionsLoaded: (res) => this.dbs = res,
+        depChange: (state) => {
           /* Once the option is selected get the name */
-          return {database_name: _.find(this.dbs, (s)=>s.value==state.did)?.label};
+          return {
+            database_name: _.find(this.dbs, (s) => s.value == state.did)?.label
+          };
         }
-      },{
-        id: 'user', label: gettext('User'), deps: ['sid'], noEmpty: true,
-        controlProps: {
-          allowClear: false,
-        },
-        type: (state)=>({
+      }, {
+        id: 'user', label: gettext('User'), deps: ['sid', 'connected'],
+        noEmpty: true, controlProps: { allowClear: false },
+        type: (state) => ({
           type: 'select',
-          options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_user'),
+          options: () => this.getOtherOptions(
+            state.sid, 'get_new_connection_user'
+          ),
           optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
         }),
-      },{
-        id: 'role', label: gettext('Role'), deps: ['sid'],
+      }, {
+        id: 'role', label: gettext('Role'), deps: ['sid', 'connected'],
         type: (state)=>({
           type: 'select',
-          options: ()=>this.getOtherOptions(state.sid, 'get_new_connection_role'),
+          options: () => this.getOtherOptions(
+            state.sid, 'get_new_connection_role'
+          ),
           optionsReloadBasis: `${state.sid} ${this.isServerConnected(state.sid)}`,
         }),
-      },{
+      }, {
         id: 'server_name', label: '', type: 'text', visible: false,
-      },{
+      }, {
         id: 'database_name', label: '', type: 'text', visible: false,
-      },{
+      }, {
         id: 'bgcolor', label: '', type: 'text', visible: false,
-      },{
+      }, {
         id: 'fgcolor', label: '', type: 'text', visible: false,
-      },
+      }, {
+        id: 'connected', label: '', type: 'text', visible: false,
+      }
     ];
   }
 }
@@ -189,7 +209,6 @@ export default function NewConnectionDialog({onClose, onSave}) {
 
   const [connecting, setConnecting] = useState(false);
   const queryToolCtx = React.useContext(QueryToolContext);
-
   const connectServer = async (sid, user, formData, connectCallback) => {
     setConnecting(true);
     try {
@@ -223,25 +242,34 @@ export default function NewConnectionDialog({onClose, onSave}) {
       });
     }
   };
+  const schema = React.useRef(null);
 
-  return <SchemaView
-    formType={'dialog'}
-    getInitData={()=>Promise.resolve({})}
-    schema={new NewConnectionSchema(queryToolCtx.api, {
+  if (!schema.current)
+    schema.current = new NewConnectionSchema(queryToolCtx.api, {
       sid: queryToolCtx.params.sid, sgid: 0,
-    }, connectServer)}
-    viewHelperProps={{
-      mode: 'create',
-    }}
-    loadingText={connecting ? 'Connecting...' : ''}
-    onSave={onSave}
-    onClose={onClose}
-    hasSQL={false}
-    disableSqlHelp={true}
-    disableDialogHelp={true}
-    isTabView={false}
-    Notifier={queryToolCtx.modal}
-  />;
+    }, connectServer);
+
+  return <>
+    {
+      schema.current &&
+        <SchemaView
+          formType={'dialog'}
+          getInitData={()=>Promise.resolve({})}
+          schema={schema.current}
+          viewHelperProps={{
+            mode: 'create',
+          }}
+          loadingText={connecting ? 'Connecting...' : ''}
+          onSave={onSave}
+          onClose={onClose}
+          hasSQL={false}
+          disableSqlHelp={true}
+          disableDialogHelp={true}
+          isTabView={false}
+          Notifier={queryToolCtx.modal}
+        />
+    }
+  </>;
 }
 
 NewConnectionDialog.propTypes = {