Fix point duplicates in second stage table

src/Map/Popup/mode-popup/ApproveWorkingPointPopup.jsx

@@ -18,6 +18,7 @@ export const ApproveWorkingPointPopup = ({ feature }) => {
   const { mutate: updateStatus } = useUpdateStatus({
     onSuccess: () => {
       queryClient.invalidateQueries(["approve-working-points"]);
+      queryClient.invalidateQueries(["clicked-point", featureId]);
     },
   });
 

src/modules/Table/InitialTable/columns.js

@@ -1,6 +1,12 @@
 import { STATUS_LABEL_MAPPER } from "../../../config";
 
 export const columns = [
+  {
+    title: "Id",
+    dataIndex: "id",
+    key: "id",
+    width: 50,
+  },
   {
     title: "Адрес",
     dataIndex: "address",

src/modules/Table/useGetClickedPoint.js

@@ -8,6 +8,7 @@ export const useGetClickedPoint = (enabled, onSuccess) => {
   const { data, isInitialLoading, isFetching } = useQuery(
     ["clicked-point", clickedPointConfig?.id],
     async () => {
+      console.log("fetch", clickedPointConfig?.id);
       const params = new URLSearchParams({
         "location_ids[]": [clickedPointConfig.id],
       });

src/modules/Table/useMergeTableData.js

@@ -1,11 +1,13 @@
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { PAGE_SIZE } from "./constants";
 import { useClickedPointConfig } from "../../stores/useClickedPointConfig";
 import { useGetClickedPoint } from "./useGetClickedPoint";
+import { useQueryClient } from "@tanstack/react-query";
 
 export const useMergeTableData = (fullData, onPageSizeChange) => {
   const [mergedData, setMergedData] = useState();
   const [shouldLoadClickedPoint, setShouldLoadClickedPoint] = useState(false);
+  const lastClickedPointId = useRef();
 
   const { data: clickedPointData, isLoading: isClickedPointLoading } =
     useGetClickedPoint(shouldLoadClickedPoint, () =>
@@ -14,6 +16,8 @@ export const useMergeTableData = (fullData, onPageSizeChange) => {
 
   const { clickedPointConfig } = useClickedPointConfig();
 
+  const queryClient = useQueryClient();
+
   useEffect(() => {
     if (!fullData) return;
 
@@ -39,6 +43,8 @@ export const useMergeTableData = (fullData, onPageSizeChange) => {
   useEffect(() => {
     if (!clickedPointData) return;
 
+    lastClickedPointId.current = clickedPointData.results[0].id;
+
     onPageSizeChange((prevState) => prevState + 1);
     setMergedData((prevState) => {
       if (prevState) {
@@ -54,6 +60,8 @@ export const useMergeTableData = (fullData, onPageSizeChange) => {
   // reset data after popup disappeared
   useEffect(() => {
     if (clickedPointConfig === null) {
+      const queryKey = ["clicked-point", lastClickedPointId.current];
+      queryClient.removeQueries({ queryKey });
       onPageSizeChange(PAGE_SIZE);
       setMergedData(fullData);
     }