From 73caa872c9fec8129003b6ed833cbb4cb4c9e24c Mon Sep 17 00:00:00 2001 From: subnub Date: Sun, 21 Jul 2024 06:35:41 -0400 Subject: [PATCH] more toasts and error handling --- src/components/ContextMenu/index.tsx | 3 +- src/components/FileInfoPopup/index.tsx | 4 +- src/components/LoginPage/LoginPage.tsx | 6 +-- src/components/MultiSelectBar/index.tsx | 49 ++++++++++++++++------- src/components/PhotoViewerPopup/index.tsx | 8 ++-- src/components/SharePopup/index.tsx | 10 +++-- src/popups/file.ts | 6 +-- src/styles/styles.scss | 16 ++++++++ 8 files changed, 70 insertions(+), 32 deletions(-) diff --git a/src/components/ContextMenu/index.tsx b/src/components/ContextMenu/index.tsx index 7c6b62e..5d70d90 100644 --- a/src/components/ContextMenu/index.tsx +++ b/src/components/ContextMenu/index.tsx @@ -1,6 +1,5 @@ import classNames from "classnames"; -import React, { memo, useEffect, useRef } from "react"; -import Swal from "sweetalert2"; +import React, { memo } from "react"; import { deleteFileAPI, renameFileAPI, diff --git a/src/components/FileInfoPopup/index.tsx b/src/components/FileInfoPopup/index.tsx index 4cdf093..973339b 100644 --- a/src/components/FileInfoPopup/index.tsx +++ b/src/components/FileInfoPopup/index.tsx @@ -93,14 +93,14 @@ const FileInfoPopup = memo(() => {
diff --git a/src/components/LoginPage/LoginPage.tsx b/src/components/LoginPage/LoginPage.tsx index edb08a8..883c70b 100755 --- a/src/components/LoginPage/LoginPage.tsx +++ b/src/components/LoginPage/LoginPage.tsx @@ -8,7 +8,7 @@ import { capitalize } from "lodash"; import AlertIcon from "../../icons/AlertIcon"; import SpinnerPage from "../SpinnerPage"; import classNames from "classnames"; -import { emailVerificationSentPopup } from "../../popups/user"; +import { toast, ToastContainer } from "react-toastify"; const LoginPage = () => { const [email, setEmail] = useState(""); @@ -34,7 +34,6 @@ const LoginPage = () => { setAttemptingLogin(false); window.localStorage.setItem("hasPreviouslyLoggedIn", "true"); } catch (e) { - console.log("Login Error", e); setAttemptingLogin(false); if (window.localStorage.getItem("hasPreviouslyLoggedIn")) { setError("Login Expired"); @@ -65,7 +64,7 @@ const LoginPage = () => { window.localStorage.setItem("hasPreviouslyLoggedIn", "true"); if (createAccountResponse.emailSent) { - emailVerificationSentPopup(); + toast.success("Email Verification Sent"); } dispatch(setUser(createAccountResponse.user)); @@ -251,6 +250,7 @@ const LoginPage = () => {
+ ); }; diff --git a/src/components/MultiSelectBar/index.tsx b/src/components/MultiSelectBar/index.tsx index bdc3119..4ae5d9e 100644 --- a/src/components/MultiSelectBar/index.tsx +++ b/src/components/MultiSelectBar/index.tsx @@ -17,6 +17,7 @@ import { } from "../../popups/file"; import RestoreIcon from "../../icons/RestoreIcon"; import { useUtils } from "../../hooks/utils"; +import { toast } from "react-toastify"; const MultiSelectBar: React.FC = () => { const dispatch = useAppDispatch(); @@ -66,41 +67,59 @@ const MultiSelectBar: React.FC = () => { }, []); const trashItems = async () => { - const result = await trashItemsPopup(); + try { + const result = await trashItemsPopup(); + if (!result) return; - if (result) { const itemsToTrash = Object.values(multiSelectMap); - await trashMultiAPI(itemsToTrash); + await toast.promise(trashMultiAPI(itemsToTrash), { + pending: "Trashing...", + success: "Trashed", + error: "Error Trashing", + }); invalidateFilesCache(); invalidateFoldersCache(); invalidateQuickFilesCache(); closeMultiSelect(); + } catch (e) { + console.log("Error Trashing Items", e); } }; const deleteItems = async () => { - const result = await deleteItemsPopup(); - if (result) { - const itemsToTrash = Object.values(multiSelectMap); - await deleteMultiAPI(itemsToTrash); + try { + const result = await deleteItemsPopup(); + if (!result) return; + + const itesmsToDelete = Object.values(multiSelectMap); + await toast.promise(deleteMultiAPI(itesmsToDelete), { + pending: "Deleting...", + success: "Deleted", + error: "Error Deleting", + }); invalidateFilesCache(); invalidateFoldersCache(); invalidateQuickFilesCache(); closeMultiSelect(); + } catch (e) { + console.log("Error Deleting Items", e); } }; const restoreItems = async () => { const result = await restoreItemsPopup(); + if (!result) return; - if (result) { - const itemsToTrash = Object.values(multiSelectMap); - await restoreMultiAPI(itemsToTrash); - invalidateFilesCache(); - invalidateFoldersCache(); - invalidateQuickFilesCache(); - closeMultiSelect(); - } + const itemsToRestore = Object.values(multiSelectMap); + await toast.promise(restoreMultiAPI(itemsToRestore), { + pending: "Restoring...", + success: "Restored", + error: "Error Restoring", + }); + invalidateFilesCache(); + invalidateFoldersCache(); + invalidateQuickFilesCache(); + closeMultiSelect(); }; if (!multiSelectMode) return
; diff --git a/src/components/PhotoViewerPopup/index.tsx b/src/components/PhotoViewerPopup/index.tsx index 5cf0c05..a5fdc2d 100644 --- a/src/components/PhotoViewerPopup/index.tsx +++ b/src/components/PhotoViewerPopup/index.tsx @@ -270,14 +270,14 @@ const PhotoViewerPopup = memo(() => {
@@ -286,11 +286,11 @@ const PhotoViewerPopup = memo(() => {
{ const makeOneTimePublic = async () => { try { - const result = await makePublicPopup(); + const result = await makeOneTimePublicPopup(); if (!result) return; setUpdating(true); const { file: updatedFile } = await toast.promise( @@ -179,7 +183,7 @@ const SharePopup = memo(() => {
- +
diff --git a/src/popups/file.ts b/src/popups/file.ts index df23cda..66527c9 100644 --- a/src/popups/file.ts +++ b/src/popups/file.ts @@ -81,7 +81,7 @@ export const trashItemsPopup = async () => { export const makePublicPopup = async () => { const result = await Swal.fire({ title: "Make file public?", - text: "This iwill make the file public, anyone with the link will be able to access the file.", + text: "Anyone with the link will be able to download the file.", icon: "warning", showCancelButton: true, confirmButtonColor: "#3085d6", @@ -93,8 +93,8 @@ export const makePublicPopup = async () => { export const makeOneTimePublicPopup = async () => { const result = await Swal.fire({ - title: "Make file public?", - text: "This iwill make the file public, anyone with the link will be able to access the file for a single time.", + title: "Make file temporarly public?", + text: "Anyone with the link will be able to downoad the file once.", icon: "warning", showCancelButton: true, confirmButtonColor: "#3085d6", diff --git a/src/styles/styles.scss b/src/styles/styles.scss index 6ad8c4c..450aa20 100644 --- a/src/styles/styles.scss +++ b/src/styles/styles.scss @@ -56,3 +56,19 @@ .animate-very-long { transition: 6s ease all; } + +.Toastify__progress-bar--success { + background-color: #3c85ee !important; +} + +.--toastify-color-transparent .Toastify__toast-icon { + background-color: #3c85ee !important; +} + +.Toastify__toast--success .Toastify__icon svg path { + fill: #3c85ee !important; +} + +:root { + --toastify-icon-color-success: #3c85ee !important; +}