diff --git a/frontend/src/components/Review/Review.tsx b/frontend/src/components/Review/Review.tsx index b83b0d73..567946b0 100644 --- a/frontend/src/components/Review/Review.tsx +++ b/frontend/src/components/Review/Review.tsx @@ -53,7 +53,8 @@ type Props = { readonly addLike: (reviewId: string) => Promise; readonly removeLike: (reviewId: string) => Promise; setToggle: React.Dispatch>; - readonly triggerEditToast?: () => void; + readonly triggerEditToast: () => void; + readonly triggerDeleteToast: () => void; user: firebase.User | null; setUser: React.Dispatch>; readonly showLabel: boolean; @@ -175,7 +176,8 @@ const useStyles = makeStyles(() => ({ * @param {function} props.addLike - Function to add a like to the review. * @param {function} props.removeLike - Function to remove a like from the review. * @param {React.Dispatch>} props.setToggle - Function to toggle a state. - * @param {function} [props.triggerEditToast] - Optional function to trigger a toast notification on edit. + * @param {function} props.triggerEditToast - function to trigger a toast notification on edit. + * @param {function} props.triggerDeleteToast - function to trigger a toast notification on delete. * @param {firebase.User | null} props.user - The current logged-in user. * @param {React.Dispatch>} props.setUser - Function to set the current user. * @param {boolean} props.showLabel - Indicates if the property or landlord label should be shown. @@ -189,6 +191,7 @@ const ReviewComponent = ({ removeLike, setToggle, triggerEditToast, + triggerDeleteToast, user, setUser, showLabel, @@ -363,6 +366,7 @@ const ReviewComponent = ({ let user = await getUser(true); setUser(user); } + if (triggerDeleteToast) triggerDeleteToast(); } setDeleteModalOpen(false); }; diff --git a/frontend/src/pages/ApartmentPage.tsx b/frontend/src/pages/ApartmentPage.tsx index 02eab58a..571262b2 100644 --- a/frontend/src/pages/ApartmentPage.tsx +++ b/frontend/src/pages/ApartmentPage.tsx @@ -133,6 +133,7 @@ const ApartmentPage = ({ user, setUser }: Props): ReactElement => { const [carouselOpen, setCarouselOpen] = useState(false); const [showConfirmation, setShowConfirmation] = useState(false); const [showEditSuccessConfirmation, setShowEditSuccessConfirmation] = useState(false); + const [showDeleteSuccessConfirmation, setShowDeleteSuccessConfirmation] = useState(false); const [buildings, setBuildings] = useState([]); const [aptData, setAptData] = useState([]); const [apt, setApt] = useState(undefined); @@ -307,6 +308,10 @@ const ApartmentPage = ({ user, setUser }: Props): ReactElement => { showToast(setShowEditSuccessConfirmation); }; + const showDeleteSuccessConfirmationToast = () => { + showToast(setShowDeleteSuccessConfirmation); + }; + const likeHelper = (dislike = false) => { return async (reviewId: string) => { setLikeStatuses((reviews) => ({ ...reviews, [reviewId]: true })); @@ -666,7 +671,14 @@ const ApartmentPage = ({ user, setUser }: Props): ReactElement => { time={toastTime} /> )} - + {showDeleteSuccessConfirmation && ( + + )} { removeLike={removeLike} setToggle={setToggle} triggerEditToast={showEditSuccessConfirmationToast} + triggerDeleteToast={showDeleteSuccessConfirmationToast} user={user} setUser={setUser} /> diff --git a/frontend/src/pages/BookmarksPage.tsx b/frontend/src/pages/BookmarksPage.tsx index 56407436..43f37cc6 100644 --- a/frontend/src/pages/BookmarksPage.tsx +++ b/frontend/src/pages/BookmarksPage.tsx @@ -108,6 +108,7 @@ const BookmarksPage = ({ user, setUser }: Props): ReactElement => { const [showMoreLessState, setShowMoreLessState] = useState('Show More'); const [isMobile, setIsMobile] = useState(false); const [showEditSuccessConfirmation, setShowEditSuccessConfirmation] = useState(false); + const [showDeleteSuccessConfirmation, setShowDeleteSuccessConfirmation] = useState(false); useEffect(() => { const handleResize = () => setIsMobile(window.innerWidth <= 600); @@ -169,6 +170,9 @@ const BookmarksPage = ({ user, setUser }: Props): ReactElement => { const showEditSuccessConfirmationToast = () => { showToast(setShowEditSuccessConfirmation); }; + const showDeleteSuccessConfirmationToast = () => { + showToast(setShowDeleteSuccessConfirmation); + }; // Function to handle liking or disliking a review const likeHelper = (dislike = false) => { @@ -213,6 +217,14 @@ const BookmarksPage = ({ user, setUser }: Props): ReactElement => { time={toastTime} /> )} + {showDeleteSuccessConfirmation && ( + + )} { removeLike={removeLike} setToggle={setToggle} triggerEditToast={showEditSuccessConfirmationToast} + triggerDeleteToast={showDeleteSuccessConfirmationToast} user={user} setUser={setUser} showLabel={true} diff --git a/frontend/src/pages/LandlordPage.tsx b/frontend/src/pages/LandlordPage.tsx index 54716f12..8dff19b0 100644 --- a/frontend/src/pages/LandlordPage.tsx +++ b/frontend/src/pages/LandlordPage.tsx @@ -95,6 +95,7 @@ const LandlordPage = ({ user, setUser }: Props): ReactElement => { const [carouselOpen, setCarouselOpen] = useState(false); const [showConfirmation, setShowConfirmation] = useState(false); const [showEditSuccessConfirmation, setShowEditSuccessConfirmation] = useState(false); + const [showDeleteSuccessConfirmation, setShowDeleteSuccessConfirmation] = useState(false); const [buildings, setBuildings] = useState([]); const [loaded, setLoaded] = useState(false); const [showSignInError, setShowSignInError] = useState(false); @@ -223,6 +224,9 @@ const LandlordPage = ({ user, setUser }: Props): ReactElement => { const showEditSuccessConfirmationToast = () => { showToast(setShowEditSuccessConfirmation); }; + const showDeleteSuccessConfirmationToast = () => { + showToast(setShowDeleteSuccessConfirmation); + }; // Function to handle liking or disliking a review const likeHelper = (dislike = false) => { @@ -534,6 +538,14 @@ const LandlordPage = ({ user, setUser }: Props): ReactElement => { time={toastTime} /> )} + {showDeleteSuccessConfirmation && ( + + )} {sortReviews(reviewData, sortBy) @@ -549,6 +561,7 @@ const LandlordPage = ({ user, setUser }: Props): ReactElement => { removeLike={removeLike} setToggle={setToggle} triggerEditToast={showEditSuccessConfirmationToast} + triggerDeleteToast={showDeleteSuccessConfirmationToast} user={user} setUser={setUser} showLabel={true} diff --git a/frontend/src/pages/ProfilePage.tsx b/frontend/src/pages/ProfilePage.tsx index 7260f48e..b02e7e53 100644 --- a/frontend/src/pages/ProfilePage.tsx +++ b/frontend/src/pages/ProfilePage.tsx @@ -165,6 +165,7 @@ const ProfilePage = ({ user, setUser }: Props): ReactElement => { const [likeStatuses, setLikeStatuses] = useState({}); const [toggle, setToggle] = useState(false); const [showEditSuccessConfirmation, setShowEditSuccessConfirmation] = useState(false); + const [showDeleteSuccessConfirmation, setShowDeleteSuccessConfirmation] = useState(false); const toastTime = 3500; useTitle('Profile'); @@ -241,6 +242,10 @@ const ProfilePage = ({ user, setUser }: Props): ReactElement => { showToast(setShowEditSuccessConfirmation); }; + const showDeleteSuccessConfirmationToast = () => { + showToast(setShowDeleteSuccessConfirmation); + }; + /** This closes the modal (who can view my profile) when modal is open and user clicks out **/ useEffect(() => { const handleClickOutside = (event: MouseEvent) => { @@ -268,6 +273,14 @@ const ProfilePage = ({ user, setUser }: Props): ReactElement => { time={toastTime} /> )} + {showDeleteSuccessConfirmation && ( + + )}

My Profile

@@ -324,6 +337,7 @@ const ProfilePage = ({ user, setUser }: Props): ReactElement => { removeLike={removeLike} setToggle={setToggle} triggerEditToast={showEditSuccessConfirmationToast} + triggerDeleteToast={showDeleteSuccessConfirmationToast} user={user} setUser={setUser} showLabel={true} @@ -345,6 +359,7 @@ const ProfilePage = ({ user, setUser }: Props): ReactElement => { removeLike={removeLike} setToggle={setToggle} triggerEditToast={showEditSuccessConfirmationToast} + triggerDeleteToast={showDeleteSuccessConfirmationToast} user={user} setUser={setUser} showLabel={true}