From 4dc13e5ec83add47910b141d2cccbfa997ff6fc6 Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Mon, 1 Aug 2022 10:28:28 +0900 Subject: [PATCH 1/8] Use toast for error on deleting database --- .../organisms/DatabaseDeleteModal.tsx | 84 ++++++++----------- 1 file changed, 36 insertions(+), 48 deletions(-) diff --git a/src/components/organisms/DatabaseDeleteModal.tsx b/src/components/organisms/DatabaseDeleteModal.tsx index 27bbc9d4..f7fa8256 100644 --- a/src/components/organisms/DatabaseDeleteModal.tsx +++ b/src/components/organisms/DatabaseDeleteModal.tsx @@ -3,14 +3,10 @@ import { metaStore } from "@dataware-tools/api-meta-store-client"; import { ConfirmModal, ConfirmModalProps, - ErrorMessageProps, - ErrorMessage, Spacer, - extractErrorMessageFromFetchError, } from "@dataware-tools/app-common"; import Box from "@mui/material/Box"; import TextField from "@mui/material/TextField"; -import { useState } from "react"; import { useForm, Controller, @@ -22,13 +18,17 @@ import { useNavigate } from "react-router-dom"; import { useRecoilValue } from "recoil"; import { ElemCenteringFlexDiv } from "components/atoms/ElemCenteringFlexDiv"; import { databasePaginateState } from "globalStates"; -import { useListDatabases, fetchMetaStore, APP_ROUTE } from "utils"; +import { + enqueueErrorToastForFetchError, + useListDatabases, + fetchMetaStore, + APP_ROUTE, +} from "utils"; type ConfirmInputType = { databaseId: string }; type ValidateRuleType = ControllerProps["rules"]; export type DatabaseDeleteModalPresentationProps = { - error?: ErrorMessageProps; formControl: Control; validateRules: Record; validateErrors: FieldErrors; @@ -45,7 +45,6 @@ export type DatabaseDeleteModalProps = { }; export const DatabaseDeleteModalPresentation = ({ - error, databaseId, onClose, formControl, @@ -60,36 +59,32 @@ export const DatabaseDeleteModalPresentation = ({ title={`Are you sure you want to delete ${databaseId}?`} confirmMode="delete" body={ - error ? ( - - ) : ( - - - Type "{databaseId}" to confirm: - - - { - return ( - - ); - }} - /> - - ) + + + Type "{databaseId}" to confirm: + + + { + return ( + + ); + }} + /> + } {...dialogProps} /> @@ -108,10 +103,6 @@ export const DatabaseDeleteModal = ({ handleSubmit, formState: { errors: validateErrors }, } = useForm(); - const [error, setError] = useState< - DatabaseDeleteModalPresentationProps["error"] | undefined - >(undefined); - const { mutate: listDatabaseMutate } = useListDatabases(getAccessToken, { page, perPage, @@ -153,12 +144,10 @@ export const DatabaseDeleteModal = ({ ); if (deleteDatabaseError) { - const { reason, instruction } = - extractErrorMessageFromFetchError(deleteDatabaseError); - setError({ - reason, - instruction, - }); + enqueueErrorToastForFetchError( + "Failed to delete database", + deleteDatabaseError + ); cancelCloseModal = true; } else if (deleteDatabaseRes) { listDatabaseMutate(); @@ -178,7 +167,6 @@ export const DatabaseDeleteModal = ({ return ( Date: Mon, 1 Aug 2022 14:48:02 +0900 Subject: [PATCH 2/8] Use toast on updating configs for database --- .../organisms/DatabaseConfigModal/index.tsx | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/src/components/organisms/DatabaseConfigModal/index.tsx b/src/components/organisms/DatabaseConfigModal/index.tsx index f25918ae..f3383f23 100644 --- a/src/components/organisms/DatabaseConfigModal/index.tsx +++ b/src/components/organisms/DatabaseConfigModal/index.tsx @@ -27,7 +27,11 @@ import { DisplayFieldsConfigBody } from "./DisplayFieldsConfigBody"; import { InputFieldsConfigBody } from "./InputFieldsConfigBody"; import { SearchFieldsConfigBody } from "./SearchFieldsConfigBody"; import { SecretFieldsConfigBody } from "./SecretFieldsConfigBody"; -import { fetchMetaStore, useGetConfig } from "utils"; +import { + enqueueErrorToastForFetchError, + fetchMetaStore, + useGetConfig, +} from "utils"; export type ConfigNameType = "record_list_display_columns"; @@ -189,14 +193,15 @@ export const DatabaseConfigModal = ({ ); if (updateConfigError) { - const { reason, instruction } = - extractErrorMessageFromFetchError(updateConfigError); - setError({ reason, instruction }); + enqueueErrorToastForFetchError( + "Failed to update configs for database", + updateConfigError + ); } else { getConfigMutate(updateConfigRes); + propsOnClose(); } setIsSaving(false); - propsOnClose(); }; const isFetchComplete = Boolean(!fetchError && databaseConfig); From f776b1d151549bf1d3f154796be696e4ca83afa2 Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Mon, 1 Aug 2022 15:49:42 +0900 Subject: [PATCH 3/8] Use toast on adding and updating record --- src/components/organisms/MetadataEditModal.tsx | 1 - src/components/organisms/RecordEditModal.tsx | 5 ++--- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/organisms/MetadataEditModal.tsx b/src/components/organisms/MetadataEditModal.tsx index 479ce6b2..73d6fd1b 100644 --- a/src/components/organisms/MetadataEditModal.tsx +++ b/src/components/organisms/MetadataEditModal.tsx @@ -241,7 +241,6 @@ export const MetadataEditModal = ({ setIsSaving(false); if (!isSubmitSucceed) { - await alert({ title: "save failed. please retry saving" }); return; } } diff --git a/src/components/organisms/RecordEditModal.tsx b/src/components/organisms/RecordEditModal.tsx index 94108b96..37eb86b6 100644 --- a/src/components/organisms/RecordEditModal.tsx +++ b/src/components/organisms/RecordEditModal.tsx @@ -13,6 +13,7 @@ import { import { recordPaginateState } from "globalStates"; import { compInputFields, + enqueueErrorToastForFetchError, fetchMetaStore, useGetRecord, useGetConfig, @@ -118,9 +119,7 @@ export const RecordEditModal = ({ ); if (saveRecordError) { - const { reason, instruction } = - extractErrorMessageFromFetchError(saveRecordError); - setError({ reason, instruction }); + enqueueErrorToastForFetchError("Failed to save record", saveRecordError); return false; } From 4c5200d8ecc90b95ef02aa70a4ec800cd4eddb36 Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Mon, 1 Aug 2022 16:50:56 +0900 Subject: [PATCH 4/8] Use toast for updating file metadata --- src/components/organisms/FileEditModal.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/FileEditModal.tsx b/src/components/organisms/FileEditModal.tsx index 714060e6..cd37fb10 100644 --- a/src/components/organisms/FileEditModal.tsx +++ b/src/components/organisms/FileEditModal.tsx @@ -11,6 +11,7 @@ import { } from "components/organisms/MetadataEditModal"; import { compInputFields, + enqueueErrorToastForFetchError, fetchMetaStore, useGetConfig, useListFiles, @@ -98,9 +99,10 @@ export const FileEditModal = ({ ); if (saveFileError) { - const { reason, instruction } = - extractErrorMessageFromFetchError(saveFileError); - setError({ reason, instruction }); + enqueueErrorToastForFetchError( + "Failed to update file metadata", + saveFileError + ); return false; } From a6e948f3127055dac436da319a19c439ed8de1bb Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Mon, 1 Aug 2022 17:03:12 +0900 Subject: [PATCH 5/8] Use toast on deleting record --- src/components/organisms/RecordList.tsx | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/organisms/RecordList.tsx b/src/components/organisms/RecordList.tsx index 2ef0207f..f61179ae 100644 --- a/src/components/organisms/RecordList.tsx +++ b/src/components/organisms/RecordList.tsx @@ -20,6 +20,7 @@ import { useRecoilState } from "recoil"; import { RecordDetailModal } from "components/organisms/RecordDetailModal"; import { useIsActionPermitted, recordPaginateState } from "globalStates"; import { + enqueueErrorToastForFetchError, useGetConfig, fetchMetaStore, useListRecords, @@ -143,7 +144,7 @@ export const RecordList = ({ }); listRecordsMutate(newRecordList, false); - const [deleteRecordRes, deleteRecordError] = await fetchMetaStore( + const [, deleteRecordError] = await fetchMetaStore( getAccessToken, metaStore.RecordService.deleteRecord, { @@ -153,12 +154,13 @@ export const RecordList = ({ ); if (deleteRecordError) { - const { reason, instruction } = - extractErrorMessageFromFetchError(deleteRecordError); - setError({ reason, instruction }); - } else if (deleteRecordRes) { - listRecordsMutate(); + enqueueErrorToastForFetchError( + "Failed to delete record", + deleteRecordError + ); } + + listRecordsMutate(); } }; From 14dd40c02b5b7d00ec9dbb65d8c9a385c420f66d Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Wed, 3 Aug 2022 15:26:46 +0900 Subject: [PATCH 6/8] Replace alert to toast for deleting file action --- src/components/organisms/FileList.tsx | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/src/components/organisms/FileList.tsx b/src/components/organisms/FileList.tsx index 5f0a74b7..53445339 100644 --- a/src/components/organisms/FileList.tsx +++ b/src/components/organisms/FileList.tsx @@ -22,6 +22,7 @@ import { FilePreviewModalProps, } from "components/organisms/FilePreviewModal"; import { + enqueueErrorToastForFetchError, useListFiles, fetchFileProvider, fetchMetaStore, @@ -152,9 +153,10 @@ export const FileList = ({ ); if (deleteFileEntityError) { - await alert({ - title: `Error occur! : ${JSON.stringify(deleteFileEntityError)}`, - }); + enqueueErrorToastForFetchError( + "Failed to delete file", + deleteFileEntityError + ); return; } @@ -168,9 +170,10 @@ export const FileList = ({ ); if (deleteFileMetaError) { - await alert({ - title: `Error occur! : ${JSON.stringify(deleteFileMetaError)}`, - }); + enqueueErrorToastForFetchError( + "Failed to delete metdata of the file", + deleteFileMetaError + ); return; } From 3a4ec0f95f65a45812706f573d0cf106c0c9ac46 Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Wed, 3 Aug 2022 15:29:56 +0900 Subject: [PATCH 7/8] Replace alert to toast for file download --- src/components/organisms/FileList.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/organisms/FileList.tsx b/src/components/organisms/FileList.tsx index 53445339..d9f611ad 100644 --- a/src/components/organisms/FileList.tsx +++ b/src/components/organisms/FileList.tsx @@ -2,7 +2,6 @@ import { useAuth0 } from "@auth0/auth0-react"; import { fileProvider } from "@dataware-tools/api-file-provider-client"; import { metaStore } from "@dataware-tools/api-meta-store-client"; import { - alert, API_ROUTE, confirm, ErrorMessage, @@ -203,7 +202,7 @@ export const FileList = ({ window.open(API_ROUTE.FILE.BASE + "/download/" + res.token, "_blank"); }) .catch((e) => { - alert({ title: "Failed to download the file: " + e }); + enqueueErrorToastForFetchError("Failed to download file", e); }); }); }; From dd80afe34ea20cfb84618d5b0378eedd3ef6bd02 Mon Sep 17 00:00:00 2001 From: Yusuke Sakai Date: Wed, 3 Aug 2022 15:37:02 +0900 Subject: [PATCH 8/8] Replace alert to toast for adding file --- src/components/organisms/RecordDetailModal.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/organisms/RecordDetailModal.tsx b/src/components/organisms/RecordDetailModal.tsx index 2d4620c2..c5045766 100644 --- a/src/components/organisms/RecordDetailModal.tsx +++ b/src/components/organisms/RecordDetailModal.tsx @@ -16,8 +16,6 @@ import { DialogTabBarProps, ErrorMessageProps, confirm, - alert, - extractErrorMessageFromFetchError, } from "@dataware-tools/app-common"; import EditIcon from "@mui/icons-material/Edit"; import UploadIcon from "@mui/icons-material/Upload"; @@ -33,6 +31,7 @@ import { } from "components/organisms/RecordEditModal"; import { RecordInfo } from "components/organisms/RecordInfo"; import { + enqueueErrorToastForFetchError, useGetRecord, useListFiles, uploadFileToFileProvider, @@ -234,10 +233,7 @@ export const RecordDetailModal = ({ ); if (createFileError) { - await alert({ - title: "Fail to upload", - body: extractErrorMessageFromFetchError(createFileError).reason, - }); + enqueueErrorToastForFetchError("Failed to upload file", createFileError); setIsAddingFile(false); return; }