diff --git a/web/pages/components/config/edit-storage.tsx b/web/pages/components/config/edit-storage.tsx index 2eb426ca4..a2e26f98e 100644 --- a/web/pages/components/config/edit-storage.tsx +++ b/web/pages/components/config/edit-storage.tsx @@ -1,4 +1,4 @@ -import { Switch, Button, Collapse } from 'antd'; +import { Switch, Button, Collapse, Alert } from 'antd'; import classNames from 'classnames'; import React, { useContext, useState, useEffect } from 'react'; import { UpdateArgs } from '../../../types/config-section'; @@ -18,7 +18,7 @@ import { } from '../../../utils/input-statuses'; import TextField from './form-textfield'; import FormStatusIndicator from './form-status-indicator'; -import {isValidUrl} from '../../../utils/urls'; +import { isValidUrl } from '../../../utils/urls'; const { Panel } = Collapse; @@ -52,6 +52,7 @@ function checkSaveable(formValues: any, currentValues: any) { export default function EditStorage() { const [formDataValues, setFormDataValues] = useState(null); const [submitStatus, setSubmitStatus] = useState(null); + const [saved, setSaved] = useState(false); const [shouldDisplayForm, setShouldDisplayForm] = useState(false); const serverStatusData = useContext(ServerStatusContext); @@ -114,6 +115,7 @@ export default function EditStorage() { setFieldInConfigState({ fieldName: 's3', value: postValue, path: '' }); setSubmitStatus(createInputStatus(STATUS_SUCCESS, 'Updated.')); resetTimer = setTimeout(resetStates, RESET_TIMEOUT); + setSaved(true); }, onError: (message: string) => { setSubmitStatus(createInputStatus(STATUS_ERROR, message)); @@ -139,6 +141,14 @@ export default function EditStorage() { enabled: shouldDisplayForm, }); + const saveWarning = saved ? ( + ) : null; + const isSaveable = checkSaveable(formDataValues, s3); return ( @@ -211,6 +221,8 @@ export default function EditStorage() { + {saveWarning} +