datajunction-ui 0.0.1-rc.23 → 0.0.1-rc.25

package/src/mocks/mockNodes.jsx

@@ -27,6 +27,7 @@ export const mocks = {
       {
         name: 'default_DOT_num_repair_orders',
         type: 'bigint',
+        display_name: 'Default DOT num repair orders',
         attributes: [],
         dimension: null,
       },
@@ -40,7 +41,7 @@ export const mocks = {
       },
     ],
     created_at: '2023-08-21T16:48:56.841631+00:00',
-    tags: [],
+    tags: [{ name: 'purpose', display_name: 'Purpose' }],
     dimensions: [
       {
         value: 'default.date_dim.dateint',
@@ -243,6 +244,7 @@ export const mocks = {
     {
       name: 'default_DOT_avg_repair_price',
       type: 'double',
+      display_name: 'Default DOT avg repair price',
       attributes: [],
       dimension: null,
     },
@@ -402,6 +404,7 @@ export const mocks = {
         {
           name: 'default_DOT_avg_repair_price',
           type: 'double',
+          display_name: 'Default DOT avg repair price',
           attributes: [],
           dimension: null,
         },
@@ -442,30 +445,35 @@ export const mocks = {
       {
         name: 'default_DOT_num_repair_orders',
         type: 'bigint',
+        display_name: 'Default DOT num repair orders',
         attributes: [],
         dimension: null,
       },
       {
         name: 'default_DOT_avg_repair_price',
         type: 'double',
+        display_name: 'Default DOT avg repair price',
         attributes: [],
         dimension: null,
       },
       {
         name: 'default_DOT_total_repair_cost',
         type: 'double',
+        display_name: 'Default DOT total repair cost',
         attributes: [],
         dimension: null,
       },
       {
         name: 'default_DOT_total_repair_order_discounts',
         type: 'double',
+        display_name: 'Default DOT total repair order discounts',
         attributes: [],
         dimension: null,
       },
       {
         name: 'company_name',
         type: 'string',
+        display_name: 'Company Name',
         attributes: [
           {
             attribute_type: {
@@ -821,6 +829,7 @@ export const mocks = {
       {
         name: 'default_DOT_avg_repair_price',
         type: 'double',
+        display_name: 'Default DOT avg repair price',
         attributes: [],
         dimension: null,
       },
@@ -1044,6 +1053,7 @@ export const mocks = {
         {
           name: 'repair_order_id',
           type: 'int',
+          display_name: 'Repair Order Id',
           attributes: [],
           dimension: {
             name: 'default.repair_order',
@@ -1052,24 +1062,28 @@ export const mocks = {
         {
           name: 'repair_type_id',
           type: 'int',
+          display_name: 'Repair Type Id',
           attributes: [],
           dimension: null,
         },
         {
           name: 'price',
           type: 'float',
+          display_name: 'Price',
           attributes: [],
           dimension: null,
         },
         {
           name: 'quantity',
           type: 'int',
+          display_name: 'Quantity',
           attributes: [],
           dimension: null,
         },
         {
           name: 'discount',
           type: 'float',
+          display_name: 'Discount',
           attributes: [],
           dimension: null,
         },
@@ -1108,6 +1122,7 @@ export const mocks = {
         {
           name: 'dateint',
           type: 'timestamp',
+          display_name: 'Dateint',
           attributes: [
             {
               attribute_type: {
@@ -1121,18 +1136,21 @@ export const mocks = {
         {
           name: 'month',
           type: 'int',
+          display_name: 'Month',
           attributes: [],
           dimension: null,
         },
         {
           name: 'year',
           type: 'int',
+          display_name: 'Year',
           attributes: [],
           dimension: null,
         },
         {
           name: 'day',
           type: 'int',
+          display_name: 'Day',
           attributes: [],
           dimension: null,
         },
@@ -1175,6 +1193,7 @@ export const mocks = {
         {
           name: 'hard_hat_id',
           type: 'int',
+          display_name: 'Hard Hat Id',
           attributes: [
             {
               attribute_type: {
@@ -1188,89 +1207,94 @@ export const mocks = {
         {
           name: 'last_name',
           type: 'string',
+          display_name: 'Last Name',
           attributes: [],
           dimension: null,
         },
         {
           name: 'first_name',
           type: 'string',
+          display_name: 'First Name',
           attributes: [],
           dimension: null,
         },
         {
           name: 'title',
           type: 'string',
+          display_name: 'Title',
           attributes: [],
           dimension: null,
         },
         {
           name: 'birth_date',
           type: 'date',
+          display_name: 'Birth Date',
           attributes: [],
           dimension: {
             name: 'default.date_dim',
           },
         },
         {
-          name: 'hire_date',
-          type: 'date',
-          attributes: [],
-          dimension: {
-            name: 'default.date_dim',
+          "name": "hire_date",
+          "type": "date",
+          "attributes": [],
+          "dimension": {
+            "name": "default.date_dim"
           },
+          "display_name": "Hire Date"
         },
         {
-          name: 'address',
-          type: 'string',
-          attributes: [],
-          dimension: null,
+          "name": "address",
+          "type": "string",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "Address"
         },
         {
-          name: 'city',
-          type: 'string',
-          attributes: [],
-          dimension: null,
+          "name": "city",
+          "type": "string",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "City"
         },
         {
-          name: 'state',
-          type: 'string',
-          attributes: [],
-          dimension: {
-            name: 'default.us_state',
+          "name": "state",
+          "type": "string",
+          "attributes": [],
+          "dimension": {
+            "name": "default.us_state"
           },
+          "display_name": "State"
         },
         {
-          name: 'postal_code',
-          type: 'string',
-          attributes: [],
-          dimension: null,
+          "name": "postal_code",
+          "type": "string",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "Postal Code"
         },
         {
-          name: 'country',
-          type: 'string',
-          attributes: [],
-          dimension: null,
+          "name": "country",
+          "type": "string",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "Country"
         },
         {
-          name: 'manager',
-          type: 'int',
-          attributes: [],
-          dimension: null,
+          "name": "manager",
+          "type": "int",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "Manager"
         },
         {
-          name: 'contractor_id',
-          type: 'int',
-          attributes: [],
-          dimension: null,
-        },
-      ],
-      updated_at: '2023-08-21T16:48:55.594603+00:00',
-      materializations: [],
-      parents: [
-        {
-          name: 'default.hard_hats',
-        },
-      ],
+          "name": "contractor_id",
+          "type": "int",
+          "attributes": [],
+          "dimension": null,
+          "display_name": "Contractor Id"
+        }
+        ],
       created_at: '2023-08-21T16:48:55.594537+00:00',
       tags: [],
     },
@@ -1302,6 +1326,7 @@ export const mocks = {
         {
           name: 'default_DOT_avg_repair_price',
           type: 'double',
+          display_name: 'Default DOT avg repair price',
           attributes: [],
           dimension: null,
         },
@@ -1345,6 +1370,7 @@ export const mocks = {
       {
         name: 'dispatcher_id',
         type: 'int',
+        display_name: 'Dispatcher Id',
         attributes: [
           {
             attribute_type: {
@@ -1358,12 +1384,14 @@ export const mocks = {
       {
         name: 'company_name',
         type: 'string',
+        display_name: 'Company Name',
         attributes: [],
         dimension: null,
       },
       {
         name: 'phone',
         type: 'string',
+        display_name: 'Phone',
         attributes: [],
         dimension: null,
       },
@@ -1394,4 +1422,20 @@ export const mocks = {
       display_name: 'Default: Num Repair Orders',
     },
   ],
+  tags: [
+    {
+      description: 'Financial-related reports',
+      display_name: 'Financial Reports',
+      tag_metadata: {},
+      name: 'report.financials',
+      tag_type: 'reports',
+    },
+    {
+      description: 'Forecasting reports',
+      display_name: 'Forecasting Reports',
+      tag_metadata: {},
+      name: 'reports.forecasts',
+      tag_type: 'reports',
+    },
+  ],
 };

package/src/styles/index.css

@@ -451,6 +451,12 @@ tbody th {
   background-color: #dbafff !important;
   color: #580076;
 }
+
+.entity__tag {
+  font-family: 'Jost';
+  background-color: #afd4ff !important;
+  color: #002176;
+}
 .react-flow__node .node_type__cube {
   background-color: #c2180750 !important;
   color: #c2180750;
@@ -710,9 +716,11 @@ pre {
 }
 .menu-title a {
   color: #7e8299;
+  cursor: pointer;
 }
 .menu-title a:hover {
   color: #3f4254;
+  cursor: pointer;
 }
 
 .node__header,
@@ -993,3 +1001,14 @@ pre {
 .deleteNode {
   display: inline-block;
 }
+
+.tag_value {
+  color: #5c3b8f;
+  background-color: #5c3b8f25;
+  margin: 0.25rem;
+  font-size: 100%;
+}
+
+.tag_value:hover {
+  background-color: #5c3b8f50;
+}

package/src/styles/loading.css

@@ -0,0 +1,35 @@
+.lds-ring {
+    display: inline-block;
+    position: relative;
+    width: 25px;
+    height: 25px;
+  }
+  .lds-ring div {
+    box-sizing: border-box;
+    display: block;
+    position: absolute;
+    width: 25px;
+    height: 25px;
+    border: 8px solid #fff;
+    border-radius: 50%;
+    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
+    border-color: #fff transparent transparent transparent;
+  }
+  .lds-ring div:nth-child(1) {
+    animation-delay: -0.45s;
+  }
+  .lds-ring div:nth-child(2) {
+    animation-delay: -0.3s;
+  }
+  .lds-ring div:nth-child(3) {
+    animation-delay: -0.15s;
+  }
+  @keyframes lds-ring {
+    0% {
+      transform: rotate(0deg);
+    }
+    100% {
+      transform: rotate(360deg);
+    }
+  }
+  

package/src/styles/login.css

@@ -3,18 +3,24 @@
   border: 2px solid #000000;
   background: linear-gradient(120deg, #ffed7c, #fef7c8);
   width: 40vw;
-  height: 30rem;
+  height: 45rem;
   box-sizing: border-box;
   padding: 2rem;
   display: grid;
   grid-template-columns: 1fr;
-  gap: 1rem;
   margin: auto;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
+  cursor: pointer;
+  grid-row-gap: 0;
+}
+
+.login form div {
+  display: block;
+  text-align: center;
 }
 
 .login form button {
@@ -49,7 +55,7 @@
 
 .login button[type='submit'] {
   width: 10vw;
-  background-color: #01b268;
+  background-color: #5D2E85;
   border: 2px solid #000000;
   color: white;
   padding: 14px 20px;
@@ -65,3 +71,11 @@
 .login .logo-title img {
   padding: 0.5rem;
 }
+
+.signup form {
+  height: 50rem;
+}
+
+.form-error {
+  color: red;
+}

package/src/utils/form.jsx

@@ -4,12 +4,12 @@ import * as React from 'react';
 
 export const displayMessageAfterSubmit = status => {
   return status?.success !== undefined ? (
-    <div className="message success">
+    <div className="message success" data-testid="success">
       <ValidIcon />
       {status?.success}
     </div>
   ) : status?.failure !== undefined ? (
-    <div className="message alert">
+    <div className="message alert" data-testid="failure">
       <AlertIcon />
       {status?.failure}
     </div>