Fixed following issues after React Porting:

1. Unique constraint should not allow changing values for deferrable, deferred, included columns.
2. Primary keys should not allow changing values for deferrable, deferred, included columns.
3. Foreign keys should not allow changing match type. The referenced table name is empty.
4. Exclude - Column/Expression has incorrect values.
5. Save should not be enabled when Custom auto-vacuum is enabled but none of the parameters are edited.

Fixes #6777

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

@@ -134,7 +134,7 @@ function DataTableHeader({headerGroups}) {
                     : ''}
                 </span>
               </div>
-              {column.resizable &&
+              {!column.disableResizing &&
                 <div
                   {...column.getResizerProps()}
                   className={classes.resizer}
@@ -328,16 +328,26 @@ export default function DataGridView({
           }
           return 0;
         }).map((field)=>{
+          let widthParms = {};
+          if(field.width) {
+            widthParms.width = field.width;
+            widthParms.minWidth = field.width;
+          }
+          if(field.minWidth) {
+            widthParms.minWidth = field.minWidth;
+          }
+          if(field.maxWidth) {
+            widthParms.maxWidth = field.maxWidth;
+          }
+          widthParms.disableResizing = Boolean(field.disableResizing);
+
           let colInfo = {
             Header: field.label||<>&nbsp;</>,
             accessor: field.id,
             field: field,
-            resizable: true,
+            disableResizing: false,
             sortable: true,
-            ...(field.minWidth ?  {minWidth: field.minWidth} : {}),
-            ...(field.width ?  {width: field.width} : {}),
-            ...(field.maxWidth ?  {maxWidth: field.maxWidth} : {}),
-            ...(field.disableResizing ?  {disableResizing: field.disableResizing} : {}),
+            ...widthParms,
             Cell: ({value, row, ...other}) => {
               /* Make sure to take the latest field info from schema */
               field = _.find(schemaRef.current.fields, (f)=>f.id==field.id) || field;

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

@@ -125,11 +125,11 @@ export function getFieldMetaData(field, schema, value, viewHelperProps, onlyMode
 
   let {canAdd, canEdit, canDelete, canAddRow } = field;
   retData.canAdd = _.isUndefined(canAdd) ? retData.canAdd : evalFunc(schema, canAdd, value);
-  retData.canAdd = !disabled && retData.canAdd;
+  retData.canAdd = !retData.disabled && retData.canAdd;
   retData.canEdit = _.isUndefined(canEdit) ? retData.canEdit : evalFunc(schema, canEdit, value);
-  retData.canEdit = !disabled && retData.canEdit;
+  retData.canEdit = !retData.disabled && retData.canEdit;
   retData.canDelete = _.isUndefined(canDelete) ? retData.canDelete : evalFunc(schema, canDelete, value);
-  retData.canDelete = !disabled && retData.canDelete;
+  retData.canDelete = !retData.disabled && retData.canDelete;
   retData.canAddRow = _.isUndefined(canAddRow) ? retData.canAddRow : evalFunc(schema, canAddRow, value);
   return retData;
 }

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

@@ -138,7 +138,10 @@ function getChangedData(topSchema, viewHelperProps, sessData, stringify=false) {
       /* At this point the schema assignments like top may not have been done
       So, only check the mode by passing true to getFieldMetaData */
       let {modeSupported} = getFieldMetaData(field, schema, {}, viewHelperProps, true);
-      if(!modeSupported) {
+
+      /* If skipChange is true, then field will not be considered for changed data,
+      No change in other behaviour */
+      if(!modeSupported || field.skipChange) {
         return;
       }
       if(typeof(field.type) == 'string' && field.type.startsWith('nested-')) {

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

@@ -511,7 +511,7 @@ export function InputToggle({cid, value, onChange, options, disabled, readonly,
       {
         (options||[]).map((option)=>{
           const isSelected = option.value === value;
-          const isDisabled = disabled || option.disabled || (readonly && isSelected);
+          const isDisabled = disabled || option.disabled || (readonly && !isSelected);
           return (
             <ToggleButton key={option.label} value={option.value} component={isSelected ? PrimaryButton : DefaultButton}
               disabled={isDisabled} aria-label={option.label}>