From 70ccd5f71ab7e3fa289ef4986ec809698b22a3e6 Mon Sep 17 00:00:00 2001 From: cjenkscybercom Date: Wed, 12 Jun 2024 11:52:35 +0200 Subject: [PATCH 1/2] CSSTUDIO-2461: fix fail to redirect on create, edit, reply --- src/beta/components/search/SearchResults.js | 6 ++--- .../LogDetails/LogEntryGroupView.js | 4 ++-- .../LogDetails/NavigationButtons.js | 4 ++-- src/components/log/CreateLog/CreateLog.js | 22 ++++++++----------- src/components/log/EditLog/EditLog.js | 20 +++++++---------- src/components/log/ReplyLog/ReplyLog.js | 20 +++++++---------- src/hooks/useBetaNavigate.js | 21 ++++++++++++++++++ 7 files changed, 53 insertions(+), 44 deletions(-) create mode 100644 src/hooks/useBetaNavigate.js diff --git a/src/beta/components/search/SearchResults.js b/src/beta/components/search/SearchResults.js index 78dd5d9..c350735 100644 --- a/src/beta/components/search/SearchResults.js +++ b/src/beta/components/search/SearchResults.js @@ -6,7 +6,6 @@ import { updateSearchPageParams, useSearchPageParams } from "features/searchPage import { updateSearchParams, useSearchParams } from "features/searchParamsReducer"; import React, { useEffect, useMemo, useState } from "react"; import { useDispatch } from "react-redux"; -import { useNavigate } from "react-router-dom"; import SearchResultList from "./SearchResultList"; import SimpleSearch from "./SimpleSearch"; import { SortToggleButton } from "./SortToggleButton"; @@ -15,11 +14,12 @@ import { SearchParamsBadges } from "./SearchParamsBadges"; import { AdvancedSearchDrawer } from "./SearchResultList/AdvancedSearchDrawer"; import { useAdvancedSearch } from "features/advancedSearchReducer"; import { withCacheBust } from "hooks/useSanitizedSearchParams"; +import useBetaNavigate from "hooks/useBetaNavigate"; export const SearchResults = styled(({className}) => { const dispatch = useDispatch(); - const navigate = useNavigate(); + const navigate = useBetaNavigate(); const { active: advancedSearchActive, fieldCount: advancedSearchFieldCount } = useAdvancedSearch(); const currentLogEntry = useCurrentLogEntry(); @@ -88,7 +88,7 @@ export const SearchResults = styled(({className}) => { const onRowClick = (log) => { dispatch(updateCurrentLogEntry(log)); - navigate(`/beta/logs/${log.id}`); + navigate(`/logs/${log.id}`); } const onPageChange = (event, page) => { diff --git a/src/components/LogDetails/LogEntryGroupView.js b/src/components/LogDetails/LogEntryGroupView.js index 985e4e7..86ae558 100644 --- a/src/components/LogDetails/LogEntryGroupView.js +++ b/src/components/LogDetails/LogEntryGroupView.js @@ -20,13 +20,13 @@ import React, { useEffect } from 'react'; import { useDispatch } from 'react-redux'; import { updateCurrentLogEntry } from 'features/currentLogEntryReducer'; import GroupHeader from './GroupHeader'; -import { useNavigate } from 'react-router-dom'; import CommonmarkPreview from 'components/shared/CommonmarkPreview'; import customization from 'config/customization'; import { getLogEntryGroupId } from '../Properties/utils'; import { sortByCreatedDate } from 'components/log/sort'; import { ologApi } from 'api/ologApi'; import { styled } from '@mui/material'; +import useBetaNavigate from 'hooks/useBetaNavigate'; const Container = styled("div")` display: flex; @@ -55,7 +55,7 @@ const GroupContainer = styled("li")` const LogEntryGroupView = ({currentLogEntry, logGroupRecords, setLogGroupRecords, className}) => { const dispatch = useDispatch(); - const navigate = useNavigate(); + const navigate = useBetaNavigate(); const [ getLogGroup ] = ologApi.endpoints.getLogGroup.useLazyQuery(); useEffect(() => { diff --git a/src/components/LogDetails/NavigationButtons.js b/src/components/LogDetails/NavigationButtons.js index 1afc4d7..5008d9a 100644 --- a/src/components/LogDetails/NavigationButtons.js +++ b/src/components/LogDetails/NavigationButtons.js @@ -18,10 +18,10 @@ import { useState, useEffect } from 'react'; import ArrowBackIcon from '@mui/icons-material/ArrowBack'; import ArrowForwardIcon from '@mui/icons-material/ArrowForward'; -import { useNavigate } from 'react-router-dom'; import { useDispatch } from 'react-redux'; import { updateCurrentLogEntry } from 'features/currentLogEntryReducer'; import { Button, Stack } from '@mui/material'; +import useBetaNavigate from 'hooks/useBetaNavigate'; const NavigationButtons = ({ currentLogEntry, @@ -29,7 +29,7 @@ const NavigationButtons = ({ ...props }) => { - const navigate = useNavigate(); + const navigate = useBetaNavigate(); const dispatch = useDispatch(); const [previousLogEntry, setPreviousLogEntry] = useState(); const [nextLogEntry, setNextLogEntry] = useState(); diff --git a/src/components/log/CreateLog/CreateLog.js b/src/components/log/CreateLog/CreateLog.js index d704a31..7af99ef 100644 --- a/src/components/log/CreateLog/CreateLog.js +++ b/src/components/log/CreateLog/CreateLog.js @@ -2,16 +2,15 @@ import React, { useState } from "react"; import { useForm } from "react-hook-form"; import EntryEditor from "../EntryEditor"; import useFormPersist from "react-hook-form-persist"; -import { useLocation, useNavigate } from "react-router-dom"; import { ologApi, useVerifyLogExists } from "api/ologApi"; import { Backdrop, CircularProgress } from "@mui/material"; +import useBetaNavigate from "hooks/useBetaNavigate"; const CreateLog = ({isAuthenticated}) => { const [createInProgress, setCreateInProgress] = useState(false); const [createLog] = ologApi.endpoints.createLog.useMutation(); const verifyLogExists = useVerifyLogExists(); - const location = useLocation(); const form = useForm({ defaultValues: { @@ -19,7 +18,7 @@ const CreateLog = ({isAuthenticated}) => { } }); const { watch, setValue } = form; - const navigate = useNavigate(); + const navigate = useBetaNavigate(); /** * Save/restore form data @@ -52,17 +51,14 @@ const CreateLog = ({isAuthenticated}) => { // Create log const data = await createLog({log: body}).unwrap(); try { - // Verify it is fully indexed/created before redirecting - await verifyLogExists({logRequest: formData, logResult: data}); - clearFormData(); - setCreateInProgress(false); - if(location.pathname.startsWith("/beta")) { - navigate(`/beta/logs/${data.id}`); - } else { - navigate(`/logs/${data.id}`); - } + // Verify it is fully indexed/created before redirecting + await verifyLogExists({logRequest: formData, logResult: data}); + clearFormData(); + setCreateInProgress(false); } catch (error) { - console.error("An error occured while checking log was created", error); + console.error("An error occured while checking log was created", error); + } finally { + navigate(`/logs/${data.id}`); } } catch (error) { if(error.response && (error.response.status === 401 || error.response.status === 403)){ diff --git a/src/components/log/EditLog/EditLog.js b/src/components/log/EditLog/EditLog.js index 78ea8d8..8f962b3 100644 --- a/src/components/log/EditLog/EditLog.js +++ b/src/components/log/EditLog/EditLog.js @@ -2,16 +2,15 @@ import React, { useState } from "react"; import { useForm } from "react-hook-form"; import EntryEditor from "../EntryEditor"; import { ologApi, useVerifyLogExists } from "api/ologApi"; -import { useLocation, useNavigate } from "react-router-dom"; import { Backdrop, CircularProgress } from "@mui/material"; +import useBetaNavigate from "hooks/useBetaNavigate"; const EditLog = ({log, isAuthenticated}) => { const [editInProgress, setEditInProgress] = useState(false); const [editLog] = ologApi.endpoints.editLog.useMutation(); const verifyLogExists = useVerifyLogExists(); - const navigate = useNavigate(); - const location = useLocation(); + const navigate = useBetaNavigate(); const existingLogGroup = log?.properties?.filter(it => it.name === "Log Entry Group")?.at(0)?.value; @@ -54,16 +53,13 @@ const EditLog = ({log, isAuthenticated}) => { // Edit the log const data = await editLog({log: body}).unwrap(); try { - // Verify full edited/available - await verifyLogExists({logRequest: formData, logResult: data}); - setEditInProgress(false); - if(location.pathname.startsWith("/beta")) { - navigate(`/beta/logs/${data.id}`); - } else { - navigate(`/logs/${data.id}`); - } + // Verify full edited/available + await verifyLogExists({logRequest: formData, logResult: data}); + setEditInProgress(false); } catch (error) { - console.error("An error occured while checking log was edited", error); + console.error("An error occured while checking log was edited", error); + } finally { + navigate(`/logs/${data.id}`); } } catch (error) { if(error.response && (error.response.status === 401 || error.response.status === 403)){ diff --git a/src/components/log/ReplyLog/ReplyLog.js b/src/components/log/ReplyLog/ReplyLog.js index 8accafd..e6b543d 100644 --- a/src/components/log/ReplyLog/ReplyLog.js +++ b/src/components/log/ReplyLog/ReplyLog.js @@ -3,16 +3,15 @@ import { useForm } from "react-hook-form"; import EntryEditor from "../EntryEditor"; import customization from "config/customization"; import { ologApi, useVerifyLogExists } from "api/ologApi"; -import { useLocation, useNavigate } from "react-router-dom"; import { Backdrop, CircularProgress } from "@mui/material"; +import useBetaNavigate from "hooks/useBetaNavigate"; const ReplyLog = ({log, isAuthenticated}) => { const [replyInProgress, setReplyInProgress] = useState(false); const [createLog] = ologApi.endpoints.createLog.useMutation(); const verifyLogExists = useVerifyLogExists(); - const navigate = useNavigate(); - const location = useLocation(); + const navigate = useBetaNavigate(); const form = useForm({ defaultValues: { @@ -52,16 +51,13 @@ const ReplyLog = ({log, isAuthenticated}) => { // create (reply to) the log const data = await createLog({log: body, replyTo: log.id}).unwrap(); try { - // verify log fully created before redirecting - await verifyLogExists({logRequest: formData, logResult: data}); - setReplyInProgress(false); - if(location.pathname.startsWith("/beta")) { - navigate(`/beta/logs/${data.id}`); - } else { - navigate(`/logs/${data.id}`); - } + // verify log fully created before redirecting + await verifyLogExists({logRequest: formData, logResult: data}); + setReplyInProgress(false); } catch (error) { - console.error("An error occured while checking log was created", error); + console.error("An error occured while checking log was created", error); + } finally { + navigate(`/logs/${data.id}`); } } catch (error) { if(error.response && (error.response.status === 401 || error.response.status === 403)){ diff --git a/src/hooks/useBetaNavigate.js b/src/hooks/useBetaNavigate.js new file mode 100644 index 0000000..f539715 --- /dev/null +++ b/src/hooks/useBetaNavigate.js @@ -0,0 +1,21 @@ +import { useCallback } from "react"; + +const { useLocation, useNavigate } = require("react-router-dom"); + +const useBetaNavigate = () => { + + const navigate = useNavigate(); + const location = useLocation(); + + return useCallback((path) => { + + if(location.pathname.startsWith("/beta")) { + return navigate(`/beta${path}`); + } else { + return navigate(`${path}`); + } + + }, [location, navigate]); +} + +export default useBetaNavigate; \ No newline at end of file From abd4e3cf8979105a5f39d58e77c600991a4265e7 Mon Sep 17 00:00:00 2001 From: cjenkscybercom Date: Wed, 12 Jun 2024 15:20:08 +0200 Subject: [PATCH 2/2] CSSTUDIO-2461: fix verification to query title literally --- src/api/ologApi.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/api/ologApi.js b/src/api/ologApi.js index 762e9f3..8c3b5d3 100644 --- a/src/api/ologApi.js +++ b/src/api/ologApi.js @@ -206,7 +206,7 @@ export const useVerifyLogExists = () => { return useCallback(async ({logRequest, logResult}) => { return withRetry({ - fcn: async () => searchLogs({title: logResult.title, end: "now"}).unwrap(), + fcn: async () => searchLogs({title: `"${logResult.title}"`, end: "now"}).unwrap(), retries: 5, retryCondition: (retryRes) => { // Retry if the entry we created isn't in the search results yet