Sync include columns with column name changes.#7617

Author: RohitBhati8269

web/pgadmin/browser/server_groups/servers/databases/schemas/tables/columns/static/js/column.ui.js

@@ -60,6 +60,7 @@ export default class ColumnSchema extends BaseUISchema {
       seqcycle: undefined,
       colconstype: 'n',
       genexpr: undefined,
+      isInclude: false
     });
 
     this.getPrivilegeRoleSchema = getPrivilegeRoleSchema;
@@ -382,7 +383,12 @@ export default class ColumnSchema extends BaseUISchema {
       id: 'attstattarget', label: gettext('Statistics'), cell: 'text',
       type: 'text', readonly: obj.inSchemaWithColumnCheck, mode: ['properties', 'edit'],
       group: gettext('Definition'),
-    },{
+    },
+    {
+      // Use to check include columns.
+      id: 'isInclude', label: gettext(''), type: 'boolean', visible: false
+    },
+    {
       id: 'attstorage', label: gettext('Storage'), group: gettext('Definition'),
       type: 'select', mode: ['properties', 'edit', 'create'],
       cell: 'select', readonly: obj.inSchemaWithColumnCheck,

web/pgadmin/browser/server_groups/servers/databases/schemas/tables/static/js/table.ui.js

@@ -129,6 +129,33 @@ export class ConstraintsSchema extends BaseUISchema {
           return {primary_key: []};
         }
         /* If columns changed */
+        if (actionObj.type === SCHEMA_STATE_ACTIONS.SET_VALUE && actionObj.path.at(-1) === 'name') {
+          const primaryKey = state.primary_key[0] || {};
+          /* Extract primary key columns and included columns in a single pass through state columns.*/
+          const { primaryKeyColumns, includeColumns } = state.columns.reduce((acc, column) => {
+            if (column.is_primary_key) acc.primaryKeyColumns.push({ column: column.name });
+            if (column.isInclude) acc.includeColumns.push(column.name);
+            return acc;
+          }, { primaryKeyColumns: [], includeColumns: [] });
+          /* Check if updates are needed. */
+          const needsPrimaryKeyUpdate = JSON.stringify(primaryKeyColumns) !== JSON.stringify(primaryKey.columns || []);
+          const needsIncludeUpdate = includeColumns.length > 0;
+          /* Only update state if columns updated. */
+          if (needsPrimaryKeyUpdate || needsIncludeUpdate) {
+            primaryKey.columns = needsPrimaryKeyUpdate ? primaryKeyColumns : primaryKey.columns;
+            primaryKey.include = needsIncludeUpdate ? includeColumns : primaryKey.include;
+            return state;
+          }
+        }
+        /* Update include columns. */
+        if(actionObj.type == SCHEMA_STATE_ACTIONS.SET_VALUE && actionObj.path[actionObj.path.length - 1] === 'include'){
+          let include = state.primary_key[0].include;
+          state.columns = state.columns.map((c)=>({          
+            ...c, isInclude: include.indexOf(c.name) > -1,
+          }));
+          return {columns: state.columns};
+        }
+
         if(actionObj.type == SCHEMA_STATE_ACTIONS.SET_VALUE && actionObj.path[actionObj.path.length-1] == 'columns') {
           /* Sync up the pk flag */
           let columns = state.primary_key[0].columns.map((c)=>c.column);

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

@@ -36,11 +36,6 @@ export function DataGridHeader({tableEleRef}) {
   const schemaState = useContext(SchemaStateContext);
 
   const onAddClick = useCallback(() => {
-
-    if(!canAddRow) {
-      return;
-    }
-
     const newRow = field.schema.getNewData();
 
     newRowIndex.current = addOnTop ? 0 : rows.length;
@@ -91,6 +86,7 @@ export function DataGridHeader({tableEleRef}) {
         <PgIconButton data-test="add-row" title={gettext('Add row')}
           onClick={onAddClick}
           icon={<AddIcon />} className='DataGridView-gridControlsButton'
+          disabled={!canAddRow}
         />
         }
       </Box>