Merge pull request #217 from Smithsonian/develop

v0.8.0!

.env.template

@@ -7,25 +7,29 @@ PACKRAT_DB_PORT=
 
 # CLIENT
 PACKRAT_CLIENT_PORT=
-REACT_APP_SERVER_ENDPOINT=
+PACKRAT_CLIENT_ENDPOINT=
+REACT_APP_PACKRAT_SERVER_ENDPOINT=
 
 # SERVER
 PACKRAT_SERVER_PORT=
-DATABASE_URL=
-CLIENT_ENDPOINT=
-SESSION_SECRET=
-EDAN_AUTH_KEY=
-EDAN_SERVER=
-EDAN_APPID=
-OCFL_STORAGE_ROOT=
-OCFL_STAGING_ROOT=
-COOK_SERVER_URL=
-AUTH_TYPE=
-LDAP_SERVER=
-LDAP_PASSWORD=
-LDAP_CN=
-LDAP_OU=
-LDAP_DC=
+PACKRAT_DATABASE_URL=
+PACKRAT_SESSION_SECRET=
+PACKRAT_EDAN_AUTH_KEY=
+PACKRAT_EDAN_SERVER=
+PACKRAT_EDAN_3D_API=
+PACKRAT_EDAN_APPID=
+PACKRAT_EDAN_UPSERT_RESOURCE_ROOT=
+PACKRAT_EDAN_STAGING_ROOT=
+PACKRAT_EDAN_RESOURCES_HOTFOLDER=
+PACKRAT_OCFL_STORAGE_ROOT=
+PACKRAT_OCFL_STAGING_ROOT=
+PACKRAT_COOK_SERVER_URL=
+PACKRAT_AUTH_TYPE=
+PACKRAT_LDAP_SERVER=
+PACKRAT_LDAP_PASSWORD=
+PACKRAT_LDAP_CN=
+PACKRAT_LDAP_OU=
+PACKRAT_LDAP_DC=
 
 # SOLR
 PACKRAT_SOLR_PORT=

.github/workflows/ci.yml

@@ -25,7 +25,7 @@ jobs:
       - name: Setup node version
         uses: actions/setup-node@v1
         with:
-          node-version: 12.18.4
+          node-version: 14.17.1
 
       - name: Install dependencies
         run: yarn install --frozen-lockfile
@@ -47,7 +47,7 @@ jobs:
           MYSQL_DATABASE: Packrat
         ports:
           - "3306:3306"
-        options: --health-cmd="mysqladmin ping" --health-interval=10s --health-timeout=5s --health-retries=3
+        options: --health-cmd="mysqladmin ping" --health-interval=10s --health-timeout=10s --health-retries=10
     steps:
       - name: Checkout code
         uses: actions/checkout@v2
@@ -67,7 +67,7 @@ jobs:
       - name: Setup node version
         uses: actions/setup-node@v1
         with:
-          node-version: 12.18.4
+          node-version: 14.17.1
 
       # Install dependencies in CI mode
       - name: Install dependencies
@@ -81,8 +81,8 @@ jobs:
       - name: Run Tests
         run: yarn test
         env:
-          EDAN_AUTH_KEY: ${{ secrets.EDAN_AUTH_KEY }}
-          DATABASE_URL: mysql://root:test@localhost:3306/Packrat
+          PACKRAT_EDAN_AUTH_KEY: ${{ secrets.PACKRAT_EDAN_AUTH_KEY }}
+          PACKRAT_DATABASE_URL: mysql://root:test@127.0.0.1:3306/Packrat
 
   build:
     # Only run this step on pull_request or push to specified branches (PR merge counts as push too)
@@ -95,7 +95,7 @@ jobs:
       PACKRAT_SERVER_PORT: 4000
       PACKRAT_DB_PORT: 3306
       MYSQL_ROOT_PASSWORD: packrat
-      REACT_APP_SERVER_ENDPOINT: http://packrat-server
+      REACT_APP_PACKRAT_SERVER_ENDPOINT: http://packrat-server
       PACKRAT_SOLR_PORT: 8983
       PACKRAT_SOLR_HOST: packrat-solr
 

.gitignore

