console: show error notification for table and cloumn names exceeding 63 characters and trim migration names exceeding 255 characters

GITHUB_PR_NUMBER: 5785
GITHUB_PR_URL: https://github.com/hasura/graphql-engine/pull/5785

Co-authored-by: Abhijeet Khangarot <26903230+abhi40308@users.noreply.github.com>
GitOrigin-RevId: b12a729cfb708ff0622805f247473cb16b44ae0a

CHANGELOG.md

@@ -12,6 +12,7 @@
 - console: update connect database form with SSL certificates
 - console: add drop table functionality to MS SQL Server tables
 - console: allow renaming data sources
+- console: show error notification for table and cloumn names exceeding 63 characters and trim migration names exceeding 255 characters
 - cli: fix version command using stderr as output stream (#6998)
 
 ## v2.0.0-alpha.11

console/src/components/Services/Data/Add/AddTable.js

@@ -45,6 +45,8 @@ import {
   tableColumnTypesNotif,
   tableColumnDefaultsNotif,
   tableMinPrimaryKeyNotif,
+  tableNameMaxLengthNotif,
+  tableColumnMaxLengthNotif,
 } from './AddWarning';
 
 import styles from '../../../Common/TableCommon/Table.scss';
@@ -56,6 +58,7 @@ import {
   checkConstraintsDescription,
 } from '../Common/TooltipMessages';
 import { isFeatureSupported } from '../../../../dataSources';
+import { maxAllowedColumnLength } from '../constants';
 
 /* AddTable is a wrapper which wraps
  *  1) Table Name input
@@ -205,6 +208,14 @@ class AddTable extends Component {
     }
   }
 
+  isValidLength(s) {
+    return s.length < maxAllowedColumnLength;
+  }
+
+  validateTableNameLength(name) {
+    return this.isValidLength(name);
+  }
+
   tableNameEmptyCheck(name) {
     return name !== null;
   }
@@ -296,6 +307,16 @@ class AddTable extends Component {
     return '';
   }
 
+  validateColumnNameLengths(cols) {
+    const l = cols.length;
+    for (let i = 0; i < l; i++) {
+      if (!this.isValidLength(cols[i].name)) {
+        return false;
+      }
+    }
+    return '';
+  }
+
   validateNoDupNames(cols) {
     const l = cols.length;
     const names = [];
@@ -397,6 +418,10 @@ class AddTable extends Component {
         this.tableNameCheck(tableNameTrimmed),
         gqlTableErrorNotif
       ) &&
+      this.checkAndNotify(
+        this.validateTableNameLength(tableNameTrimmed),
+        tableNameMaxLengthNotif
+      ) &&
       this.checkAndNotify(
         this.validateEnoughColumns(trimmedColumns),
         tableEnufColumnsNotif
@@ -405,6 +430,10 @@ class AddTable extends Component {
         this.validateColumnNames(trimmedColumns),
         gqlColumnErrorNotif
       ) &&
+      this.checkAndNotify(
+        this.validateColumnNameLengths(trimmedColumns),
+        tableColumnMaxLengthNotif
+      ) &&
       this.checkAndNotify(
         this.validateNoDupNames(trimmedColumns),
         tableColumnNoDupsNotif

console/src/components/Services/Data/Add/AddWarning.js

@@ -22,6 +22,14 @@ const tableNameNullNotif = [
   },
 ];
 
+const tableNameMaxLengthNotif = [
+  'Error creating table!',
+  'Table name should be less than 64 characters',
+  {
+    custom: 'Table name should be less than 64 characters',
+  },
+];
+
 const tableEnufColumnsNotif = [
   'Error creating table!',
   'Table must have at least one column',
@@ -38,6 +46,14 @@ const tableColumnDefaultsNotif = [
   },
 ];
 
+const tableColumnMaxLengthNotif = [
+  'Error creating table!',
+  'Column names should be less than 64 characters',
+  {
+    custom: 'Column names should be less than 64 characters',
+  },
+];
+
 const tableColumnTypesNotif = [
   'Error creating table!',
   'Column type is invalid',
@@ -53,4 +69,6 @@ export {
   tableMinPrimaryKeyNotif,
   tableColumnDefaultsNotif,
   tableColumnTypesNotif,
+  tableColumnMaxLengthNotif,
+  tableNameMaxLengthNotif,
 };

console/src/components/Services/Data/DataActions.js

@@ -33,7 +33,11 @@ import {
 } from './mergeData';
 import _push from './push';
 import { convertArrayToJson } from './TableModify/utils';
-import { CLI_CONSOLE_MODE, SERVER_CONSOLE_MODE } from '../../../constants';
+import {
+  CLI_CONSOLE_MODE,
+  SERVER_CONSOLE_MODE,
+  maxAllowedMigrationLength,
+} from '../../../constants';
 import { getDownQueryComments } from '../../../utils/migration/utils';
 import { isEmpty } from '../../Common/utils/jsUtils';
 import { currentDriver, dataSource } from '../../../dataSources';
@@ -750,8 +754,13 @@ const makeMigrationCall = (
     downQueries = getDownQueryComments(upQueries);
   }
 
+  const trimmedMigrationName = migrationName.substring(
+    0,
+    maxAllowedMigrationLength
+  );
+
   const migrationBody = {
-    name: sanitize(migrationName),
+    name: sanitize(trimmedMigrationName),
     up: upQuery.args,
     down: downQueries || [],
     datasource: source,

console/src/components/Services/Data/constants.js

@@ -61,6 +61,12 @@ export const Integers = [
 
 export const COUNT_LIMIT = 100000;
 
+export const maxAllowedColumnLength = 64;
+
+const maxAllowedLength = 255;
+const unixEpochLength = 14;
+export const maxAllowedMigrationLength = maxAllowedLength - unixEpochLength;
+
 export const Reals = ['float4', 'float8', 'numeric'];
 
 export const Numerics = [...Integers, ...Reals];