diff --git a/packages/react-components/package.json b/packages/react-components/package.json index 248dced2..a32468a9 100644 --- a/packages/react-components/package.json +++ b/packages/react-components/package.json @@ -1,5 +1,5 @@ { - "version": "0.8.54", + "version": "0.8.63", "license": "MIT", "main": "dist/index.js", "typings": "dist/index.d.ts", diff --git a/packages/react-components/src/Accounts/Accounts.tsx b/packages/react-components/src/Accounts/Accounts.tsx index bd6b4ea2..756f3069 100644 --- a/packages/react-components/src/Accounts/Accounts.tsx +++ b/packages/react-components/src/Accounts/Accounts.tsx @@ -128,28 +128,37 @@ const Accounts: React.FC = ({ host, token, userGroupsDefaultSele setRows(changedRows); }; + const handleError = (error, action) => { + try { + if (error instanceof Error) { + const errorMessage = error.message; + const parsedError = JSON.parse(errorMessage); + const firstErrorMessage = parsedError.errors[0]?.description; + setErrorMessage(firstErrorMessage); + } else { + console.log(`${action}: Received non-Error object:`, error); + } + } catch (e) { + console.log(`${action}: Failed to parse error response.`, e); + } + }; + const handleSubmit = (row, isNew = false) => { + const onSuccess = () => { + setErrorMessage(''); + fetchData(); + }; + + const onError = (error) => { + handleError(error, isNew ? 'Create Account' : 'Update Account'); + }; + if (isNew) { - return createAccount(host, token, { ...row }).subscribe( - () => { - fetchData(); - }, - (error) => { - console.log('Create Account: ', error); - } - ); + return createAccount(host, token, { ...row }).subscribe(onSuccess, onError); } else { - return updateAccount(host, token, { ...row }).subscribe( - () => { - fetchData(); - }, - (error) => { - setErrorMessage('Passwords must be at least 7 characters'); - console.log('Update Account: ', error); - } - ); + return updateAccount(host, token, { ...row }).subscribe(onSuccess, onError); } - }; + }; const handleDelete = (row) => { deleteAccount(host, token, row.id).subscribe( diff --git a/packages/react-components/src/Auth/LoginForm/LoginForm.tsx b/packages/react-components/src/Auth/LoginForm/LoginForm.tsx index 08711183..5e3b91b5 100644 --- a/packages/react-components/src/Auth/LoginForm/LoginForm.tsx +++ b/packages/react-components/src/Auth/LoginForm/LoginForm.tsx @@ -1,3 +1,5 @@ +import React from 'react'; + import { Button, Checkbox, diff --git a/packages/react-components/src/Jobs/JobList/helpers/StatusCell.tsx b/packages/react-components/src/Jobs/JobList/helpers/StatusCell.tsx index 7317e3a1..8f9329b1 100644 --- a/packages/react-components/src/Jobs/JobList/helpers/StatusCell.tsx +++ b/packages/react-components/src/Jobs/JobList/helpers/StatusCell.tsx @@ -1,17 +1,14 @@ -import { - Box, - CircularProgress, - Tooltip, - Typography, -} from '@material-ui/core'; +import { Box, CircularProgress, Tooltip, Typography } from '@material-ui/core'; import { blue, green, red, yellow } from '@material-ui/core/colors'; import { + AccessTimeOutlined, Cancel, CancelScheduleSend, CheckCircle, Error, HelpOutline, HourglassEmpty, + PlayCircleFilled, TimerOffOutlined, } from '@material-ui/icons'; import React, { useMemo } from 'react'; @@ -31,7 +28,12 @@ const StatusCell = ({ row }: { row: any }) => { return ( - + { alignItems="center" justifyContent="center" > - {progress ? `${progress}%` : ''} + + {progress ? `${progress}%` : ''} + @@ -78,6 +86,24 @@ const StatusCell = ({ row }: { row: any }) => { ); + case 'Starting': + return ( + + + + ); + case 'TimedOut': + return ( + + + + ); + case 'Rejected': + return ( + + + + ); default: return ( diff --git a/packages/react-components/src/common/Table/Popup.tsx b/packages/react-components/src/common/Table/Popup.tsx index f02b4ba6..502e36da 100644 --- a/packages/react-components/src/common/Table/Popup.tsx +++ b/packages/react-components/src/common/Table/Popup.tsx @@ -45,6 +45,7 @@ const Popup: React.FC = ({ hasPassword, userGroupsDefaultSelected, errorMessage, + passwordRequired, }) => { const [error, setError] = useState(false); const [passwordStrengthColor, setPasswordStrengthColor] = useState('red'); @@ -142,8 +143,8 @@ const Popup: React.FC = ({ variant="standard" required={isNew} value={row.password || ''} - error={!passwordValid || errorMessage!==''} - helperText={errorMessage} + error={!passwordValid || passwordRequired} + helperText={passwordRequired ? errorMessage : ''} InputProps={{ endAdornment }} onChange={onChange} autoComplete="new-password" @@ -158,12 +159,12 @@ const Popup: React.FC = ({ required={isNew} label="Repeat Password" value={row.repeatPassword || ''} - error={!passwordValid || errorMessage!==''} + error={!passwordValid || passwordRequired} onChange={onChange} helperText={ (!passwordValid && 'Passwords do not match') || - errorMessage - } + (passwordRequired ? errorMessage : '') + } autoComplete="new-password" /> diff --git a/packages/react-components/src/common/Table/PopupEditing.tsx b/packages/react-components/src/common/Table/PopupEditing.tsx index 8b1d09da..f4d6c93b 100644 --- a/packages/react-components/src/common/Table/PopupEditing.tsx +++ b/packages/react-components/src/common/Table/PopupEditing.tsx @@ -114,22 +114,33 @@ const PopupEditing = React.memo( const rowIds = isNew ? [0] : editingRowIds; const applyChanges = () => { - metadata?.forEach((item, index) => { - if (editedRow.metadata === undefined || editedRow.metadata[metadata[index].key] === undefined) { - editedRow.metadata = { - ...editedRow.metadata, - [metadata[index].key]: metadata[index].default, - }; - } - }); - - if (isNew) { - commitAddedRows({ rowIds }); - onSave(editedRow, isNew); - } else { - stopEditRows({ rowIds }); - commitChangedRows({ rowIds }); - onSave(editedRow); + try { + metadata?.forEach((item, index) => { + if ( + editedRow.metadata === undefined || + editedRow.metadata[metadata[index].key] === undefined + ) { + editedRow.metadata = { + ...editedRow.metadata, + [metadata[index].key]: metadata[index].default, + }; + } + }); + + if (isNew) { + commitAddedRows({ rowIds }); + } + + if (errorMessage !== '') { + stopEditRows({ rowIds }); + commitChangedRows({ rowIds }); + } + + onSave(editedRow, isNew); + + } catch (error) { + console.error('Error applying changes:', error); + cancelChanges(); } }; @@ -162,6 +173,7 @@ const PopupEditing = React.memo( hasPassword={hasPassword} userGroupsDefaultSelected={userGroupsDefaultSelected} errorMessage={errorMessage} + passwordRequired={editedRow?.password?.length < 6} /> ); }} diff --git a/packages/react-components/src/common/Table/types.ts b/packages/react-components/src/common/Table/types.ts index dc77c9cc..19f47ab6 100644 --- a/packages/react-components/src/common/Table/types.ts +++ b/packages/react-components/src/common/Table/types.ts @@ -144,6 +144,7 @@ export interface PopupProps { */ userGroupsDefaultSelected?: string[]; errorMessage?: string; + passwordRequired?: boolean; } export interface MetadataEditorProps {