@@ -113,4 +113,5 @@ build
 ### Custom ###
 server/var
 server/tests/mock/models/**/eremotherium_laurillardi*
-server/config/solr/data/packrat/data
+server/config/solr/data/packrat/data
+server/config/solr/data/packratMeta/data

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dpo-packrat/client",
-  "version": "0.6.0",
+  "version": "0.8.0",
   "private": true,
   "license": "Apache-2.0",
   "description": "Client for Packrat",
@@ -25,7 +25,7 @@
     "@apollo/client": "3.1.5",
     "@date-io/date-fns": "1.3.13",
     "@material-ui/core": "4.11.0",
-    "@material-ui/data-grid": "4.0.0-alpha.20",
+    "@material-ui/data-grid": "4.0.0-alpha.33",
     "@material-ui/icons": "4.9.1",
     "@material-ui/lab": "4.0.0-alpha.56",
     "@material-ui/pickers": "3.2.10",
@@ -51,16 +51,20 @@
     "graphql": "15.3.0",
     "graphql.macro": "1.4.2",
     "lodash": "4.17.20",
+    "mui-datatables": "3.7.7",
+    "prop-types": "15.7.2",
     "query-string": "6.13.2",
     "randomatic": "3.1.1",
     "react": "16.13.1",
     "react-activation": "0.5.5",
     "react-app-rewired": "2.1.6",
+    "react-datepicker": "3.8.0",
     "react-debounce-input": "3.2.2",
     "react-dom": "16.13.1",
     "react-dropzone": "11.1.0",
     "react-helmet": "6.1.0",
     "react-icons": "3.11.0",
+    "react-intersection-observer": "8.32.0",
     "react-router": "5.2.0",
     "react-router-dom": "5.2.0",
     "react-scripts": "3.4.0",
@@ -71,11 +75,13 @@
     "zustand": "3.1.3"
   },
   "devDependencies": {
+    "cross-env": "7.0.3",
     "jest": "24.9.0",
     "ts-jest": "24.3.0"
   },
   "scripts": {
-    "start": "react-app-rewired start",
+    "start": "cross-env TSC_WATCHFILE=UseFsEventsWithFallbackDynamicPolling react-app-rewired start",
+    "start:watchcontainer": "cross-env TSC_WATCHFILE=UseFsEventsWithFallbackDynamicPolling CHOKIDAR_USEPOLLING=1 react-app-rewired start",
     "start:prod": "react-app-rewired start",
     "build:dev": "yarn env-cmd -f ../.env.dev react-app-rewired build",
     "build:prod": "yarn env-cmd -f ../.env.prod react-app-rewired build",
@@ -97,7 +103,7 @@
     ]
   },
   "volta": {
-    "node": "14.16.0",
+    "node": "14.17.1",
     "yarn": "1.22.10"
   }
 }

client/src/api/index.ts

