Merge pull request #270 from Smithsonian/develop

v0.9.0 Merge!
Smithsonian · Dec 9, 2021 · de0d2e1 · de0d2e1
2 parents 2185e19 + 67ec820
commit de0d2e1
Show file tree

Hide file tree

Showing 192 changed files with 6,859 additions and 2,298 deletions.
diff --git a/client/package.json b/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@dpo-packrat/client",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "private": true,
   "license": "Apache-2.0",
   "description": "Client for Packrat",

diff --git a/client/src/components/controls/LoadingButton.tsx b/client/src/components/controls/LoadingButton.tsx
@@ -25,7 +25,9 @@ function LoadingButton(props: LoadingButtonProps): React.ReactElement {
     const classes = useStyles();
 
     return (
-        <Button className={clsx(classes.button, className)} variant='contained' color='primary' {...rest}>
+        <Button className={clsx(classes.button, className)} variant='contained' color='primary' disabled={loading}
+            {...rest}
+        >
             {!loading && props.children}
             {loading && <Progress color='inherit' size={loaderSize || 20} />}
         </Button>

diff --git a/client/src/components/controls/TextArea.tsx b/client/src/components/controls/TextArea.tsx
@@ -0,0 +1,83 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+/**
+ * TextArea
+ *
+ * This component renders a textarea form control component.
+ */
+import { makeStyles } from '@material-ui/core/styles';
+import React from 'react';
+import { DebounceInput } from 'react-debounce-input';
+import { ViewableProps } from '../../types/repository';
+import FieldType from '../shared/FieldType';
+
+const useStyles = makeStyles(({ palette, typography }) => ({
+    description: {
+        height: ({ height, rows }: TextAreaProps) => rows ? 'undefined' : height,
+        width: '80%',
+        padding: 10,
+        resize: 'none',
+        overflow: 'scroll',
+        border: `${palette.primary.contrastText}, 0.4`,
+        backgroundColor: palette.background.paper,
+        borderRadius: 5,
+        fontWeight: typography.fontWeightRegular,
+        fontFamily: typography.fontFamily,
+        fontSize: '0.8em'
+    }
+}));
+
+interface TextAreaProps extends ViewableProps {
+    label?: string;
+    value?: number | string | null;
+    name: string;
+    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    error?: boolean;
+    placeholder?: string;
+    height?: string;
+    rows?: string;
+}
+
+function TextArea(props: TextAreaProps): React.ReactElement {
+    const { label, name, value, onChange, required = false, viewMode = false, disabled = false, placeholder, rows } = props;
+    const classes = useStyles(props);
+
+    const rowFieldProps = { alignItems: 'center', justifyContent: 'space-between', style: { borderRadius: 0 } };
+    return (
+        (label ?
+            <FieldType
+                required={required}
+                label={label ?? ''}
+                direction='row'
+                containerProps={rowFieldProps}
+                width={viewMode ? 'auto' : undefined}
+            >
+                <DebounceInput
+                    forceNotifyByEnter={false}
+                    element={'textarea'}
+                    disabled={disabled}
+                    value={value || ''}
+                    className={classes.description}
+                    name={name}
+                    onChange={onChange}
+                    debounceTimeout={400}
+                    placeholder={placeholder}
+                    rows={rows}
+                />
+            </FieldType> :
+            <DebounceInput
+                forceNotifyByEnter={false}
+                element={'textarea'}
+                disabled={disabled}
+                value={value || ''}
+                className={classes.description}
+                name={name}
+                onChange={onChange}
+                debounceTimeout={400}
+                placeholder={placeholder}
+                rows={rows}
+            />
+        )
+    );
+}
+
+export default TextArea;
diff --git a/client/src/components/controls/ToolTip.tsx b/client/src/components/controls/ToolTip.tsx
@@ -0,0 +1,27 @@
+/**
+ * ToolTip
+ *
+ * This custom component is used in the MUI Tooltip component to allow for greater customization, such as line breaks.
+ */
+import React from 'react';
+
+export interface ToolTipProps {
+    text: string;
+}
+
+export function ToolTip(props: ToolTipProps): React.ReactElement {
+    const { text } = props;
+    const lines = text.split('\n');
+    const content = lines.map((line, index) => {
+        return (
+            <span key={index} style={{ display: 'block' }}>
+                {line}
+            </span>
+        );
+    });
+    return (
+        <>
+            {content}
+        </>
+    );
+}
diff --git a/client/src/components/index.ts b/client/src/components/index.ts
@@ -23,6 +23,8 @@ import EnvBanner from './shared/EnvBanner';
 import DebounceNumberInput from './controls/DebounceNumberInput';
 import CheckboxField from './controls/CheckboxField';
 import ReadOnlyRow from './controls/ReadOnlyRow';
+import TextArea from './controls/TextArea';
+import { ToolTip } from './controls/ToolTip';
 
 export {
     Header,
@@ -45,7 +47,9 @@ export {
     EnvBanner,
     DebounceNumberInput,
     CheckboxField,
-    ReadOnlyRow
+    ReadOnlyRow,
+    TextArea,
+    ToolTip
 };
 
 export type { RepositoryIconProps };
diff --git a/client/src/components/shared/SidebarBottomNavigator.tsx b/client/src/components/shared/SidebarBottomNavigator.tsx
@@ -56,20 +56,21 @@ interface SidebarBottomNavigatorProps {
     rightRoute?: string;
     onClickRight?: () => void;
     invalidMetadataStep?: boolean;
+    disableNavigation?: boolean;
 }
 
 function SidebarBottomNavigator(props: SidebarBottomNavigatorProps): React.ReactElement {
-    const { leftLabel, onClickLeft, leftRoute, leftLoading, rightLabel, onClickRight, rightRoute, rightLoading, uploadVersion, invalidMetadataStep } = props;
+    const { leftLabel, onClickLeft, leftRoute, leftLoading, rightLabel, onClickRight, rightRoute, rightLoading, uploadVersion, invalidMetadataStep, disableNavigation } = props;
     const classes = useStyles();
 
     let leftButton = (
-        <LoadingButton className={classes.navButton} disableElevation loaderSize={15} loading={leftLoading || false} onClick={onClickLeft}>
+        <LoadingButton className={classes.navButton} disableElevation loaderSize={15} loading={leftLoading || false} disabled={disableNavigation} onClick={onClickLeft}>
             {leftLabel}
         </LoadingButton>
     );
 
     let rightButton = (
-        <LoadingButton className={classes.navButton} disableElevation loaderSize={15} loading={rightLoading || false} onClick={onClickRight}>
+        <LoadingButton className={classes.navButton} disableElevation loaderSize={15} loading={rightLoading || false} disabled={disableNavigation} onClick={onClickRight}>
             {rightLabel}
         </LoadingButton>
     );

diff --git a/client/src/constants/helperfunctions.ts b/client/src/constants/helperfunctions.ts
@@ -1,6 +1,12 @@
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
+export enum eIngestionMode {
+    eUpdate = 1,
+    eIngest = 2,
+    eAttach = 3
+}
+
 export function toTitleCase(str: string): string {
     return str.replace(/\w\S*/g, txt => {
         return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
@@ -115,11 +121,15 @@ export const updateSystemObjectUploadRedirect = (idAsset: number | undefined | n
     if (idAssetVersion) assetVersion = `&idAssetVersion=${idAssetVersion}`;
     if (assetType) fileType = `&fileType=${assetType}`;
 
-    return `/ingestion/uploads?${asset}${assetVersion}${fileType}&type=${ObjectType}&mode=1`;
+    return `/ingestion/uploads?${asset}${assetVersion}${fileType}&type=${ObjectType}&mode=${eIngestionMode.eUpdate}`;
 };
 
 export const ingestSystemObjectUploadRedirect = (fileName: string) => {
-    return `/ingestion/uploads?name=${fileName}&mode=2`;
+    return `/ingestion/uploads?name=${fileName}&mode=${eIngestionMode.eIngest}`;
+};
+
+export const attachSystemObjectUploadRedirect = (idSystemObject: number, ObjectType: number | undefined | null) => {
+    return `/ingestion/uploads?idSOAttachment=${idSystemObject}&fileType=${ObjectType}&mode=${eIngestionMode.eAttach}`;
 };
 
 export const truncateWithEllipses = (text: string, max: number) => text.substr(0, max - 1) + (text.length > max ? ' ...' : '');
diff --git a/client/src/index.tsx b/client/src/index.tsx
@@ -19,27 +19,30 @@ import './global/root.css';
 import { apolloClient } from './graphql';
 import { Home, Login } from './pages';
 import * as serviceWorker from './serviceWorker';
-import { useUserStore, useVocabularyStore, useLicenseStore, useUsersStore } from './store';
+import { useUserStore, useVocabularyStore, useLicenseStore, useUsersStore, useObjectMetadataStore } from './store';
 import theme from './theme';
+import { eVocabularySetID } from './types/server';
 
 function AppRouter(): React.ReactElement {
     const [loading, setLoading] = useState(true);
     const initialize = useUserStore(state => state.initialize);
-    const updateVocabularyEntries = useVocabularyStore(state => state.updateVocabularyEntries);
+    const [updateVocabularyEntries, getEntries] = useVocabularyStore(state => [state.updateVocabularyEntries, state.getEntries]);
     const updateLicenseEntries = useLicenseStore(state => state.updateLicenseEntries);
     const updateUsersEntries = useUsersStore(state => state.updateUsersEntries);
+    const initializeMdmEntries = useObjectMetadataStore(state => state.initializeMdmEntries);
 
     const initializeUser = useCallback(async () => {
         try {
             await initialize();
             await updateVocabularyEntries();
             await updateLicenseEntries();
             await updateUsersEntries();
+            await initializeMdmEntries(getEntries(eVocabularySetID.eEdanMDMFields).map(entry => entry.Term));
             setLoading(false);
         } catch {
             toast.error('Cannot connect to the server, please try again later');
         }
-    }, [initialize, updateVocabularyEntries, updateLicenseEntries, updateUsersEntries]);
+    }, [initialize, updateVocabularyEntries, updateLicenseEntries, updateUsersEntries, initializeMdmEntries, getEntries]);
 
     useEffect(() => {
         initializeUser();

diff --git a/client/src/pages/Admin/components/AddProjectForm.tsx b/client/src/pages/Admin/components/AddProjectForm.tsx
@@ -114,7 +114,8 @@ function AddProjectForm(): React.ReactElement {
             }
             return isValidName;
         } catch (error) {
-            toast.warn(error);
+            if (error instanceof Error)
+                toast.warn(error);
         } finally {
             setIsUpdatingData(false);
         }

diff --git a/client/src/pages/Admin/components/AddUnitForm.tsx b/client/src/pages/Admin/components/AddUnitForm.tsx
@@ -89,7 +89,7 @@ function AddUnitForm(): React.ReactElement {
     // schema for validating the appropriate form fields
     const schema = yup.object().shape({
         name: yup.string().min(1),
-        abbreviation: yup.string().min(1)
+        abbreviation: yup.string().min(1).max(20)
     });
 
     const onNameUpdate = ({ target }) => {
@@ -111,12 +111,14 @@ function AddUnitForm(): React.ReactElement {
             setValidName(isValidName);
             const isValidAbbreviation = await schema.isValid({ abbreviation });
             setValidAbbreviation(isValidAbbreviation);
-            if (!isValidName || !isValidAbbreviation) {
+            if (abbreviation.length > 20)
+                toast.warn('Creation Failed: Unit Abbreviation must be 20 characters or less in length');
+            else if (!isValidName || !isValidAbbreviation)
                 toast.warn('Creation Failed: Please Address The Errors Above');
-            }
             return isValidName && isValidAbbreviation;
         } catch (error) {
-            toast.warn(error);
+            if (error instanceof Error)
+                toast.warn(error);
         } finally {
             setIsUpdatingData(false);
         }

diff --git a/client/src/pages/Admin/components/AdminUserForm.tsx b/client/src/pages/Admin/components/AdminUserForm.tsx
@@ -157,7 +157,8 @@ function AdminUserForm(): React.ReactElement {
             setValidEmailInput(validEmailResponse);
             return validNameResponse && validEmailResponse;
         } catch (error) {
-            toast.warn(error);
+            if (error instanceof Error)
+                toast.warn(error);
         }
     };
 

diff --git a/client/src/pages/Admin/components/License/LicenseForm.tsx b/client/src/pages/Admin/components/License/LicenseForm.tsx
@@ -161,7 +161,8 @@ function LicenseForm(): React.ReactElement {
             }
             return isValidName && isUniqueName;
         } catch (error) {
-            toast.warn(error);
+            if (error instanceof Error)
+                toast.warn(error);
         }
     };
 

diff --git a/client/src/pages/Admin/components/License/LicenseView.tsx b/client/src/pages/Admin/components/License/LicenseView.tsx
@@ -155,7 +155,6 @@ function SearchFilter({ queryByFilter }: { queryByFilter: (newSearchText: string
     };
 
     const search = () => {
-        console.log('searchFiler', searchFilter);
         queryByFilter(searchFilter);
     };