Some changes to the core code that will be helpful for other nodes.

web/pgadmin/browser/server_groups/servers/databases/static/js/database.ui.js

@@ -17,7 +17,7 @@ export class DefaultPrivSchema extends BaseUISchema {
     this.getPrivilegeRoleSchema = getPrivilegeRoleSchema;
   }
 
-  get fields() {
+  get baseFields() {
     return [
       {
         id: 'deftblacl', type: 'collection', group: gettext('Tables'),
@@ -89,7 +89,7 @@ export default class DatabaseSchema extends BaseUISchema {
     return 'did';
   }
 
-  get fields() {
+  get baseFields() {
     let obj = this;
     return [
       {

web/pgadmin/browser/static/js/node_view.jsx

@@ -171,12 +171,18 @@ export function getNodeView(nodeType, treeNodeInfo, actionType, itemNodeData, fo
     inCatalog: inCatalog,
   };
 
+  let schema = nodeObj.getSchema.call(nodeObj, treeNodeInfo, itemNodeData);
+  // Show/Hide security group for nodes under the catalog
+  if('catalog' in treeNodeInfo) {
+    schema.filterGroups = [gettext('Security')];
+  }
+
   /* Fire at will, mount the DOM */
   ReactDOM.render(
     <SchemaView
       formType={formType}
       getInitData={initData}
-      schema={nodeObj.getSchema.call(nodeObj, treeNodeInfo, itemNodeData)}
+      schema={schema}
       viewHelperProps={viewHelperProps}
       onSave={onSaveClick}
       onClose={()=>containerPanel.close()}

web/pgadmin/static/js/SchemaView/DataGridView.jsx

@@ -257,16 +257,16 @@ export default function DataGridView({
                     (viewHelperProps.serverInfo.version <= field.max_version))));
                 let _readonly = viewHelperProps.inCatalog || (viewHelperProps.mode == 'properties');
                 if(!_readonly) {
-                  _readonly = evalFunc(readonly, row.original || {});
+                  _readonly = evalFunc(schema, readonly, row.original || {});
                 }
 
                 let _visible = true;
                 if(visible) {
-                  _visible = evalFunc(visible, row.original || {});
+                  _visible = evalFunc(schema, visible, row.original || {});
                 }
                 _visible = _visible && verInLimit;
 
-                disabled = evalFunc(disabled, row.original || {});
+                disabled = evalFunc(schema, disabled, row.original || {});
 
                 return <MappedCellControl rowIndex={row.index} value={value}
                   row={row.original} {..._field}

web/pgadmin/static/js/SchemaView/FormView.jsx

@@ -105,17 +105,17 @@ export default function FormView({
 
       let _readonly = viewHelperProps.inCatalog || (viewHelperProps.mode == 'properties');
       if(!_readonly) {
-        _readonly = evalFunc(readonly, value);
+        _readonly = evalFunc(schema, readonly, value);
       }
 
       let _visible = true;
 
       if(visible) {
-        _visible = evalFunc(visible, value);
+        _visible = evalFunc(schema, visible, value);
       }
       _visible = _visible && verInLimit;
 
-      disabled = evalFunc(disabled, value);
+      disabled = evalFunc(schema, disabled, value);
 
 
       if(!tabs[group]) tabs[group] = [];
@@ -151,6 +151,7 @@ export default function FormView({
                 firstEleRef.current = ele;
               }
             }}
+            state={value}
             key={field.id}
             viewHelperProps={viewHelperProps}
             name={field.id}

web/pgadmin/static/js/SchemaView/MappedControl.jsx

@@ -158,7 +158,7 @@ const ALLOWED_PROPS_FIELD_COMMON = [
 ];
 
 const ALLOWED_PROPS_FIELD_FORM = [
-  'type', 'onChange'
+  'type', 'onChange', 'state',
 ];
 
 const ALLOWED_PROPS_FIELD_CELL = [
@@ -168,7 +168,7 @@ const ALLOWED_PROPS_FIELD_CELL = [
 
 export const MappedFormControl = (props)=>{
   let newProps = {...props};
-  let typeProps = evalFunc(newProps.type, newProps.value);
+  let typeProps = evalFunc(null, newProps.type, newProps.state);
   if(typeof(typeProps) === 'object') {
     newProps = {
       ...newProps,
@@ -184,7 +184,7 @@ export const MappedFormControl = (props)=>{
 
 export const MappedCellControl = (props)=>{
   let newProps = {...props};
-  let cellProps = evalFunc(newProps.cell, newProps.row);
+  let cellProps = evalFunc(null, newProps.cell, newProps.row);
   if(typeof(cellProps) === 'object') {
     newProps = {
       ...newProps,

web/pgadmin/static/js/SchemaView/base_schema.ui.js

@@ -17,6 +17,7 @@ export default class BaseUISchema {
     this._defaults = defaults;
 
     this.keys = null; // If set, other fields except keys will be filtered
+    this.filterGroups = []; // If set, these groups will be filtered out
     this.informText = null; // Inform text to show after save, this only saves it
     this._top = null;
   }
@@ -59,13 +60,26 @@ export default class BaseUISchema {
   concat base fields with extraFields.
   */
   get fields() {
-    /* Select only keys if specified */
     return this.baseFields
-      .filter((field)=>this.keys ? this.keys.indexOf(field.id) > -1 : true);
+      .filter((field)=>{
+        let retval;
+
+        /* If any groups are to be filtered */
+        retval = this.filterGroups.indexOf(field.group) == -1;
+
+        /* Select only keys, if specified */
+        if(this.keys) {
+          retval = retval && this.keys.indexOf(field.id) > -1;
+        }
+        return retval;
+      });
   }
 
   /* Check if current data is new or existing */
   isNew(state) {
+    if(_.isUndefined(state)) {
+      state = this.origData;
+    }
     if(_.has(state, this.idAttribute)) {
       return _.isUndefined(state[this.idAttribute])
         || _.isNull(state[this.idAttribute]);

web/pgadmin/static/js/SchemaView/index.jsx

@@ -85,7 +85,10 @@ function getChangedData(topSchema, mode, sessData, stringify=false) {
       return;
     } else {
       change = change || _.get(sessData, currPath);
-      _.set(changedData, currPath, stringify ? JSON.stringify(change) : change);
+      if(stringify && (_.isArray(change) || _.isObject(change))) {
+        change = JSON.stringify(change);
+      }
+      _.set(changedData, currPath, change);
     }
   };
 
@@ -104,8 +107,8 @@ function getChangedData(topSchema, mode, sessData, stringify=false) {
             /* Use diffArray package to get the array diff and extract the info
             cid is used to identify the rows uniquely */
             const changeDiff = diffArray(
-              _.get(topSchema.origData, currPath),
-              _.get(sessData, currPath),
+              _.get(topSchema.origData, currPath) || [],
+              _.get(sessData, currPath) || [],
               'cid'
             );
             change = {};
@@ -437,7 +440,13 @@ function SchemaDialogView({
     /* Called when SQL tab is active */
     if(dirty) {
       if(!formErr.name) {
-        let changeData = getChangedData(schema, viewHelperProps.mode, sessData, true);
+        let changeData = {};
+        if(viewHelperProps.mode === 'edit') {
+          changeData = getChangedData(schema, viewHelperProps.mode, sessData, true);
+        } else {
+          /* If new then merge the changed data with origData */
+          changeData = _.merge(schema.origData, sessData);
+        }
         /* Call the passed incoming getSQLValue func to get the SQL
         return of getSQLValue should be a promise.
         */
@@ -566,10 +575,10 @@ function SchemaPropertiesView({
       _visible = (field.mode.indexOf(viewHelperProps.mode) > -1);
     }
     if(_visible && visible) {
-      _visible = evalFunc(visible, origData);
+      _visible = evalFunc(schema, visible, origData);
     }
 
-    disabled = evalFunc(disabled, origData);
+    disabled = evalFunc(schema, disabled, origData);
     readonly = true;
     if(_visible && verInLimit) {
       if(!tabs[group]) tabs[group] = [];

web/pgadmin/static/js/Theme/index.jsx

@@ -251,17 +251,17 @@ function getFinalTheme(baseTheme) {
           fontSize: baseTheme.typography.fontSize,
           height: 'unset',
           backgroundColor: baseTheme.palette.background.default,
-          '&[readonly]': {
-            backgroundColor: baseTheme.palette.inputDisabledBg,
-          }
+          '&[readonly], &.Mui-disabled': {
+            backgroundColor: baseTheme.otherVars.inputDisabledBg,
+          },
         },
         input: {
           fontSize: baseTheme.typography.fontSize,
           height: 'unset',
           backgroundColor: baseTheme.palette.background.default,
-          '&[readonly]': {
+          '&[readonly], &.Mui-disabled': {
             backgroundColor: baseTheme.otherVars.inputDisabledBg,
-          }
+          },
         }
       },
       MuiIconButton: {

web/pgadmin/static/js/components/FormComponents.jsx

@@ -563,7 +563,9 @@ export function InputSelect({
     }
   }, [onChange]);
 
-  const realValue = getRealValue(finalOptions, value, controlProps.creatable);
+  /* Apply filter if any */
+  const filteredOptions = (controlProps.filter && controlProps.filter(finalOptions)) || finalOptions;
+  const realValue = getRealValue(filteredOptions, value, controlProps.creatable);
   const otherProps = {
     isSearchable: !readonly,
     isClearable: !readonly && (!_.isUndefined(controlProps.allowClear) ? controlProps.allowClear : true),
@@ -581,7 +583,7 @@ export function InputSelect({
     openMenuOnClick: !readonly,
     onChange: onChangeOption,
     isLoading: isLoading,
-    options: finalOptions,
+    options: filteredOptions,
     value: realValue,
     menuPortalTarget: document.body,
     styles: styles,

web/pgadmin/static/js/utils.js

@@ -437,9 +437,9 @@ export function registerDetachEvent(panel){
   });
 
 /* If a function, then evaluate */
-export function evalFunc(func, param) {
+export function evalFunc(obj, func, param) {
   if(_.isFunction(func)) {
-    return func.apply(null, [param]);
+    return func.apply(obj, [param]);
   }
   return func;
 }