feat: Add edit/create/list sight page

src/pages/EditSightPage/index.tsx

@@ -0,0 +1,78 @@
+import { Box, Tab, Tabs } from "@mui/material";
+import { InformationTab, RightWidgetTab } from "@widgets";
+import { LeftWidgetTab } from "@widgets";
+import { useEffect, useState } from "react";
+import { observer } from "mobx-react-lite";
+import { languageStore, sightsStore } from "@shared";
+import { useParams } from "react-router-dom";
+
+function a11yProps(index: number) {
+  return {
+    id: `sight-tab-${index}`,
+    "aria-controls": `sight-tabpanel-${index}`,
+  };
+}
+
+export const EditSightPage = observer(() => {
+  const [value, setValue] = useState(0);
+  const { sight, getSight } = sightsStore;
+  const { language } = languageStore;
+  const { id } = useParams();
+
+  const handleChange = (_: React.SyntheticEvent, newValue: number) => {
+    setValue(newValue);
+  };
+
+  useEffect(() => {
+    const fetchData = async () => {
+      if (id) {
+        await getSight(Number(id));
+      }
+    };
+    fetchData();
+  }, [id, language]);
+
+  return (
+    <Box
+      sx={{
+        width: "100%",
+        display: "flex",
+        flexDirection: "column",
+        minHeight: "100vh",
+      }}
+    >
+      <Box
+        sx={{
+          borderBottom: 1,
+          borderColor: "divider",
+          display: "flex",
+          justifyContent: "center",
+        }}
+      >
+        <Tabs
+          value={value}
+          onChange={handleChange}
+          aria-label="sight tabs"
+          sx={{
+            width: "100%",
+            "& .MuiTabs-flexContainer": {
+              justifyContent: "center",
+            },
+          }}
+        >
+          <Tab sx={{ flex: 1 }} label="Общая информация" {...a11yProps(0)} />
+          <Tab sx={{ flex: 1 }} label="Левый виджет" {...a11yProps(1)} />
+          <Tab sx={{ flex: 1 }} label="Правый виджет" {...a11yProps(2)} />
+        </Tabs>
+      </Box>
+
+      {sight && (
+        <div className="flex-1">
+          <InformationTab value={value} index={0} />
+          <LeftWidgetTab data={sight} value={value} index={1} />
+          <RightWidgetTab data={sight} value={value} index={2} />
+        </div>
+      )}
+    </Box>
+  );
+});