From e84d976cbbd6bae7d022f4d97dad985422326032 Mon Sep 17 00:00:00 2001 From: Debora Serra Date: Fri, 20 Dec 2024 16:54:51 -0800 Subject: [PATCH 1/7] fix: change temporary id type --- .../components/Links/Settings/Settings.jsx | 43 +++++++++-------- .../src/scenes/links/LinksDefaultPage.jsx | 48 +++++++++---------- frontend/src/scenes/links/NewLinksPopup.jsx | 35 +++++++------- 3 files changed, 63 insertions(+), 63 deletions(-) diff --git a/frontend/src/components/Links/Settings/Settings.jsx b/frontend/src/components/Links/Settings/Settings.jsx index fa9babcf..0ced8413 100644 --- a/frontend/src/components/Links/Settings/Settings.jsx +++ b/frontend/src/components/Links/Settings/Settings.jsx @@ -38,7 +38,10 @@ const Settings = () => { }; setState(newState); } else { - setState({ ...defaultState, id: Math.floor(Date.now() * Math.random()) }); + setState({ + ...defaultState, + id: Math.floor(Date.now() * Math.random()).toString(), + }); } window.addEventListener("mousedown", handleMouseDown); @@ -78,7 +81,7 @@ const Settings = () => { setLinkToEdit(null); toggleSettings(e); } else { - setLinks((prev) => [...prev, { ...info, id: +info.id }]); + setLinks((prev) => [...prev, { ...info, id: info.id }]); toggleSettings(e); } }; @@ -88,8 +91,8 @@ const Settings = () => { className={s.settings} ref={settingsRef} onSubmit={handleClose} - role="form" - data-testid="settings-form" + role='form' + data-testid='settings-form' >
Add new link @@ -98,37 +101,37 @@ const Settings = () => {
-
- ); }; -export default Settings; \ No newline at end of file +export default Settings; diff --git a/frontend/src/scenes/links/LinksDefaultPage.jsx b/frontend/src/scenes/links/LinksDefaultPage.jsx index 1c1d7276..f5d35603 100644 --- a/frontend/src/scenes/links/LinksDefaultPage.jsx +++ b/frontend/src/scenes/links/LinksDefaultPage.jsx @@ -1,10 +1,10 @@ import React, { useState } from "react"; import { ACTIVITY_TYPES_INFO } from "../../data/guideMainPageData"; -import { deleteHelper, getHelpers} from "../../services/helperLinkService"; +import { deleteHelper, getHelpers } from "../../services/helperLinkService"; import HelperLinkProvider from "../../services/linksProvider"; import DefaultPageTemplate from "../../templates/DefaultPageTemplate/DefaultPageTemplate"; -import NewLinksPopup from "./NewLinksPopup"; import styles from "./LinkPage.module.scss"; +import NewLinksPopup from "./NewLinksPopup"; const LinksDefaultPage = () => { const [itemsUpdated, setItemsUpdated] = useState(false); @@ -16,31 +16,29 @@ const LinksDefaultPage = () => { headerBackgroundColor: helper.headerBackgroundColor, linkFontColor: helper.linkFontColor, iconColor: helper.iconColor, - }) + }); return ( - <> - -
- - -
- - + +
+ + +
+ ); }; -export default LinksDefaultPage; \ No newline at end of file +export default LinksDefaultPage; diff --git a/frontend/src/scenes/links/NewLinksPopup.jsx b/frontend/src/scenes/links/NewLinksPopup.jsx index be5cb9e5..b47fe86f 100644 --- a/frontend/src/scenes/links/NewLinksPopup.jsx +++ b/frontend/src/scenes/links/NewLinksPopup.jsx @@ -7,7 +7,7 @@ import { getHelperById, updateHelper, } from "../../services/helperLinkService"; -import { deleteLink, getLinkById } from "../../services/linkService"; +import { deleteLink } from "../../services/linkService"; import { HelperLinkContext } from "../../services/linksProvider"; import GuideTemplate from "../../templates/GuideTemplate/GuideTemplate"; import { useDialog } from "../../templates/GuideTemplate/GuideTemplateContext"; @@ -17,6 +17,13 @@ import styles from "./LinkPage.module.scss"; import LinkAppearance from "./LinkPageComponents/LinkAppearance"; import LinkContent from "./LinkPageComponents/LinkContent"; +const DEFAULT_VALUES = { + title: "", + headerBackgroundColor: "#F8F9F8", + linkFontColor: "#344054", + iconColor: "#7F56D9", +}; + const NewLinksPopup = ({ autoOpen = false, isEdit, @@ -35,12 +42,6 @@ const NewLinksPopup = ({ setHelperToEdit, } = useContext(HelperLinkContext); - const DEFAULT_VALUES = { - title: "", - headerBackgroundColor: "#F8F9F8", - linkFontColor: "#344054", - iconColor: "#7F56D9", - } const { openDialog, closeDialog, isOpen } = useDialog(); const fetchHelperData = async () => { try { @@ -48,12 +49,11 @@ const NewLinksPopup = ({ setHelper(data); setLinks(links.sort((a, b) => a.order - b.order)); setHelperToEdit(itemId); - } - catch (error) { + } catch (error) { emitToastError(buildToastError(error)); closeDialog(); } - } + }; useEffect(() => { if (autoOpen) { @@ -79,8 +79,8 @@ const NewLinksPopup = ({ msg.response ? msg : { - response: { data: { errors: [{ msg }] } }, - }; + response: { data: { errors: [{ msg }] } }, + }; const handleLinks = async (item) => { const { id, ...link } = item; @@ -89,8 +89,7 @@ const NewLinksPopup = ({ return null; } try { - const exists = await getLinkById(id); - if (exists?.id) return { ...link, id }; + if (typeof id === "number") return item; return { ...link }; } catch (err) { emitToastError(err); @@ -105,7 +104,7 @@ const NewLinksPopup = ({ if (formattedLinks.some((it) => !it)) { return null; } - newHelper = await (helperToEdit + newHelper = await (isEdit ? updateHelper(helper, formattedLinks) : createHelper(helper, formattedLinks)); setHelper(newHelper); @@ -115,7 +114,7 @@ const NewLinksPopup = ({ emitToastError(buildToastError(err)); return null; } - if (helperToEdit && deletedLinks.length) { + if (isEdit && deletedLinks.length) { await Promise.all( deletedLinks.map(async (it) => { try { @@ -128,11 +127,11 @@ const NewLinksPopup = ({ ); } if (newHelper) { - const toastMessage = helper.id + const toastMessage = isEdit ? "You edited this Helper Link" : "New Helper Link saved"; toastEmitter.emit(TOAST_EMITTER_KEY, toastMessage); - setShowNewLinksPopup(false); + closeDialog(); setHelper({}); setLinks([]); setHelperToEdit(null); From a190c9755cea950db0ac2678577be7f1bc90448c Mon Sep 17 00:00:00 2001 From: Debora Serra Date: Fri, 20 Dec 2024 17:12:40 -0800 Subject: [PATCH 2/7] feat: change type of id generation --- frontend/src/components/Links/Settings/Settings.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/Links/Settings/Settings.jsx b/frontend/src/components/Links/Settings/Settings.jsx index 0ced8413..0fc81a62 100644 --- a/frontend/src/components/Links/Settings/Settings.jsx +++ b/frontend/src/components/Links/Settings/Settings.jsx @@ -40,7 +40,7 @@ const Settings = () => { } else { setState({ ...defaultState, - id: Math.floor(Date.now() * Math.random()).toString(), + id: `${Date.now()}-${Math.random().toString(36).substring(2, 11)}`, }); } window.addEventListener("mousedown", handleMouseDown); From b935977d3dda4a2f88aaa32500c3c92cafa6310a Mon Sep 17 00:00:00 2001 From: Debora Serra Date: Sun, 22 Dec 2024 22:57:05 -0800 Subject: [PATCH 3/7] chore: change style import name --- .../components/Links/Settings/Settings.jsx | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/frontend/src/components/Links/Settings/Settings.jsx b/frontend/src/components/Links/Settings/Settings.jsx index 0fc81a62..c9177f73 100644 --- a/frontend/src/components/Links/Settings/Settings.jsx +++ b/frontend/src/components/Links/Settings/Settings.jsx @@ -2,7 +2,7 @@ import CloseOutlinedIcon from "@mui/icons-material/CloseOutlined"; import { useContext, useEffect, useRef, useState } from "react"; import { HelperLinkContext } from "../../../services/linksProvider"; import Switch from "../../Switch/Switch"; -import s from "./Settings.module.scss"; +import style from "./Settings.module.scss"; const defaultState = { title: "", @@ -88,16 +88,16 @@ const Settings = () => { return (
-
- Add new link -
- Auto-saved +
+ Add new link +
+ Auto-saved { />
-
+
-