hasura · 0x777 · Mar 1, 2019 · Jul 1, 2018 · Jul 3, 2018 · Jul 3, 2018
@@ -40,6 +40,40 @@ export const passMTCheckRoute = () => {
   );
 };
 
+export const passMTRenameTable = () => {
+  cy.get(getElementFromAlias('heading-edit-table')).click();
+  cy.get(getElementFromAlias('heading-edit-table-input'))
+    .clear()
+    .type(getTableName(3, testName));
+  cy.get(getElementFromAlias('heading-edit-table-save')).click();
+  cy.wait(10000);
+  validateCT(getTableName(3, testName), 'success');
+  cy.get(getElementFromAlias('heading-edit-table')).click();
+  cy.get(getElementFromAlias('heading-edit-table-input'))
+    .clear()
+    .type(getTableName(0, testName));
+  cy.get(getElementFromAlias('heading-edit-table-save')).click();
+  cy.wait(10000);
+  validateCT(getTableName(0, testName), 'success');
+};
+
+export const passMTRenameColumn = () => {
+  cy.get(getElementFromAlias('edit-id')).click();
+  cy.get(getElementFromAlias('edit-col-name'))
+    .clear()
+    .type(getColName(3));
+  cy.get(getElementFromAlias('save-button')).click();
+  cy.wait(2500);
+  validateColumn(getTableName(0, testName), [getColName(3)], 'success');
+  cy.get(getElementFromAlias(`edit-${getColName(3)}`)).click();
+  cy.get(getElementFromAlias('edit-col-name'))
+    .clear()
+    .type('id');
+  cy.get(getElementFromAlias('save-button')).click();
+  cy.wait(2500);
+  validateColumn(getTableName(0, testName), ['id'], 'success');
+};
+
 export const passMTMoveToTable = () => {
   cy.get(getElementFromAlias(getTableName(0, testName))).click();
   cy.url().should(

@@ -14,6 +14,8 @@ import {
   failMCWithWrongDefaultValue,
   passCreateForeignKey,
   passRemoveForeignKey,
+  passMTRenameTable,
+  passMTRenameColumn,
 } from './spec';
 
 import { testMode } from '../../../helpers/common';
@@ -36,6 +38,8 @@ export const runModifyTableTests = () => {
     it('Creating a table', passMTCreateTable);
     it('Moving to the table', passMTMoveToTable);
     it('Modify table button opens the correct route', passMTCheckRoute);
+    it('Pass renaming table', passMTRenameTable);
+    it('Pass renaming column', passMTRenameColumn);
     it('Fails to add column without column name', failMTWithoutColName);
     it('Fails without type selected', failMTWithoutColType);
     it('Add a column', passMTAddColumn);

@@ -9,9 +9,8 @@ import {
 const delRel = (table, relname) => {
   cy.get(getElementFromAlias(table)).click();
   cy.get(getElementFromAlias('table-relationships')).click();
-  cy.get(getElementFromAlias(`remove-button-${relname}`))
-    .first()
-    .click();
+  cy.get(getElementFromAlias(`relationship-toggle-editor-${relname}`)).click();
+  cy.get(getElementFromAlias(`relationship-remove-${relname}`)).click();
   cy.on('window:alert', str => {
     expect(str === 'Are you sure?').to.be.true;
   });
@@ -176,7 +175,7 @@ export const passRTAddSuggestedRel = () => {
     .clear()
     .type('author');
   cy.get(getElementFromAlias('obj-rel-save-0')).click();
-  cy.wait(15000);
+  cy.wait(5000);
   validateColumn(
     'article_table_rt',
     ['title', { name: 'author', columns: ['name'] }],
@@ -189,7 +188,34 @@ export const passRTAddSuggestedRel = () => {
     .clear()
     .type('comments');
   cy.get(getElementFromAlias('arr-rel-save-0')).click();
-  cy.wait(15000);
+  cy.wait(5000);
+  validateColumn(
+    'article_table_rt',
+    ['title', { name: 'comments', columns: ['comment'] }],
+    'success'
+  );
+};
+
+export const passRTRenameRelationship = () => {
+  cy.get(getElementFromAlias('relationship-toggle-editor-comments')).click();
+  cy.get(getElementFromAlias('relationship-name-input-comments'))
+    .clear()
+    .type('comments_renamed');
+  cy.get(getElementFromAlias('relationship-save-comments')).click();
+  cy.wait(5000);
+  validateColumn(
+    'article_table_rt',
+    ['title', { name: 'comments_renamed', columns: ['comment'] }],
+    'success'
+  );
+  cy.get(
+    getElementFromAlias('relationship-toggle-editor-comments_renamed')
+  ).click();
+  cy.get(getElementFromAlias('relationship-name-input-comments_renamed'))
+    .clear()
+    .type('comments');
+  cy.get(getElementFromAlias('relationship-save-comments_renamed')).click();
+  cy.wait(5000);
   validateColumn(
     'article_table_rt',
     ['title', { name: 'comments', columns: ['comment'] }],

@@ -12,6 +12,7 @@ import {
   passRTAddSuggestedRel,
   failRTAddSuggestedRel,
   checkAddManualRelationshipsButton,
+  passRTRenameRelationship,
 } from './spec';
 import { testMode } from '../../../helpers/common';
 import { setMetaData } from '../../validators/validators';
@@ -42,6 +43,7 @@ export const runRelationshipsTests = () => {
     it('Deleting the relationships', passRTDeleteRelationships);
     it('Adding Suggested Relationships Error', failRTAddSuggestedRel);
     it('Adding Suggested Relationships', passRTAddSuggestedRel);
+    it('Rename relationships', passRTRenameRelationship);
     it('Deleting the relationships', passRTDeleteRelationships);
     it('Deleting testing tables', passRTDeleteTables);
   });

@@ -397,10 +397,8 @@ export const passVAddManualObjRel = () => {
 export const passVDeleteRelationships = () => {
   cy.get(getElementFromAlias('author_average_rating_vt')).click();
   cy.get(getElementFromAlias('table-relationships')).click();
-  cy.get('button')
-    .contains('Remove')
-    .first()
-    .click();
+  cy.get(getElementFromAlias('relationship-toggle-editor-author')).click();
+  cy.get(getElementFromAlias('relationship-remove-author')).click();
   cy.on('window:alert', str => {
     expect(str === 'Are you sure?').to.be.true;
   });

@@ -736,7 +736,7 @@ code
 .yellow_button
 {
   background-color: #FEC53D;
-  border-radius: 5px;
+  border-radius: 3px;
   color: #606060;
   border: 1px solid #FEC53D;
   padding: 5px 10px;
@@ -861,7 +861,51 @@ code
 {
   font-size: 18px;
   font-weight: bold;
+  padding-bottom: 20px
+}
+
+.editable_heading_text
+{
+  font-size: 18px;
+  font-weight: bold;
+  display: flex;
+  align-items: center;
   padding-bottom: 20px;
+  h2 {
+    font-size: 18px;
+    font-weight: bold;
+    margin-right: 10px;
+  }
+  i {
+    cursor: pointer;
+  }
+}
+.editable_heading_textbox
+{
+  display: flex;
+  align-items: center;
+  padding-bottom: 12px;
+  input {
+    width: 30%;
+    font-weight: normal;
+  }
+}
+.editable_heading_action
+{
+  margin-left: 10px;
+  display: flex;
+  align-items: center;
+  i {
+    margin-top: 2px;
+  }
+}
+.editable_heading_action_item
+{
+  margin-right: 10px;
+  font-size: 14px;
+  text-decoration: underline;
+  font-weight: normal;
+  cursor: pointer;
 }
 .header_project_name
 {

@@ -0,0 +1,92 @@
+import React from 'react';
+import styles from '../Common.scss';
+
+class Heading extends React.Component {
+  state = {
+    text: this.props.currentValue,
+    isEditting: false,
+  };
+
+  handleTextChange = e => {
+    this.setState({ text: e.target.value });
+  };
+
+  toggleEditting = () => {
+    this.setState({ isEditting: !this.state.isEditting });
+  };
+
+  handleKeyPress = e => {
+    if (this.state.isEditting) {
+      if (e.charCode === 13) {
+        this.save();
+      }
+    }
+  };
+
+  save = () => {
+    if (this.props.loading) {
+      return;
+    }
+    this.props.save(this.state.text);
+  };
+
+  render = () => {
+    const { editable, currentValue, save, loading, property } = this.props;
+
+    const { text, isEditting } = this.state;
+
+    if (!editable) {
+      return <h2 className={styles.heading_text}>{currentValue}</h2>;
+    }
+
+    if (!save) {
+      console.warn('In EditableHeading, please provide a prop save');
+    }
+
+    if (!isEditting) {
+      return (
+        <div className={styles.editable_heading_text}>
+          <h2>{currentValue}</h2>
+          <div
+            onClick={this.toggleEditting}
+            className={styles.editable_heading_action}
+            data-test={`heading-edit-${property}`}
+          >
+            <i className="fa fa-edit" />
+          </div>
+        </div>
+      );
+    }
+
+    return (
+      <div className={styles.editable_heading_textbox}>
+        <input
+          onChange={this.handleTextChange}
+          className={`${styles.add_pad_left} form-control`}
+          type="text"
+          onKeyPress={this.handleKeyPress}
+          value={text}
+          data-test={`heading-edit-${property}-input`}
+        />
+        <div className={styles.editable_heading_action}>
+          <div
+            className={styles.editable_heading_action_item}
+            onClick={this.save}
+            data-test={`heading-edit-${property}-save`}
+          >
+            {loading ? 'Saving...' : 'Save'}
+          </div>
+          <div
+            className={styles.editable_heading_action_item}
+            onClick={this.toggleEditting}
+            data-test={`heading-edit-${property}-cancel`}
+          >
+            Cancel
+          </div>
+        </div>
+      </div>
+    );
+  };
+}
+
+export default Heading;
@@ -8,6 +8,7 @@ const gqlTableErrorNotif = [
     custom:
       'Table name cannot contain special characters. It can have alphabets, numbers (cannot start with numbers) and _ (can start with _)',
   },
+  'Error renaming table!',
 ];
 
 const gqlColumnErrorNotif = [
@@ -18,6 +19,18 @@ const gqlColumnErrorNotif = [
     custom:
       'Column name cannot contain special characters. It can have alphabets, numbers (cannot start with numbers) and _ (can start with _)',
   },
+  'Error renaming column!',
+];
+
+const gqlViewErrorNotif = [
+  'Error creating view!',
+  'View name cannot contain special characters',
+  '',
+  {
+    custom:
+      'View name cannot contain special characters. It can have alphabets, numbers (cannot start with numbers) and _ (can start with _)',
+  },
+  'Error renaming view!',
 ];
 
 const gqlRelErrorNotif = [
@@ -28,7 +41,13 @@ const gqlRelErrorNotif = [
     custom:
       'Relationship name cannot contain special characters. It can have alphabets, numbers (cannot start with numbers) and _ (can start with _)',
   },
+  'Error renaming relationship!',
 ];
 
 export default gqlPattern;
-export { gqlTableErrorNotif, gqlColumnErrorNotif, gqlRelErrorNotif };
+export {
+  gqlTableErrorNotif,
+  gqlViewErrorNotif,
+  gqlColumnErrorNotif,
+  gqlRelErrorNotif,
+};
@@ -482,7 +482,8 @@ const makeMigrationCall = (
   customOnError,
   requestMsg,
   successMsg,
-  errorMsg
+  errorMsg,
+  shouldSkipSchemaReload
 ) => {
   const upQuery = {
     type: 'bulk',
@@ -519,14 +520,16 @@ const makeMigrationCall = (
   };
 
   const onSuccess = () => {
-    if (globals.consoleMode === 'cli') {
-      dispatch(loadMigrationStatus()); // don't call for server mode
+    if (!shouldSkipSchemaReload) {
+      if (globals.consoleMode === 'cli') {
+        dispatch(loadMigrationStatus()); // don't call for server mode
+      }
+      dispatch(loadSchema());
     }
-    dispatch(loadSchema());
-    customOnSuccess();
     if (successMsg) {
       dispatch(showSuccessNotification(successMsg));
     }
+    customOnSuccess();
   };
 
   const onError = err => {