diff --git a/src/api/poi/index.ts b/src/api/poi/index.ts index 34b9af87..303b3765 100644 --- a/src/api/poi/index.ts +++ b/src/api/poi/index.ts @@ -77,6 +77,35 @@ const poiApiSlice = apiSlice.injectEndpoints({ }, providesTags: ["Poi"], }), + getSelectedPois: builder.query({ + queryFn: async (ids) => { + if (!ids || ids.length === 0) { + return { data: [] }; + } + + const poiPromises = ids.map((id) => + getDoc(doc(firestore, firestoreConfig.collection.poi, id)).then( + (snapshot) => { + if (snapshot.exists()) { + const data = snapshot.data() as FirestorePoiData; + return { + id: snapshot.id, + data: toPoiDataByFirebasePoiData(data), + } as Poi; + } + return null; + }, + ), + ); + + const pois = (await Promise.all(poiPromises)).filter( + (poi): poi is Poi => poi !== null, + ) as Poi[]; + + return { data: pois }; + }, + providesTags: ["Poi"], + }), addPoi: builder.mutation({ queryFn: async (arg) => { const uploadPromises = arg.data.photoPaths.map((url) => @@ -137,6 +166,8 @@ export const { useLazyGetPoisQuery, useGetPoiQuery, useLazyGetPoiQuery, + useGetSelectedPoisQuery, + useLazyGetSelectedPoisQuery, useAddPoiMutation, useUpdatePoiMutation, useDeletePoiMutation, diff --git a/src/components/Drawer/EditReportDrawer/index.tsx b/src/components/Drawer/EditReportDrawer/index.tsx index fd2b09bb..d61d9944 100644 --- a/src/components/Drawer/EditReportDrawer/index.tsx +++ b/src/components/Drawer/EditReportDrawer/index.tsx @@ -13,9 +13,6 @@ import EditReportDrawerContent from "./EditReportDrawerContent"; import EditReportDrawerConfirm from "./EditReportDrawerConfirm"; import { closeModal, openModal } from "../../../store/modal"; import { PoiData } from "../../../models/poi"; -import { isCurrentDrawerParams } from "../../../utils/routes/params"; -import { useSearchParams } from "react-router-dom"; -import { toggleRefetchFlag } from "../../../store/llm"; const reportDataValidator = (reportData: PoiData) => { const { status } = reportData; @@ -34,16 +31,12 @@ const EditReportDrawer: React.FC = () => { const dispatch = useDispatch(); - const [searchParams] = useSearchParams(); - const [editPoi] = useUpdatePoiMutation(); const selected = reportType === "edit"; const { data: user } = useGetUserQuery(); - const recommendState = isCurrentDrawerParams("recommend", searchParams); - const [isStatusValueValid, setIsStatusValueValid] = React.useState(false); React.useEffect(() => { setIsStatusValueValid(reportDataValidator(reportData)); @@ -62,9 +55,6 @@ const EditReportDrawer: React.FC = () => { }) .unwrap() .then(() => { - if (recommendState) { - dispatch(toggleRefetchFlag()); - } dispatch(resetReport()); dispatch(closeModal("confirmEditReport")); }); diff --git a/src/components/modal/LlmResult/index.tsx b/src/components/modal/LlmResult/index.tsx index 1adb699b..a45a065d 100644 --- a/src/components/modal/LlmResult/index.tsx +++ b/src/components/modal/LlmResult/index.tsx @@ -19,8 +19,8 @@ import { import { useSearchParams } from "react-router-dom"; import { useGetUserQuery } from "../../../api/user"; import { addReport, editReport } from "../../../store/report"; -import { useCallback, useEffect, useState } from "react"; -import { useLazyGetPoiQuery } from "../../../api/poi"; +import { useEffect, useState } from "react"; +import { useGetSelectedPoisQuery } from "../../../api/poi"; import Poi, { PoiData } from "../../../models/poi"; import { useTranslation } from "react-i18next"; import React from "react"; @@ -198,7 +198,6 @@ const LlmResult: React.FC = () => { const [searchParams, setSearchParams] = useSearchParams(); const clusterId = getParamsFromDrawer("cluster", searchParams).clusterId; const { data: user } = useGetUserQuery(); - const [getPoi] = useLazyGetPoiQuery(); const { t } = useTranslation(); @@ -210,41 +209,25 @@ const LlmResult: React.FC = () => { (state: IRootState) => state.llm.recommendContributions, ); - const refetchFlag = useSelector((state: IRootState) => state.llm.refetchFlag); - const [recommendPois, setRecommendPois] = useState([]); - const fetchData = useCallback( - async (recommendContributions: string[]) => { - await new Promise((resolve) => setTimeout(resolve, 500)); - - const tasks = recommendContributions.map(async (contribution) => { - return getPoi(contribution) - .unwrap() - .then((res) => { - if (res === null) throw new Error("No recommend poi found."); - else { - return res; - } - }); - }); - const res = await Promise.all(tasks); - return res; - }, - [getPoi], - ); + const { data: selectedPoiList, isLoading: isPoiListLoading } = + useGetSelectedPoisQuery(recommendContributions, { + skip: recommendContributions.length === 0, + }); useEffect(() => { - fetchData(recommendContributions).then((res) => { - setRecommendPois(res); - }); - }, [fetchData, recommendContributions, refetchFlag]); + if (!isPoiListLoading && selectedPoiList && selectedPoiList.length > 0) { + setRecommendPois(selectedPoiList); + } + }, [selectedPoiList, isPoiListLoading]); const dispatch = useDispatch(); const handleCloseModal = () => { // will also clear recommendPois dispatch(setRecommendContributions([])); + setRecommendPois([]); setupDrawerParams<"cluster">({ clusterId }, searchParams, setSearchParams); dispatch(closeModal("llmResult")); }; diff --git a/src/store/llm/index.ts b/src/store/llm/index.ts index 64731ef2..e24f2624 100644 --- a/src/store/llm/index.ts +++ b/src/store/llm/index.ts @@ -2,13 +2,11 @@ import { PayloadAction, createSlice } from "@reduxjs/toolkit"; interface RecommendState { recommendContributions: string[]; - refetchFlag: boolean; errorMessage: string; } const initialState: RecommendState = { recommendContributions: [], - refetchFlag: false, errorMessage: "", }; @@ -19,16 +17,13 @@ const recommendSlice = createSlice({ setRecommendContributions: (state, action: PayloadAction) => { state.recommendContributions = action.payload; }, - toggleRefetchFlag: (state) => { - state.refetchFlag = !state.refetchFlag; - }, setErrorMessage: (state, action: PayloadAction) => { state.errorMessage = action.payload; }, }, }); -export const { setRecommendContributions, toggleRefetchFlag, setErrorMessage } = +export const { setRecommendContributions, setErrorMessage } = recommendSlice.actions; export default recommendSlice.reducer;