@@ -13,6 +13,7 @@ enum API_ROUTES {
 export type AuthResponseType = {
     success: boolean;
     message?: string;
+    originalUrl?: string;
 };
 
 export default class API {
@@ -31,10 +32,10 @@ export default class API {
     }
 
     static async request(route: string, options: RequestInit = {}): Promise<any> {
-        const { REACT_APP_SERVER_ENDPOINT } = process.env;
+        const { REACT_APP_PACKRAT_SERVER_ENDPOINT } = process.env;
 
-        if (!REACT_APP_SERVER_ENDPOINT) {
-            throw new Error('REACT_APP_SERVER_ENDPOINT was not provided to rest api client');
+        if (!REACT_APP_PACKRAT_SERVER_ENDPOINT) {
+            throw new Error('REACT_APP_PACKRAT_SERVER_ENDPOINT was not provided to rest api client');
         }
 
         const defaultOptions: RequestInit = {
@@ -45,6 +46,6 @@ export default class API {
             ...options
         };
 
-        return fetch(`${REACT_APP_SERVER_ENDPOINT}/${route}`, defaultOptions).then(response => response.json());
+        return fetch(`${REACT_APP_PACKRAT_SERVER_ENDPOINT}/${route}`, defaultOptions).then(response => response.json());
     }
 }

client/src/components/controls/CheckboxField.tsx

@@ -5,6 +5,8 @@
  */
 import { Checkbox } from '@material-ui/core';
 import React from 'react';
+import { withStyles } from '@material-ui/core/styles';
+
 import { ViewableProps } from '../../types/repository';
 import { getUpdatedCheckboxProps } from '../../utils/repository';
 import { withDefaultValueBoolean } from '../../utils/shared';
@@ -18,6 +20,13 @@ interface CheckboxFieldProps extends ViewableProps {
     required?: boolean;
 }
 
+const CheckboxNoPadding = withStyles({
+    root: {
+        border: '0px',
+        padding: '0px'
+    }
+})(Checkbox);
+
 function CheckboxField(props: CheckboxFieldProps): React.ReactElement {
     const { label, name, value, onChange, required = false, viewMode = false, disabled = false, updated = false } = props;
     const rowFieldProps = { alignItems: 'center', justifyContent: 'space-between', style: { borderRadius: 0 } };
@@ -30,7 +39,7 @@ function CheckboxField(props: CheckboxFieldProps): React.ReactElement {
             containerProps={rowFieldProps}
             width={viewMode ? 'auto' : undefined}
         >
-            <Checkbox
+            <CheckboxNoPadding
                 name={name}
                 disabled={disabled}
                 checked={withDefaultValueBoolean(value, false)}

client/src/components/controls/InputField.tsx

@@ -14,8 +14,8 @@ const useStyles = makeStyles(({ palette, typography, breakpoints }) => ({
     input: {
         width: '50%',
         outline: 'none',
-        border: (updated: boolean) => `1px solid ${fade(updated ? palette.secondary.main : palette.primary.contrastText, 0.4)}`,
-        backgroundColor: (updated: boolean) => updated ? palette.secondary.light : palette.background.paper,
+        border: ({ updated }: InputFieldProps) => `1px solid ${fade(updated ? palette.secondary.main : palette.primary.contrastText, 0.4)}`,
+        backgroundColor: ({ updated, error }: InputFieldProps) => error ? fade(palette.error.light, 0.3) : updated ? palette.secondary.light : palette.background.paper,
         padding: 8,
         borderRadius: 5,
         fontWeight: typography.fontWeightRegular,
@@ -34,11 +34,12 @@ interface InputFieldProps extends ViewableProps {
     name: string;
     onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     type?: string;
+    error?: boolean;
 }
 
 function InputField(props: InputFieldProps): React.ReactElement {
-    const { label, name, value, onChange, type, required = false, viewMode = false, disabled = false, updated = false } = props;
-    const classes = useStyles(updated);
+    const { label, name, value, onChange, type, required = false, viewMode = false, disabled = false } = props;
+    const classes = useStyles(props);
 
     const rowFieldProps = { alignItems: 'center', justifyContent: 'space-between', style: { borderRadius: 0 } };
 

client/src/components/controls/ReadOnlyRow.tsx

@@ -13,17 +13,23 @@ import FieldType from '../shared/FieldType';
 interface ReadOnlyRowProps extends ViewableProps {
     label: string;
     value?: number | string | null;
+    padding?: number;
+    gridTemplate?: string;
 }
 
 function ReadOnlyRow(props: ReadOnlyRowProps): React.ReactElement {
-    const { label, value } = props;
+    const { label, value, padding, gridTemplate } = props;
 
     const rowFieldProps = { alignItems: 'center', justifyContent: 'space-between', style: { borderRadius: 0 } };
+    if (gridTemplate) {
+        rowFieldProps['style']['display'] = 'grid';
+        rowFieldProps['style']['gridTemplateColumns'] = gridTemplate;
+    }
 
     return (
-        <FieldType required={false} label={label} direction='row' containerProps={rowFieldProps} width='auto'>
+        <FieldType required={false} label={label} direction='row' containerProps={rowFieldProps} width='100%'>
             <Box width='fit-content' textAlign='right'>
-                <Typography variant='caption' style={{ fontFamily: 'Roboto, Helvetical, Arial, sans-serif', color: '#2C405A', overflowWrap: 'break-word' }}>
+                <Typography variant='caption' style={{ fontFamily: 'Roboto, Helvetical, Arial, sans-serif', color: '#2C405A', overflowWrap: 'break-word', padding }}>
                     {value}
                 </Typography>
             </Box>