feat: Refactor old code with delete modal and icons for buttons

src/pages/EditSightPage/index.tsx

@@ -1,5 +1,5 @@
 import { Box, Tab, Tabs } from "@mui/material";
-import { InformationTab, RightWidgetTab } from "@widgets";
+import { InformationTab, LeaveAgree, RightWidgetTab } from "@widgets";
 import { LeftWidgetTab } from "@widgets";
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react-lite";
@@ -9,7 +9,7 @@ import {
   editSightStore,
   languageStore,
 } from "@shared";
-import { useParams } from "react-router-dom";
+import { useBlocker, useParams } from "react-router-dom";
 
 function a11yProps(index: number) {
   return {
@@ -26,6 +26,11 @@ export const EditSightPage = observer(() => {
   const { id } = useParams();
   const { getCities } = cityStore;
 
+  let blocker = useBlocker(
+    ({ currentLocation, nextLocation }) =>
+      true && currentLocation.pathname !== nextLocation.pathname
+  );
+
   const handleChange = (_: React.SyntheticEvent, newValue: number) => {
     setValue(newValue);
   };
@@ -82,6 +87,8 @@ export const EditSightPage = observer(() => {
           <RightWidgetTab value={value} index={2} />
         </div>
       )}
+
+      {blocker.state === "blocked" ? <LeaveAgree blocker={blocker} /> : null}
     </Box>
   );
 });