close #57 fix messaging, expand track all relations (#88)

hasura · Jul 11, 2018 · 113b6a9 · 113b6a9
1 parent 83ab85f
commit 113b6a9
Show file tree

Hide file tree

Showing 16 changed files with 283 additions and 58 deletions.
diff --git a/console/src/components/ApiExplorer/ApiExplorer.scss b/console/src/components/ApiExplorer/ApiExplorer.scss
@@ -39,7 +39,6 @@
 }
 .cursorNotAllowed {
   cursor: not-allowed;
-  pointer-events: none;
 }
 .apiExplorerWrapper
 {

diff --git a/console/src/components/ApiExplorer/state.js b/console/src/components/ApiExplorer/state.js
@@ -27,7 +27,7 @@ dataApisContent.push({
   details: {
     title: 'GraphQL API',
     description:
-      'GraphQL API for CRUD operations on tables/views in your database',
+      'GraphQL API for CRUD operations on tables & views in your database',
     category: 'data',
   },
   request: {

diff --git a/console/src/components/Common/Common.scss b/console/src/components/Common/Common.scss
@@ -380,6 +380,10 @@ input {
 {
   padding-left: 5px;
 }
+.padd_small_right
+{
+  padding-right: 5px;
+}
 .border_bottom
 {
   border-bottom: 1px solid #e7e7e7;
@@ -495,6 +499,10 @@ code
 {
   -webkit-padding-start: 15px;
 }
+.add_pad_bottom
+{
+  padding-bottom: 20px;
+}
 .add_padd_bottom
 {
   padding-bottom: 25px;
@@ -985,6 +993,7 @@ code
 
 .graphQLHeight {
   height: 100vh;
+  margin-bottom: 50px;
 }
 
 /* container height subtracting top header and bottom scroll bar */

diff --git a/console/src/components/Main/Main.js b/console/src/components/Main/Main.js
@@ -31,11 +31,18 @@ const Main = ({ children, location, migrationModeProgress, currentSchema }) => {
   let accessKeyHtml = null;
   if (globals.accessKey === '' || globals.accessKey === null) {
     accessKeyHtml = (
-      <a href="https://docs.hasura.io/1.0/graphql/manual/deployment/production.html">
-        <button className={'btn btn-danger ' + styles.add_mar_right}>
-          Secure your endpoint
-        </button>
-      </a>
+      <OverlayTrigger placement="left" overlay={tooltip.secureEndpoint}>
+        <a href="https://docs.hasura.io/1.0/graphql/manual/deployment/production.html">
+          <button className={'btn btn-danger ' + styles.add_mar_right}>
+            <i
+              className={
+                styles.padd_small_right + ' fa fa-exclamation-triangle'
+              }
+            />
+            Secure your endpoint
+          </button>
+        </a>
+      </OverlayTrigger>
     );
   }
 
@@ -75,7 +82,7 @@ const Main = ({ children, location, migrationModeProgress, currentSchema }) => {
                         aria-hidden="true"
                       />
                     </div>
-                    <p>API Explorer</p>
+                    <p>GraphiQL</p>
                   </Link>
                 </li>
               </OverlayTrigger>

diff --git a/console/src/components/Main/Tooltips.js b/console/src/components/Main/Tooltips.js
@@ -6,5 +6,11 @@ export const data = (
 );
 
 export const apiexplorer = (
-  <Tooltip id="tooltip-api-explorer">Test the Hasura APIs</Tooltip>
+  <Tooltip id="tooltip-api-explorer">Test the GraphQL APIs</Tooltip>
+);
+
+export const secureEndpoint = (
+  <Tooltip id="tooltip-secure-endpoint">
+    This graphql endpoint is public and you should add an access key
+  </Tooltip>
 );
diff --git a/console/src/components/Services/Data/Add/AddTable.js b/console/src/components/Services/Data/Add/AddTable.js
@@ -456,16 +456,7 @@ class AddTable extends Component {
           <div
             className={`${styles.addCol} col-xs-12 ${styles.padd_left_remove}`}
           >
-            <h4 className={styles.subheading_text}>
-              Table name: &nbsp; &nbsp;
-              <OverlayTrigger
-                placement="right"
-                overlay={tooltip.databaseNamingScheme}
-              >
-                <i className="fa fa-question-circle" aria-hidden="true" />
-              </OverlayTrigger>{' '}
-              &nbsp; &nbsp;
-            </h4>
+            <h4 className={styles.subheading_text}>Table name &nbsp; &nbsp;</h4>
             <input
               type="text"
               data-test="tableName"
@@ -480,7 +471,7 @@ class AddTable extends Component {
             {cols}
             <hr />
             <h4 className={styles.subheading_text}>
-              Primary Key: &nbsp; &nbsp;
+              Primary Key &nbsp; &nbsp;
               <OverlayTrigger
                 placement="right"
                 overlay={tooltip.primaryKeyDescription}

diff --git a/console/src/components/Services/Data/DataActions.js b/console/src/components/Services/Data/DataActions.js
@@ -42,6 +42,16 @@ const fetchSchemaList = () => (dispatch, getState) => {
           schema: 'information_schema',
         },
         columns: ['schema_name'],
+        where: {
+          schema_name: {
+            $nin: [
+              'information_schema',
+              'pg_catalog',
+              'hdb_catalog',
+              'hdb_views',
+            ],
+          },
+        },
       },
     }),
   };

diff --git a/console/src/components/Services/Data/DataHeader.js b/console/src/components/Services/Data/DataHeader.js
@@ -28,7 +28,7 @@ const DataHeader = ({
   /*
   const handleSchemaChange = e => {
     const updatedSchema = e.target.value;
-    dispatch(push(globals.urlPrefix + '/data/schema/' + updatedSchema));
+    dispatch(push('/data/schema/' + updatedSchema));
     Promise.all([
       dispatch({ type: UPDATE_CURRENT_SCHEMA, currentSchema: updatedSchema }),
       dispatch(loadSchema()),

diff --git a/console/src/components/Services/Data/PageContainer/PageContainer.js b/console/src/components/Services/Data/PageContainer/PageContainer.js
@@ -129,7 +129,7 @@ const PageContainer = ({
               styles.padd_left_remove
             }
           >
-            Tables
+            Tables ({schema.length})
           </div>
           {migrationMode ? (
             <div

diff --git a/console/src/components/Services/Data/PageContainer/PageContainer.scss b/console/src/components/Services/Data/PageContainer/PageContainer.scss
@@ -20,6 +20,12 @@
   line-height: 26px;
 }
 
+.changeSchema {
+  height: 25px;
+  margin-left: 10px;
+  width: auto;
+}
+
 .sidebar {
   height: calc(100vh - 26px);
   overflow: auto;

diff --git a/console/src/components/Services/Data/Schema/AutoAddRelations.js b/console/src/components/Services/Data/Schema/AutoAddRelations.js
@@ -4,7 +4,12 @@
 import PropTypes from 'prop-types';
 
 import React, { Component } from 'react';
-import { autoTrackRelations } from '../TableRelationships/Actions';
+import {
+  autoTrackRelations,
+  autoAddRelName,
+} from '../TableRelationships/Actions';
+import { getRelationshipLine } from '../TableRelationships/Relationships';
+import suggestedRelationshipsRaw from '../TableRelationships/autoRelations';
 
 class AutoAddRelations extends Component {
   componentWillMount() {
@@ -14,27 +19,118 @@ class AutoAddRelations extends Component {
     this.props.dispatch(autoTrackRelations());
   };
   render() {
-    // const styles = require('../PageContainer/PageContainer.scss');
+    const { schema, untrackedRelations, dispatch } = this.props;
+    const styles = require('../PageContainer/PageContainer.scss');
+    const handleAutoAddIndivRel = obj => {
+      dispatch(autoAddRelName(obj));
+    };
 
-    if (this.props.untrackedRelations.length === 0) {
-      return null;
+    if (untrackedRelations.length === 0) {
+      return (
+        <div
+          className={styles.display_inline + ' ' + styles.padd_bottom}
+          key="no-untracked-rel"
+        >
+          There are no untracked relations
+        </div>
+      );
     }
+    const untrackedIndivHtml = [];
+    schema.map(table => {
+      const currentTable = table.table_name;
+      const currentTableRel = suggestedRelationshipsRaw(currentTable, schema);
+      currentTableRel.objectRel.map(obj => {
+        untrackedIndivHtml.push(
+          <div
+            className={styles.padd_top_medium}
+            key={'untrackedIndiv' + table.table_name}
+          >
+            <button
+              className={`${styles.display_inline} btn btn-xs btn-default`}
+              onClick={e => {
+                e.preventDefault();
+                handleAutoAddIndivRel(obj);
+              }}
+            >
+              Add
+            </button>
+            <div className={styles.display_inline + ' ' + styles.add_pad_left}>
+              <b>{obj.tableName}</b> -{' '}
+              {getRelationshipLine(
+                obj.isObjRel,
+                obj.lcol,
+                obj.rcol,
+                obj.rTable
+              )}
+            </div>
+          </div>
+        );
+      });
+      currentTableRel.arrayRel.map(obj => {
+        untrackedIndivHtml.push(
+          <div
+            className={styles.padd_top_medium}
+            key={'untrackedIndiv' + table.table_name}
+          >
+            <button
+              className={`${styles.display_inline} btn btn-xs btn-default`}
+              onClick={e => {
+                e.preventDefault();
+                handleAutoAddIndivRel(obj);
+              }}
+            >
+              Add
+            </button>
+            <div className={styles.display_inline + ' ' + styles.add_pad_left}>
+              <b>{obj.tableName}</b> -{' '}
+              {getRelationshipLine(
+                obj.isObjRel,
+                obj.lcol,
+                obj.rcol,
+                obj.rTable
+              )}
+            </div>
+          </div>
+        );
+      });
+    });
     return (
       <div>
+        {untrackedRelations.length === 0 ? (
+          <div
+            className={styles.display_inline + ' ' + styles.padd_bottom}
+            key="no-untracked-rel"
+          >
+            There are no untracked relations
+          </div>
+        ) : (
+          <div
+            className={styles.display_inline + ' ' + styles.padd_bottom}
+            key="untracked-rel"
+          >
+            There are {untrackedRelations.length} untracked relations
+          </div>
+        )}
         <button
           onClick={this.trackAllRelations}
-          className={'btn btn-xs btn-default'}
+          className={
+            styles.display_inline +
+            ' btn btn-xs btn-default ' +
+            styles.add_mar_left
+          }
           data-test="track-all-relationships"
         >
-          Track Available Relations
+          Track All Relations
         </button>
+        <div className={styles.padd_top_small}>{untrackedIndivHtml}</div>
       </div>
     );
   }
 }
 
 AutoAddRelations.propTypes = {
   untrackedRelations: PropTypes.array.isRequired,
+  schema: PropTypes.array.isRequired,
   dispatch: PropTypes.func.isRequired,
 };