feat: Add service_name for article list

fix: Fix station create page
fix: Try to fix dockerfile
2025-05-26 17:24:04 +03:00 · 2025-05-25 23:16:33 +03:00 · 2025-05-25 20:20:09 +03:00 · 2025-05-25 20:10:23 +03:00 · 2025-05-25 19:43:38 +03:00 · 2025-05-21 18:31:19 +03:00
35 changed files with 1185 additions and 1867 deletions
--- a/index.html
+++ b/index.html
@ -2,7 +2,7 @@
 <html lang="en">
  <head>
    <meta charset="utf-8" />
-    <link rel="icon" type="image/png" href="/favicon_ship.png" />
+    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
@ -19,7 +19,9 @@
      name="twitter:image"
      content="https://refine.dev/img/refine_social.png"
    />
-    <title>Белые ночи</title>
+    <title>
+      Белые ночи
+    </title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/favicon_ship.png
+++ b/public/favicon_ship.png
--- a/src/components/LinkedItems.tsx
+++ b/src/components/LinkedItems.tsx
@ -70,7 +70,6 @@ type LinkedItemsProps<T> = {
  disableCreation?: boolean;
  updatedLinkedItems?: T[];
  refresh?: number;
-  cityId?: number;
 };

 const reorder = (list: any[], startIndex: number, endIndex: number) => {
@ -132,7 +131,6 @@ export const LinkedItemsContents = <
  disableCreation = false,
  updatedLinkedItems,
  refresh,
-  cityId,
 }: LinkedItemsProps<T>) => {
  const { language } = languageStore;
  const { setArticleModalOpenAction, setArticleIdAction } = articleStore;
@ -218,7 +216,7 @@ export const LinkedItemsContents = <
  useEffect(() => {
    if (type === "edit") {
      axiosInstance
-        .get(`${import.meta.env.VITE_KRBL_API}/${childResource}/`, {})
+        .get(`${import.meta.env.VITE_KRBL_API}/${childResource}/`)
        .then((response) => {
          setItems(response?.data || []);
          setIsLoading(false);
@ -447,7 +445,7 @@ export const LinkedItemsContents = <
              availableItems?.find((item) => item.id === selectedItemId) || null
            }
            onChange={(_, newValue) => setSelectedItemId(newValue?.id || null)}
-            options={availableItems.filter((item) => item.city_id == cityId)}
+            options={availableItems}
            getOptionLabel={(item) => String(item[fields[0].data])}
            renderInput={(params) => (
              <TextField {...params} label={`Выберите ${title}`} fullWidth />
@ -458,7 +456,6 @@ export const LinkedItemsContents = <
                .toLowerCase()
                .split(" ")
                .filter((word) => word.length > 0);
-
              return options.filter((option) => {
                const optionWords = String(option[fields[0].data])
                  .toLowerCase()
--- a/src/components/header/index.tsx
+++ b/src/components/header/index.tsx
@ -143,17 +143,8 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = observer(
              justifyContent="flex-end"
              alignItems="center"
              spacing={2}
-              color="white"
-              sx={{
-                "& .MuiSelect-select": {
-                  color: "white",
-                },
-              }}
            >
-              <FormControl
-                variant="standard"
-                sx={{ width: "min-content", color: "white" }}
-              >
+              <FormControl variant="standard" sx={{ width: "min-content" }}>
                {city_id && cities && (
                  <Select
                    defaultValue={city_id}
--- a/src/components/modals/StationEditModal/index.tsx
+++ b/src/components/modals/StationEditModal/index.tsx
@ -121,7 +121,7 @@ export const StationEditModal = observer(() => {
    >
      <Box sx={style}>
        <Edit
-          title={<Typography variant="h5">Редактирование остановки</Typography>}
+          title={<Typography variant="h5">Редактирование станции</Typography>}
          saveButtonProps={saveButtonProps}
        >
          <Box
--- a/src/components/ui/MediaView.tsx
+++ b/src/components/ui/MediaView.tsx
@ -15,9 +15,9 @@ export function MediaView({ media }: Readonly<{ media?: MediaData }>) {
    <Box
      sx={{
        maxHeight: "300px",
-        width: "80%",
+        width: "100%",
        height: "100%",
-        maxWidth: "600px",
+        maxWidth: "300px",
        display: "flex",
        flexGrow: 1,
        justifyContent: "center",
--- a/src/components/ui/SidebarTitle.tsx
+++ b/src/components/ui/SidebarTitle.tsx
@ -1,15 +1,11 @@
-import { Logo } from "@/icons/Logo";
+import {ProjectIcon} from './Icons'

-export default function SidebarTitle({ collapsed }: { collapsed: boolean }) {
+export default function SidebarTitle({collapsed}: {collapsed: boolean}) {
  return (
-    <div
-      style={{ display: "flex", alignItems: "center", whiteSpace: "nowrap" }}
-    >
-      <Logo width={40} height={40} />
+    <div style={{display: 'flex', alignItems: 'center', whiteSpace: 'nowrap'}}>
+      <ProjectIcon style={{color: '#7f6b58'}} />

-      {!collapsed && (
-        <span style={{ marginLeft: 8, fontWeight: "bold" }}>Белые ночи</span>
-      )}
+      {!collapsed && <span style={{marginLeft: 8, fontWeight: 'bold'}}>Белые ночи</span>}
    </div>
-  );
+  )
 }
--- a/src/globals.css
+++ b/src/globals.css
@ -14,12 +14,12 @@
  cursor: pointer;
  padding: 0;
  margin: 0;
-  width: 32px;
-  height: 32px;
-  color: rgba(79, 138, 95, 1);
+  width: 35px;
+  height: 35px;
+  color: #544044;
  border-radius: 10%;
  transition: all 0.3s ease;
 }
 .backup-button:hover {
-  background-color: rgba(79, 138, 95, 0.05);
+  background-color: rgba(84, 64, 68, 0.5);
 }
--- a/src/icons/124.svg
+++ b/src/icons/124.svg
--- a/src/icons/Logo.tsx
+++ b/src/icons/Logo.tsx
--- a/src/locales/ru/translation.json
+++ b/src/locales/ru/translation.json
@ -94,9 +94,9 @@
  },
  "station": {
    "titles": {
-      "create": "Создать остановку",
-      "edit": "Редактировать остановку",
-      "show": "Показать остановку"
+      "create": "Создать станцию",
+      "edit": "Редактировать станцию",
+      "show": "Показать станцию"
    }
  },
  "snapshots": {
--- a/src/pages/carrier/create.tsx
+++ b/src/pages/carrier/create.tsx
@ -3,63 +3,19 @@ import { Create, useAutocomplete } from "@refinedev/mui";
 import { useForm } from "@refinedev/react-hook-form";
 import { Controller } from "react-hook-form";
 import { observer } from "mobx-react-lite";
-import { META_LANGUAGE } from "../../store/LanguageStore";
-import { LanguageSwitch } from "@/components/LanguageSwitch";
-
-import { useEffect, useState } from "react";
-import { EVERY_LANGUAGE, Languages, languageStore } from "@stores";
-
+import { languageStore, META_LANGUAGE } from "../../store/LanguageStore";
 export const CarrierCreate = observer(() => {
-  const { language, setLanguageAction } = languageStore;
+  const { language } = languageStore;
  const {
    saveButtonProps,
    refineCore: { formLoading },
    register,
    control,
-    setValue,
-    watch,
    formState: { errors },
  } = useForm({
-    refineCoreProps: META_LANGUAGE(language),
+    refineCoreProps: META_LANGUAGE(language)
  });

-  const [carrierData, setCarrierData] = useState({
-    full_name: EVERY_LANGUAGE(""),
-    short_name: EVERY_LANGUAGE(""),
-    slogan: EVERY_LANGUAGE(""),
-  });
-
-  useEffect(() => {
-    setValue("full_name", carrierData.full_name[language]);
-    setValue("short_name", carrierData.short_name[language]);
-    setValue("slogan", carrierData.slogan[language]);
-  }, [carrierData, language, setValue]);
-
-  function updateTranslations(update: boolean = true) {
-    const newCarrierData = {
-      ...carrierData,
-      full_name: {
-        ...carrierData.full_name,
-        [language]: watch("full_name") ?? "",
-      },
-      short_name: {
-        ...carrierData.short_name,
-        [language]: watch("short_name") ?? "",
-      },
-      slogan: {
-        ...carrierData.slogan,
-        [language]: watch("slogan") ?? "",
-      },
-    };
-    if (update) setCarrierData(newCarrierData);
-    return newCarrierData;
-  }
-
-  const handleLanguageChange = (lang: Languages) => {
-    updateTranslations();
-    setLanguageAction(lang);
-  };
-
  const { autocompleteProps: cityAutocompleteProps } = useAutocomplete({
    resource: "city",
    onSearch: (value) => [
@ -89,7 +45,6 @@ export const CarrierCreate = observer(() => {
        sx={{ display: "flex", flexDirection: "column" }}
        autoComplete="off"
      >
-        <LanguageSwitch action={handleLanguageChange} />
        <Controller
          control={control}
          name="city_id"
@ -140,7 +95,7 @@ export const CarrierCreate = observer(() => {
          helperText={(errors as any)?.full_name?.message}
          margin="normal"
          fullWidth
-          slotProps={{ inputLabel: { shrink: true } }}
+          slotProps={{inputLabel: {shrink: true}}}
          type="text"
          label={"Полное имя *"}
          name="full_name"
@ -154,13 +109,16 @@ export const CarrierCreate = observer(() => {
          helperText={(errors as any)?.short_name?.message}
          margin="normal"
          fullWidth
-          slotProps={{ inputLabel: { shrink: true } }}
+          slotProps={{inputLabel: {shrink: true}}}
          type="text"
          label={"Короткое имя"}
          name="short_name"
        />

-        <Box component="form" sx={{ display: "flex" }} autoComplete="off">
+        <Box component="form"
+          sx={{ display: "flex" }}
+          autoComplete="off"
+        >
          <TextField
            {...register("main_color", {
              // required: 'Это поле является обязательным',
@ -169,7 +127,7 @@ export const CarrierCreate = observer(() => {
            helperText={(errors as any)?.main_color?.message}
            margin="normal"
            fullWidth
-            slotProps={{ inputLabel: { shrink: true } }}
+            slotProps={{inputLabel: {shrink: true}}}
            type="color"
            label={"Основной цвет"}
            name="main_color"
@ -191,7 +149,7 @@ export const CarrierCreate = observer(() => {
            helperText={(errors as any)?.left_color?.message}
            margin="normal"
            fullWidth
-            slotProps={{ inputLabel: { shrink: true } }}
+            slotProps={{inputLabel: {shrink: true}}}
            type="color"
            label={"Цвет левого виджета"}
            name="left_color"
@ -214,7 +172,7 @@ export const CarrierCreate = observer(() => {
            helperText={(errors as any)?.right_color?.message}
            margin="normal"
            fullWidth
-            slotProps={{ inputLabel: { shrink: true } }}
+            slotProps={{inputLabel: {shrink: true}}}
            type="color"
            label={"Цвет правого виджета"}
            name="right_color"
@ -237,7 +195,7 @@ export const CarrierCreate = observer(() => {
          helperText={(errors as any)?.slogan?.message}
          margin="normal"
          fullWidth
-          slotProps={{ inputLabel: { shrink: true } }}
+          slotProps={{inputLabel: {shrink: true}}}
          type="text"
          label={"Слоган"}
          name="slogan"
--- a/src/pages/city/create.tsx
+++ b/src/pages/city/create.tsx
@ -1,224 +1,69 @@
-import { Autocomplete, Box, TextField } from "@mui/material";
-import { Create, useAutocomplete } from "@refinedev/mui";
-import { useForm } from "@refinedev/react-hook-form";
-import { Controller } from "react-hook-form";
-import { useEffect, useState } from "react";
-import { EVERY_LANGUAGE, Languages, languageStore } from "@stores";
-import { LanguageSwitch } from "@/components/LanguageSwitch";
-import { axiosInstanceForGet } from "@/providers";
-import { useNavigate } from "react-router";
-import { useNotification } from "@refinedev/core";
+import {Autocomplete, Box, TextField} from '@mui/material'
+import {Create, useAutocomplete} from '@refinedev/mui'
+import {useForm} from '@refinedev/react-hook-form'
+import {Controller} from 'react-hook-form'

 export const CityCreate = () => {
-  const { language, setLanguageAction } = languageStore;
-  const navigate = useNavigate();
-  const notification = useNotification();
-
-  // State to manage city name translations across all supported languages.
-  // Initializes with empty strings for each language.
-  const [allLanguageNames, setAllLanguageNames] = useState<
-    Record<Languages, string>
-  >(EVERY_LANGUAGE(""));
-
  const {
    saveButtonProps,
-    refineCore: { formLoading },
+    refineCore: {formLoading},
    register,
    control,
-    setValue,
-    watch,
-    handleSubmit,
-    formState: { errors },
-  } = useForm<{
-    name: string;
-    country_code: string;
-    arms: string;
-  }>({});
+    formState: {errors},
+  } = useForm({})

-  // Keeps the 'name' input field synchronized with the currently active language's translation.
-  // Updates whenever the active language or the `allLanguageNames` state changes.
-  useEffect(() => {
-    setValue("name", allLanguageNames[language]);
-  }, [language, allLanguageNames, setValue]);
+  const {autocompleteProps: countryAutocompleteProps} = useAutocomplete({
+    resource: 'country',
+  })

-  // Captures the current value of the 'name' TextField and updates the `allLanguageNames` state.
-  // This is vital for preserving user input when switching languages or before form submission.
-  const updateCurrentLanguageName = () => {
-    const currentNameValue = watch("name");
-    setAllLanguageNames((prev) => ({
-      ...prev,
-      [language]: currentNameValue || "",
-    }));
-  };
-
-  // Handles language changes. It first saves the current input, then updates the active language.
-  const handleLanguageChange = (lang: Languages) => {
-    updateCurrentLanguageName();
-    setLanguageAction(lang);
-  };
-
-  // Autocomplete hooks for selecting a country and city arms (media).
-  const { autocompleteProps: countryAutocompleteProps } = useAutocomplete({
-    resource: "country",
-  });
-
-  const { autocompleteProps: mediaAutocompleteProps } = useAutocomplete({
-    resource: "media",
+  const {autocompleteProps: mediaAutocompleteProps} = useAutocomplete({
+    resource: 'media',
    onSearch: (value) => [
      {
-        field: "media_name",
-        operator: "contains",
+        field: 'media_name',
+        operator: 'contains',
        value,
      },
    ],
-  });
-
-  // --- Form Submission Logic ---
-
-  // Handles the form submission. It saves the current language's input,
-  // validates the Russian name, and then sends requests to create/update city data
-  // across different languages.
-  const onFinish = async (data: {
-    name: string;
-    country_code: string;
-    arms: string;
-  }) => {
-    updateCurrentLanguageName();
-
-    const finalNames = {
-      ...allLanguageNames,
-      [language]: data.name,
-    };
-
-    try {
-      if (!finalNames.ru) {
-        console.error("Russian name is required for initial city creation.");
-        if (notification && typeof notification.open === "function") {
-          notification.open({
-            message: "Ошибка",
-            description: "Русское название города обязательно для создания.",
-            type: "error",
-          });
-        }
-        return;
-      }
-
-      console.log("Submitting with names:", finalNames);
-
-      // Create the city with the Russian name first.
-      const ruResponse = await axiosInstanceForGet("ru").post("/city", {
-        name: finalNames.ru,
-        country_code: data.country_code,
-        arms: data.arms,
-      });
-
-      const id = ruResponse.data.id;
-
-      // Update the city with English and Chinese names if available.
-      if (finalNames.en) {
-        await axiosInstanceForGet("en").patch(`/city/${id}`, {
-          name: finalNames.en,
-          country_code: data.country_code,
-          arms: data.arms,
-        });
-      }
-
-      if (finalNames.zh) {
-        await axiosInstanceForGet("zh").patch(`/city/${id}`, {
-          name: finalNames.zh,
-          country_code: data.country_code,
-          arms: data.arms,
-        });
-      }
-
-      console.log("City created/updated successfully!");
-      if (notification && typeof notification.open === "function") {
-        notification.open({
-          message: "Город успешно создан",
-          type: "success",
-        });
-      }
-
-      navigate("/city", { replace: true });
-    } catch (error) {
-      console.error("Error creating/updating city:", error);
-    }
-  };
+  })

  return (
-    <Create
-      isLoading={formLoading}
-      saveButtonProps={{
-        ...saveButtonProps,
-        disabled: saveButtonProps.disabled,
-        onClick: handleSubmit(onFinish as any),
-      }}
-    >
-      <Box
-        component="form"
-        sx={{ display: "flex", flexDirection: "column" }}
-        autoComplete="off"
-      >
-        <LanguageSwitch action={handleLanguageChange} />
-
+    <Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
+      <Box component="form" sx={{display: 'flex', flexDirection: 'column'}} autoComplete="off">
        <Controller
          control={control}
          name="country_code"
-          rules={{ required: "Это поле является обязательным" }}
+          rules={{required: 'Это поле является обязательным'}}
          defaultValue={null}
-          render={({ field }) => (
+          render={({field}) => (
            <Autocomplete
              {...countryAutocompleteProps}
-              value={
-                countryAutocompleteProps.options.find(
-                  (option: { code: string; name: string; id: string }) =>
-                    option.code === field.value
-                ) || null
-              }
-              onChange={(
-                _,
-                value: { code: string; name: string; id: string } | null
-              ) => {
-                field.onChange(value?.code || "");
+              value={countryAutocompleteProps.options.find((option) => option.code === field.value) || null}
+              onChange={(_, value) => {
+                field.onChange(value?.code || '')
              }}
-              getOptionLabel={(item: {
-                code: string;
-                name: string;
-                id: string;
-              }) => {
-                return item ? item.name : "";
+              getOptionLabel={(item) => {
+                return item ? item.name : ''
              }}
-              isOptionEqualToValue={(
-                option: { code: string; name: string; id: string },
-                value: { code: string; name: string; id: string }
-              ) => {
-                return option.id === value?.id;
+              isOptionEqualToValue={(option, value) => {
+                return option.id === value?.id
              }}
-              renderInput={(params) => (
-                <TextField
-                  {...params}
-                  label="Выберите страну"
-                  margin="normal"
-                  variant="outlined"
-                  error={!!errors.country_code}
-                  required
-                />
-              )}
+              renderInput={(params) => <TextField {...params} label="Выберите страну" margin="normal" variant="outlined" error={!!errors.country_code} helperText={(errors as any)?.country_code?.message} required />}
            />
          )}
        />

        <TextField
-          {...register("name", {
-            required: "Это поле является обязательным",
-            onBlur: updateCurrentLanguageName,
+          {...register('name', {
+            required: 'Это поле является обязательным',
          })}
-          error={!!errors.name}
+          error={!!(errors as any)?.name}
+          helperText={(errors as any)?.name?.message}
          margin="normal"
          fullWidth
-          InputLabelProps={{ shrink: true }}
+          InputLabelProps={{shrink: true}}
          type="text"
-          label={"Название *"}
+          label={'Название *'}
          name="name"
        />

@ -226,53 +71,27 @@ export const CityCreate = () => {
          control={control}
          name="arms"
          defaultValue={null}
-          render={({ field }) => (
+          render={({field}) => (
            <Autocomplete
              {...mediaAutocompleteProps}
-              value={
-                mediaAutocompleteProps.options.find(
-                  (option: { id: string; media_name: string }) =>
-                    option.id === field.value
-                ) || null
-              }
-              onChange={(
-                _,
-                value: { id: string; media_name: string } | null
-              ) => {
-                field.onChange(value?.id || "");
+              value={mediaAutocompleteProps.options.find((option) => option.id === field.value) || null}
+              onChange={(_, value) => {
+                field.onChange(value?.id || '')
              }}
-              getOptionLabel={(item: { id: string; media_name: string }) => {
-                return item ? item.media_name : "";
+              getOptionLabel={(item) => {
+                return item ? item.media_name : ''
              }}
-              isOptionEqualToValue={(
-                option: { id: string; media_name: string },
-                value: { id: string; media_name: string }
-              ) => {
-                return option.id === value?.id;
+              isOptionEqualToValue={(option, value) => {
+                return option.id === value?.id
              }}
-              filterOptions={(
-                options: { id: string; media_name: string }[],
-                { inputValue }
-              ) => {
-                return options.filter((option) =>
-                  option.media_name
-                    .toLowerCase()
-                    .includes(inputValue.toLowerCase())
-                );
+              filterOptions={(options, {inputValue}) => {
+                return options.filter((option) => option.media_name.toLowerCase().includes(inputValue.toLowerCase()))
              }}
-              renderInput={(params) => (
-                <TextField
-                  {...params}
-                  label="Выберите герб"
-                  margin="normal"
-                  variant="outlined"
-                  error={!!errors.arms}
-                />
-              )}
+              renderInput={(params) => <TextField {...params} label="Выберите герб" margin="normal" variant="outlined" error={!!errors.arms} helperText={(errors as any)?.arms?.message} />}
            />
          )}
        />
      </Box>
    </Create>
-  );
-};
+  )
+}
--- a/src/pages/login/index.tsx
+++ b/src/pages/login/index.tsx
@ -1,20 +1,13 @@
-import { AuthPage, ThemedTitleV2 } from "@refinedev/mui";
-
-import { Logo } from "@/icons/Logo";
+import {AuthPage, ThemedTitleV2} from '@refinedev/mui'
+import {ProjectIcon} from '../../components/ui/Icons'

 export const Login = () => {
  return (
    <AuthPage
      type="login"
-      title={
-        <ThemedTitleV2
-          collapsed={false}
-          text="Белые Ночи"
-          icon={<Logo width={24} height={24} />}
-        />
-      }
+      title={<ThemedTitleV2 collapsed={false} text="Белые Ночи" icon={<ProjectIcon style={{color: '#7f6b58'}} />} />}
      forgotPasswordLink={false}
      registerLink={false} // only admin can add users
    />
-  );
-};
+  )
+}
--- a/src/pages/media/list.tsx
+++ b/src/pages/media/list.tsx
@ -100,6 +100,7 @@ export const MediaList = observer(() => {
        columns={columns}
        localeText={localeText}
        getRowId={(row: any) => row.id}
+        languageEnabled
      />
    </List>
  );
--- a/src/pages/route-preview/InfiniteCanvas.tsx
+++ b/src/pages/route-preview/InfiniteCanvas.tsx
@ -1,230 +1,179 @@
 import { FederatedMouseEvent, FederatedWheelEvent } from "pixi.js";
-import { Component, ReactNode, useEffect, useState, useRef } from "react";
+import { Component, ReactNode, useEffect, useState } from "react";
 import { useTransform } from "./TransformContext";
 import { useMapData } from "./MapDataContext";
 import { SCALE_FACTOR } from "./Constants";
 import { useApplication } from "@pixi/react";

-class ErrorBoundary extends Component<
-  { children: ReactNode },
-  { hasError: boolean }
-> {
-  state = { hasError: false };
-
-  static getDerivedStateFromError() {
-    return { hasError: true };
+class ErrorBoundary extends Component<{ children: ReactNode }, { hasError: boolean }> {
+	state = { hasError: false };
+  
+	static getDerivedStateFromError() {
+	  return { hasError: true };
+	}
+  
+	componentDidCatch(error: Error, info: React.ErrorInfo) {
+	  console.error("Error caught:", error, info);
+	}
+  
+	render() {
+	  return this.state.hasError ? <p>Whoopsie Daisy!</p> : this.props.children;
+	}
  }

-  componentDidCatch(error: Error, info: React.ErrorInfo) {
-    console.error("Error caught:", error, info);
-  }

-  render() {
-    return this.state.hasError ? <p>Whoopsie Daisy!</p> : this.props.children;
-  }
-}
+export function InfiniteCanvas({children} : Readonly<{children?: ReactNode}>) {
+	const { position, setPosition, scale, setScale, rotation, setRotation, setScreenCenter, screenCenter } = useTransform();
+	const { routeData, originalRouteData } = useMapData();

-export function InfiniteCanvas({
-  children,
-}: Readonly<{ children?: ReactNode }>) {
-  const {
-    position,
-    setPosition,
-    scale,
-    setScale,
-    rotation,
-    setRotation,
-    setScreenCenter,
-    screenCenter,
-  } = useTransform();
-  const { routeData, originalRouteData } = useMapData();
+	const applicationRef = useApplication();
+	
+	const [isDragging, setIsDragging] = useState(false);
+	const [startMousePosition, setStartMousePosition] = useState({ x: 0, y: 0 });
+	const [startRotation, setStartRotation] = useState(0);
+	const [startPosition, setStartPosition] = useState({ x: 0, y: 0 });

-  const applicationRef = useApplication();
+	useEffect(() => {
+		const canvas = applicationRef?.app.canvas;
+		if (!canvas) return;
+		const canvasRect = canvas.getBoundingClientRect();
+		const canvasLeft = canvasRect?.left ?? 0; 
+		const canvasTop = canvasRect?.top ?? 0;
+		const centerX = window.innerWidth / 2 - canvasLeft;
+		const centerY = window.innerHeight / 2 - canvasTop;
+		setScreenCenter({x: centerX, y: centerY});
+	}, [applicationRef?.app.canvas, window.innerWidth, window.innerHeight]);

-  const [isDragging, setIsDragging] = useState(false);
-  const [startMousePosition, setStartMousePosition] = useState({ x: 0, y: 0 });
-  const [startRotation, setStartRotation] = useState(0);
-  const [startPosition, setStartPosition] = useState({ x: 0, y: 0 });
+	const handlePointerDown = (e: FederatedMouseEvent) => {
+		setIsDragging(true);
+		setStartPosition({
+			x: position.x,
+			y: position.y
+		});
+		setStartMousePosition({
+			x: e.globalX,
+			y: e.globalY
+		});
+		setStartRotation(rotation);
+		e.stopPropagation();
+	};

-  // Флаг для предотвращения конфликта между пользовательским вводом и данными маршрута
-  const [isUserInteracting, setIsUserInteracting] = useState(false);

-  // Реф для отслеживания последнего значения originalRouteData?.rotate
-  const lastOriginalRotation = useRef<number | undefined>(undefined);
+	useEffect(() => {
+		setRotation((originalRouteData?.rotate ?? 0) * Math.PI / 180);
+	}, [originalRouteData?.rotate]);
+	// Get canvas element and its dimensions/position
+	const handlePointerMove = (e: FederatedMouseEvent) => {
+		if (!isDragging) return;

-  useEffect(() => {
-    const canvas = applicationRef?.app.canvas;
-    if (!canvas) return;
+		if (e.shiftKey) {
+			const center = screenCenter ?? {x: 0, y: 0};
+			const startAngle = Math.atan2(startMousePosition.y - center.y, startMousePosition.x - center.x);
+			const currentAngle = Math.atan2(e.globalY - center.y, e.globalX - center.x);

-    const canvasRect = canvas.getBoundingClientRect();
-    const canvasLeft = canvasRect.left;
-    const canvasTop = canvasRect.top;
-    const centerX = window.innerWidth / 2 - canvasLeft;
-    const centerY = window.innerHeight / 2 - canvasTop;
-    setScreenCenter({ x: centerX, y: centerY });
-  }, [applicationRef?.app.canvas, setScreenCenter]);
+			// Calculate rotation difference in radians
+			const rotationDiff = currentAngle - startAngle;

-  const handlePointerDown = (e: FederatedMouseEvent) => {
-    setIsDragging(true);
-    setIsUserInteracting(true); // Устанавливаем флаг взаимодействия пользователя
-    setStartPosition({
-      x: position.x,
-      y: position.y,
-    });
-    setStartMousePosition({
-      x: e.globalX,
-      y: e.globalY,
-    });
-    setStartRotation(rotation);
-    e.stopPropagation();
-  };
+			// Update rotation
+			setRotation(startRotation + rotationDiff);

-  // Устанавливаем rotation только при изменении originalRouteData и отсутствии взаимодействия пользователя
-  useEffect(() => {
-    const newRotation = originalRouteData?.rotate ?? 0;
+			const cosDelta = Math.cos(rotationDiff);
+			const sinDelta = Math.sin(rotationDiff);
+			
+			setPosition({
+				x: center.x * (1 - cosDelta) + startPosition.x * cosDelta + (center.y - startPosition.y) * sinDelta,
+				y: center.y * (1 - cosDelta) + startPosition.y * cosDelta + (startPosition.x - center.x) * sinDelta
+			});
+			
+		} else {
+			setRotation(startRotation);
+			setPosition({
+				x: startPosition.x - startMousePosition.x + e.globalX,
+				y: startPosition.y - startMousePosition.y + e.globalY
+			});
+		}
+		e.stopPropagation();
+	};

-    // Обновляем rotation только если:
-    // 1. Пользователь не взаимодействует с канвасом
-    // 2. Значение действительно изменилось
-    if (!isUserInteracting && lastOriginalRotation.current !== newRotation) {
-      setRotation((newRotation * Math.PI) / 180);
-      lastOriginalRotation.current = newRotation;
-    }
-  }, [originalRouteData?.rotate, isUserInteracting, setRotation]);
+	// Handle mouse up
+	const handlePointerUp = (e: FederatedMouseEvent) => {
+		setIsDragging(false);
+		e.stopPropagation();
+	};
+	// Handle mouse wheel for zooming
+	const handleWheel = (e: FederatedWheelEvent) => {
+		e.stopPropagation();
+		
+		// Get mouse position relative to canvas
+		const mouseX = e.globalX - position.x;
+		const mouseY = e.globalY - position.y;

-  const handlePointerMove = (e: FederatedMouseEvent) => {
-    if (!isDragging) return;
+		// Calculate new scale
+		const scaleMin = (routeData?.scale_min ?? 10)/SCALE_FACTOR;
+		const scaleMax = (routeData?.scale_max ?? 20)/SCALE_FACTOR;

-    if (e.shiftKey) {
-      const center = screenCenter ?? { x: 0, y: 0 };
-      const startAngle = Math.atan2(
-        startMousePosition.y - center.y,
-        startMousePosition.x - center.x
-      );
-      const currentAngle = Math.atan2(
-        e.globalY - center.y,
-        e.globalX - center.x
-      );
+		let zoomFactor = e.deltaY > 0 ? 0.9 : 1.1; // Zoom out/in
+		//const newScale = scale * zoomFactor;
+		const newScale = Math.max(scaleMin, Math.min(scaleMax, scale * zoomFactor));
+		zoomFactor = newScale / scale;

-      // Calculate rotation difference in radians
-      const rotationDiff = currentAngle - startAngle;
+		if (scale === newScale) {
+			return;
+		}

-      // Update rotation
-      setRotation(startRotation + rotationDiff);
+		// Update position to zoom towards mouse cursor
+		setPosition({
+			x: position.x + mouseX * (1 - zoomFactor),
+			y: position.y + mouseY * (1 - zoomFactor)
+		});

-      const cosDelta = Math.cos(rotationDiff);
-      const sinDelta = Math.sin(rotationDiff);
+		setScale(newScale);
+	};

-      setPosition({
-        x:
-          center.x * (1 - cosDelta) +
-          startPosition.x * cosDelta +
-          (center.y - startPosition.y) * sinDelta,
-        y:
-          center.y * (1 - cosDelta) +
-          startPosition.y * cosDelta +
-          (startPosition.x - center.x) * sinDelta,
-      });
-    } else {
-      setRotation(startRotation);
-      setPosition({
-        x: startPosition.x - startMousePosition.x + e.globalX,
-        y: startPosition.y - startMousePosition.y + e.globalY,
-      });
-    }
-    e.stopPropagation();
-  };
+	useEffect(() => {
+		applicationRef?.app.render();
+		console.log(position, scale, rotation);
+	}, [position, scale, rotation]);

-  const handlePointerUp = (e: FederatedMouseEvent) => {
-    setIsDragging(false);
-    // Сбрасываем флаг взаимодействия через небольшую задержку
-    // чтобы избежать немедленного срабатывания useEffect
-    setTimeout(() => {
-      setIsUserInteracting(false);
-    }, 100);
-    e.stopPropagation();
-  };
+	
+	return (
+		<ErrorBoundary>
+			{applicationRef?.app && (
+				<pixiGraphics
+					draw={(g) => {
+						const canvas = applicationRef.app.canvas;
+						g.clear();
+						g.rect(0, 0, canvas?.width ?? 0, canvas?.height ?? 0);
+						g.fill("#111");
+					}}
+					eventMode={'static'}
+					interactive
+					onPointerDown={handlePointerDown}
+					onGlobalPointerMove={handlePointerMove}
+					onPointerUp={handlePointerUp}
+					onPointerUpOutside={handlePointerUp}
+					onWheel={handleWheel}
+				/>
+			)}
+			<pixiContainer
+				x={position.x}
+				y={position.y}
+				scale={scale}
+				rotation={rotation}
+			>
+				{children}
+			</pixiContainer>
+			{/* Show center of the screen.
+			<pixiGraphics
+				eventMode="none"

-  const handleWheel = (e: FederatedWheelEvent) => {
-    e.stopPropagation();
-    setIsUserInteracting(true); // Устанавливаем флаг при зуме
-
-    // Get mouse position relative to canvas
-    const mouseX = e.globalX - position.x;
-    const mouseY = e.globalY - position.y;
-
-    // Calculate new scale
-    const scaleMin = (routeData?.scale_min ?? 10) / SCALE_FACTOR;
-    const scaleMax = (routeData?.scale_max ?? 20) / SCALE_FACTOR;
-
-    const zoomFactor = e.deltaY > 0 ? 0.9 : 1.1; // Zoom out/in
-    const newScale = Math.max(scaleMin, Math.min(scaleMax, scale * zoomFactor));
-    const actualZoomFactor = newScale / scale;
-
-    if (scale === newScale) {
-      // Сбрасываем флаг, если зум не изменился
-      setTimeout(() => {
-        setIsUserInteracting(false);
-      }, 100);
-      return;
-    }
-
-    // Update position to zoom towards mouse cursor
-    setPosition({
-      x: position.x + mouseX * (1 - actualZoomFactor),
-      y: position.y + mouseY * (1 - actualZoomFactor),
-    });
-
-    setScale(newScale);
-
-    // Сбрасываем флаг взаимодействия через задержку
-    setTimeout(() => {
-      setIsUserInteracting(false);
-    }, 100);
-  };
-
-  useEffect(() => {
-    applicationRef?.app.render();
-    console.log(position, scale, rotation);
-  }, [position, scale, rotation]);
-
-  return (
-    <ErrorBoundary>
-      {applicationRef?.app && (
-        <pixiGraphics
-          draw={(g) => {
-            const canvas = applicationRef.app.canvas;
-            g.clear();
-            g.rect(0, 0, canvas?.width ?? 0, canvas?.height ?? 0);
-            g.fill("#111");
-          }}
-          eventMode={"static"}
-          interactive
-          onPointerDown={handlePointerDown}
-          onGlobalPointerMove={handlePointerMove}
-          onPointerUp={handlePointerUp}
-          onPointerUpOutside={handlePointerUp}
-          onWheel={handleWheel}
-        />
-      )}
-      <pixiContainer
-        x={position.x}
-        y={position.y}
-        scale={scale}
-        rotation={rotation}
-      >
-        {children}
-      </pixiContainer>
-      {/* Show center of the screen.
-      <pixiGraphics
-        eventMode="none"
-        draw={(g) => {
-          g.clear();
-          const center = screenCenter ?? {x: 0, y: 0};
-          g.circle(center.x, center.y, 1);
-          g.fill("#fff");
-        }}
-      /> */}
-    </ErrorBoundary>
-  );
-}
+				draw={(g) => {
+					g.clear();
+					const center = screenCenter ?? {x: 0, y: 0};
+					g.circle(center.x, center.y, 1);
+					g.fill("#fff");
+				}}
+			/> */}
+		</ErrorBoundary>
+	);
+}
--- a/src/pages/route-preview/LeftSidebar.tsx
+++ b/src/pages/route-preview/LeftSidebar.tsx
@ -1,89 +1,33 @@
 import { Stack, Typography, Button } from "@mui/material";

-import { useNavigate, useNavigationType } from "react-router";
-
 export function LeftSidebar() {
-  const navigate = useNavigate();
-  const navigationType = useNavigationType(); // PUSH, POP, REPLACE
+	return (
+		<Stack direction="column" width="300px" p={2} bgcolor="primary.main">
+			<Stack direction="column" alignItems="center" justifyContent="center" my={10}>
+				<img src={"/Emblem.svg"} alt="logo" width={100} height={100} />
+				<Typography  sx={{ mb: 2 }} textAlign="center">
+					При поддержке Правительства
+					Санкт-Петербурга
+				</Typography>
+			</Stack>

-  const handleBack = () => {
-    if (navigationType === "PUSH") {
-      navigate(-1);
-    } else {
-      navigate("/route");
-    }
-  };
+			
+			<Stack direction="column" alignItems="center" justifyContent="center" my={10} spacing={2}>
+				<Button variant="outlined" color="warning" fullWidth>
+					Достопримечательности
+				</Button>
+				<Button variant="outlined" color="warning" fullWidth>
+					Остановки
+				</Button>
+			</Stack>

-  return (
-    <Stack direction="column" width="300px" p={2} bgcolor="primary.main">
-      <button
-        onClick={handleBack}
-        type="button"
-        style={{
-          display: "flex",
-          justifyContent: "center",
-          alignItems: "center",
-          gap: 10,
-          color: "#fff",
-          backgroundColor: "#222",
-          borderRadius: 10,
-          width: "100%",
-          border: "none",
-          cursor: "pointer",
-        }}
-      >
-        <p>Назад</p>
-      </button>
+			<Stack direction="column" alignItems="center" justifyContent="center" my={10}>
+				<img src={"/GET.png"} alt="logo" width="80%" style={{margin: "0 auto"}}/>
+			</Stack>
+			
+			<Typography variant="h6" textAlign="center" mt="auto">#ВсемПоПути</Typography>

-      <Stack
-        direction="column"
-        alignItems="center"
-        justifyContent="center"
-        my={10}
-      >
-        <img src={"/Emblem.svg"} alt="logo" width={100} height={100} />
-        <Typography sx={{ mb: 2, color: "#fff" }} textAlign="center">
-          При поддержке Правительства Санкт-Петербурга
-        </Typography>
-      </Stack>
-
-      <Stack
-        direction="column"
-        alignItems="center"
-        justifyContent="center"
-        my={10}
-        spacing={2}
-      >
-        <Button variant="outlined" color="warning" fullWidth>
-          Достопримечательности
-        </Button>
-        <Button variant="outlined" color="warning" fullWidth>
-          Остановки
-        </Button>
-      </Stack>
-
-      <Stack
-        direction="column"
-        alignItems="center"
-        justifyContent="center"
-        my={10}
-      >
-        <img
-          src={"/GET.png"}
-          alt="logo"
-          width="80%"
-          style={{ margin: "0 auto" }}
-        />
-      </Stack>
-
-      <Typography
-        variant="h6"
-        textAlign="center"
-        mt="auto"
-        sx={{ color: "#fff" }}
-      >
-        #ВсемПоПути
-      </Typography>
-    </Stack>
-  );
-}
+			
+		</Stack>
+	);
+}
--- a/src/pages/route-preview/MapDataContext.tsx
+++ b/src/pages/route-preview/MapDataContext.tsx
@ -1,4 +1,4 @@
-import { useApiUrl } from "@refinedev/core";
+import { useCustom, useApiUrl } from "@refinedev/core";
 import { useParams } from "react-router";
 import {
  createContext,
@ -16,16 +16,13 @@ import {
  StationPatchData,
 } from "./types";
 import { axiosInstance } from "../../providers/data";
-import { languageStore, META_LANGUAGE } from "@/store/LanguageStore";
-import { observer } from "mobx-react-lite";
-import { axiosInstanceForGet } from "@/providers/data";

 const MapDataContext = createContext<{
  originalRouteData?: RouteData;
  originalStationData?: StationData[];
  originalSightData?: SightData[];
  routeData?: RouteData;
-  stationData?: StationDataWithLanguage;
+  stationData?: StationData[];
  sightData?: SightData[];

  isRouteLoading: boolean;
@ -60,247 +57,210 @@ const MapDataContext = createContext<{
  saveChanges: () => {},
 });

-type StationDataWithLanguage = {
-  [key: string]: StationData[];
-};
-export const MapDataProvider = observer(
-  ({ children }: Readonly<{ children: ReactNode }>) => {
-    const { id: routeId } = useParams<{ id: string }>();
-    const apiUrl = useApiUrl();
+export function MapDataProvider({
+  children,
+}: Readonly<{ children: ReactNode }>) {
+  const { id: routeId } = useParams<{ id: string }>();
+  const apiUrl = useApiUrl();

-    const [originalRouteData, setOriginalRouteData] = useState<RouteData>();
-    const [originalStationData, setOriginalStationData] =
-      useState<StationData[]>();
-    const [originalSightData, setOriginalSightData] = useState<SightData[]>();
+  const [originalRouteData, setOriginalRouteData] = useState<RouteData>();
+  const [originalStationData, setOriginalStationData] =
+    useState<StationData[]>();
+  const [originalSightData, setOriginalSightData] = useState<SightData[]>();

-    const [routeData, setRouteData] = useState<RouteData>();
-    const [stationData, setStationData] = useState<StationDataWithLanguage>({
-      RU: [],
-      EN: [],
-      ZH: [],
+  const [routeData, setRouteData] = useState<RouteData>();
+  const [stationData, setStationData] = useState<StationData[]>();
+  const [sightData, setSightData] = useState<SightData[]>();
+
+  const [routeChanges, setRouteChanges] = useState<RouteData>({} as RouteData);
+  const [stationChanges, setStationChanges] = useState<StationPatchData[]>([]);
+  const [sightChanges, setSightChanges] = useState<SightPatchData[]>([]);
+
+  const { data: routeQuery, isLoading: isRouteLoading } = useCustom({
+    url: `${apiUrl}/route/${routeId}`,
+    method: "get",
+  });
+  const { data: stationQuery, isLoading: isStationLoading } = useCustom({
+    url: `${apiUrl}/route/${routeId}/station`,
+    method: "get",
+  });
+  const { data: sightQuery, isLoading: isSightLoading } = useCustom({
+    url: `${apiUrl}/route/${routeId}/sight`,
+    method: "get",
+  });
+  useEffect(() => {
+    // if not undefined, set original data
+    if (routeQuery?.data) setOriginalRouteData(routeQuery.data as RouteData);
+    if (stationQuery?.data)
+      setOriginalStationData(stationQuery.data as StationData[]);
+    if (sightQuery?.data) setOriginalSightData(sightQuery.data as SightData[]);
+    console.log("queries", routeQuery, stationQuery, sightQuery);
+  }, [routeQuery, stationQuery, sightQuery]);
+
+  useEffect(() => {
+    // combine changes with original data
+    if (originalRouteData)
+      setRouteData({ ...originalRouteData, ...routeChanges });
+    if (originalStationData) setStationData(originalStationData);
+    if (originalSightData) setSightData(originalSightData);
+  }, [
+    originalRouteData,
+    originalStationData,
+    originalSightData,
+    routeChanges,
+    stationChanges,
+    sightChanges,
+  ]);
+
+  function setScaleRange(min: number, max: number) {
+    setRouteChanges((prev) => {
+      return { ...prev, scale_min: min, scale_max: max };
    });
-    const [sightData, setSightData] = useState<SightData[]>();
-
-    const [routeChanges, setRouteChanges] = useState<Partial<RouteData>>({});
-    const [stationChanges, setStationChanges] = useState<StationPatchData[]>(
-      []
-    );
-    const [sightChanges, setSightChanges] = useState<SightPatchData[]>([]);
-    const { language } = languageStore;
-
-    const [isRouteLoading, setIsRouteLoading] = useState(true);
-    const [isStationLoading, setIsStationLoading] = useState(true);
-    const [isSightLoading, setIsSightLoading] = useState(true);
-
-    useEffect(() => {
-      const fetchData = async () => {
-        try {
-          setIsRouteLoading(true);
-          setIsStationLoading(true);
-          setIsSightLoading(true);
-
-          const [
-            routeResponse,
-            ruStationResponse,
-            enStationResponse,
-            zhStationResponse,
-            sightResponse,
-          ] = await Promise.all([
-            axiosInstanceForGet(language).get(`/route/${routeId}`),
-            axiosInstanceForGet("ru").get(`/route/${routeId}/station`),
-            axiosInstanceForGet("en").get(`/route/${routeId}/station`),
-            axiosInstanceForGet("zh").get(`/route/${routeId}/station`),
-            axiosInstanceForGet(language).get(`/route/${routeId}/sight`),
-          ]);
-
-          setOriginalRouteData(routeResponse.data as RouteData);
-          setOriginalStationData(ruStationResponse.data as StationData[]);
-          setStationData({
-            ru: ruStationResponse.data as StationData[],
-            en: enStationResponse.data as StationData[],
-            zh: zhStationResponse.data as StationData[],
-          });
-          setOriginalSightData(sightResponse.data as SightData[]);
-
-          setIsRouteLoading(false);
-          setIsStationLoading(false);
-          setIsSightLoading(false);
-        } catch (error) {
-          console.error("Error fetching data:", error);
-          setIsRouteLoading(false);
-          setIsStationLoading(false);
-          setIsSightLoading(false);
-        }
-      };
-
-      fetchData();
-    }, [routeId]);
-
-    useEffect(() => {
-      // combine changes with original data
-      if (originalRouteData)
-        setRouteData({ ...originalRouteData, ...routeChanges });
-      if (originalSightData) setSightData(originalSightData);
-    }, [
-      originalRouteData,
-      originalSightData,
-      routeChanges,
-      stationChanges,
-      sightChanges,
-    ]);
-
-    function setScaleRange(min: number, max: number) {
-      setRouteChanges((prev) => {
-        return { ...prev, scale_min: min, scale_max: max };
-      });
-    }
-
-    function setMapRotation(rotation: number) {
-      setRouteChanges((prev) => {
-        return { ...prev, rotate: rotation };
-      });
-    }
-
-    function setMapCenter(x: number, y: number) {
-      setRouteChanges((prev) => {
-        return { ...prev, center_latitude: x, center_longitude: y };
-      });
-    }
-
-    async function saveChanges() {
-      await axiosInstance.patch(`/route/${routeId}`, routeData);
-      await saveStationChanges();
-      await saveSightChanges();
-    }
-
-    async function saveStationChanges() {
-      for (const station of stationChanges) {
-        const response = await axiosInstance.patch(
-          `/route/${routeId}/station`,
-          station
-        );
-      }
-    }
-
-    async function saveSightChanges() {
-      console.log("sightChanges", sightChanges);
-      for (const sight of sightChanges) {
-        const response = await axiosInstance.patch(
-          `/route/${routeId}/sight`,
-          sight
-        );
-      }
-    }
-
-    function setStationOffset(stationId: number, x: number, y: number) {
-      setStationChanges((prev) => {
-        let found = prev.find((station) => station.station_id === stationId);
-        if (found) {
-          found.offset_x = x;
-          found.offset_y = y;
-
-          return prev.map((station) => {
-            if (station.station_id === stationId) {
-              return found;
-            }
-            return station;
-          });
-        } else {
-          const foundStation = stationData.ru?.find(
-            (station) => station.id === stationId
-          );
-          if (foundStation) {
-            return [
-              ...prev,
-              {
-                station_id: stationId,
-                offset_x: x,
-                offset_y: y,
-                transfers: foundStation.transfers,
-              },
-            ];
-          }
-          return prev;
-        }
-      });
-    }
-
-    function setSightCoordinates(
-      sightId: number,
-      latitude: number,
-      longitude: number
-    ) {
-      setSightChanges((prev) => {
-        let found = prev.find((sight) => sight.sight_id === sightId);
-        if (found) {
-          found.latitude = latitude;
-          found.longitude = longitude;
-
-          return prev.map((sight) => {
-            if (sight.sight_id === sightId) {
-              return found;
-            }
-            return sight;
-          });
-        } else {
-          const foundSight = sightData?.find((sight) => sight.id === sightId);
-          if (foundSight) {
-            return [
-              ...prev,
-              {
-                sight_id: sightId,
-                latitude,
-                longitude,
-              },
-            ];
-          }
-          return prev;
-        }
-      });
-    }
-
-    useEffect(() => {
-      console.log("sightChanges", sightChanges);
-    }, [sightChanges]);
-
-    const value = useMemo(
-      () => ({
-        originalRouteData,
-        originalStationData,
-        originalSightData,
-        routeData,
-        stationData,
-        sightData,
-        isRouteLoading,
-        isStationLoading,
-        isSightLoading,
-        setScaleRange,
-        setMapRotation,
-        setMapCenter,
-        saveChanges,
-        setStationOffset,
-        setSightCoordinates,
-      }),
-      [
-        originalRouteData,
-        originalStationData,
-        originalSightData,
-        routeData,
-        stationData,
-        sightData,
-        isRouteLoading,
-        isStationLoading,
-        isSightLoading,
-      ]
-    );
-
-    return (
-      <MapDataContext.Provider value={value}>
-        {children}
-      </MapDataContext.Provider>
-    );
  }
-);
+
+  function setMapRotation(rotation: number) {
+    setRouteChanges((prev) => {
+      return { ...prev, rotate: rotation };
+    });
+  }
+
+  function setMapCenter(x: number, y: number) {
+    setRouteChanges((prev) => {
+      return { ...prev, center_latitude: x, center_longitude: y };
+    });
+  }
+
+  async function saveChanges() {
+    await axiosInstance.patch(`/route/${routeId}`, routeData);
+    await saveStationChanges();
+    await saveSightChanges();
+  }
+
+  async function saveStationChanges() {
+    for (const station of stationChanges) {
+      const response = await axiosInstance.patch(
+        `/route/${routeId}/station`,
+        station
+      );
+    }
+  }
+
+  async function saveSightChanges() {
+    console.log("sightChanges", sightChanges);
+    for (const sight of sightChanges) {
+      const response = await axiosInstance.patch(
+        `/route/${routeId}/sight`,
+        sight
+      );
+    }
+  }
+
+  function setStationOffset(stationId: number, x: number, y: number) {
+    setStationChanges((prev) => {
+      let found = prev.find((station) => station.station_id === stationId);
+      if (found) {
+        found.offset_x = x;
+        found.offset_y = y;
+
+        return prev.map((station) => {
+          if (station.station_id === stationId) {
+            return found;
+          }
+          return station;
+        });
+      } else {
+        const foundStation = stationData?.find(
+          (station) => station.id === stationId
+        );
+        if (foundStation) {
+          return [
+            ...prev,
+            {
+              station_id: stationId,
+              offset_x: x,
+              offset_y: y,
+              transfers: foundStation.transfers,
+            },
+          ];
+        }
+        return prev;
+      }
+    });
+  }
+
+  function setSightCoordinates(
+    sightId: number,
+    latitude: number,
+    longitude: number
+  ) {
+    setSightChanges((prev) => {
+      let found = prev.find((sight) => sight.sight_id === sightId);
+      if (found) {
+        found.latitude = latitude;
+        found.longitude = longitude;
+
+        return prev.map((sight) => {
+          if (sight.sight_id === sightId) {
+            return found;
+          }
+          return sight;
+        });
+      } else {
+        const foundSight = sightData?.find((sight) => sight.id === sightId);
+        if (foundSight) {
+          return [
+            ...prev,
+            {
+              sight_id: sightId,
+              latitude,
+              longitude,
+            },
+          ];
+        }
+        return prev;
+      }
+    });
+  }
+
+  useEffect(() => {
+    console.log("sightChanges", sightChanges);
+  }, [sightChanges]);
+
+  const value = useMemo(
+    () => ({
+      originalRouteData: originalRouteData,
+      originalStationData: originalStationData,
+      originalSightData: originalSightData,
+      routeData: routeData,
+      stationData: stationData,
+      sightData: sightData,
+      isRouteLoading,
+      isStationLoading,
+      isSightLoading,
+      setScaleRange,
+      setMapRotation,
+      setMapCenter,
+      saveChanges,
+      setStationOffset,
+      setSightCoordinates,
+    }),
+    [
+      originalRouteData,
+      originalStationData,
+      originalSightData,
+      routeData,
+      stationData,
+      sightData,
+      isRouteLoading,
+      isStationLoading,
+      isSightLoading,
+    ]
+  );
+
+  return (
+    <MapDataContext.Provider value={value}>{children}</MapDataContext.Provider>
+  );
+}

 export const useMapData = () => {
  const context = useContext(MapDataContext);
--- a/src/pages/route-preview/RightSidebar.tsx
+++ b/src/pages/route-preview/RightSidebar.tsx
@ -5,228 +5,187 @@ import { useTransform } from "./TransformContext";
 import { coordinatesToLocal, localToCoordinates } from "./utils";

 export function RightSidebar() {
-  const {
-    routeData,
-    setScaleRange,
-    saveChanges,
-    originalRouteData,
-    setMapRotation,
-    setMapCenter,
-  } = useMapData();
-  const {
-    rotation,
-    position,
-    screenToLocal,
-    screenCenter,
-    rotateToAngle,
-    setTransform,
-  } = useTransform();
-  const [minScale, setMinScale] = useState<number>(1);
-  const [maxScale, setMaxScale] = useState<number>(10);
-  const [localCenter, setLocalCenter] = useState<{ x: number; y: number }>({
-    x: 0,
-    y: 0,
-  });
-  const [rotationDegrees, setRotationDegrees] = useState<number>(0);
+	const { routeData, setScaleRange, saveChanges, originalRouteData, setMapRotation, setMapCenter } = useMapData();
+	const { rotation, position, screenToLocal, screenCenter, rotateToAngle, setTransform } = useTransform();
+	const [minScale, setMinScale] = useState<number>(1);
+	const [maxScale, setMaxScale] = useState<number>(10);
+	const [localCenter, setLocalCenter] = useState<{x: number, y: number}>({x: 0, y: 0});
+	const [rotationDegrees, setRotationDegrees] = useState<number>(0);

-  useEffect(() => {
-    if (originalRouteData) {
-      setMinScale(originalRouteData.scale_min ?? 1);
-      setMaxScale(originalRouteData.scale_max ?? 10);
-      setRotationDegrees(originalRouteData.rotate ?? 0);
-      setLocalCenter({
-        x: originalRouteData.center_latitude ?? 0,
-        y: originalRouteData.center_longitude ?? 0,
-      });
-    }
-  }, [originalRouteData]);
+	useEffect(() => {
+		if(originalRouteData) {
+			setMinScale(originalRouteData.scale_min ?? 1);
+			setMaxScale(originalRouteData.scale_max ?? 10);
+			setRotationDegrees(originalRouteData.rotate ?? 0);
+			setLocalCenter({x: originalRouteData.center_latitude ?? 0, y: originalRouteData.center_longitude ?? 0});
+		}
+	}, [originalRouteData]);

-  useEffect(() => {
-    if (minScale && maxScale) {
-      setScaleRange(minScale, maxScale);
-    }
-  }, [minScale, maxScale]);
+	useEffect(() => {
+		if(minScale && maxScale) {
+			setScaleRange(minScale, maxScale);
+		}
+	}, [minScale, maxScale]);

-  useEffect(() => {
-    setRotationDegrees(
-      ((Math.round((rotation * 180) / Math.PI) % 360) + 360) % 360
-    );
-  }, [rotation]);
-  useEffect(() => {
-    setMapRotation(rotationDegrees);
-  }, [rotationDegrees]);

-  useEffect(() => {
-    const center = screenCenter ?? { x: 0, y: 0 };
-    const localCenter = screenToLocal(center.x, center.y);
-    const coordinates = localToCoordinates(localCenter.x, localCenter.y);
-    setLocalCenter({ x: coordinates.latitude, y: coordinates.longitude });
-  }, [position]);
+	useEffect(() => {
+		setRotationDegrees((Math.round(rotation * 180 / Math.PI) % 360 + 360) % 360);
+	}, [rotation]);
+	useEffect(() => {
+		setMapRotation(rotationDegrees);
+	}, [rotationDegrees]);

-  useEffect(() => {
-    setMapCenter(localCenter.x, localCenter.y);
-  }, [localCenter]);
+	useEffect(() => {
+		const center = screenCenter ?? {x: 0, y: 0};
+		const localCenter = screenToLocal(center.x, center.y);
+		const coordinates = localToCoordinates(localCenter.x, localCenter.y);
+		setLocalCenter({x: coordinates.latitude, y: coordinates.longitude});
+	}, [position]);

-  function setRotationFromDegrees(degrees: number) {
-    rotateToAngle((degrees * Math.PI) / 180);
-  }

-  function pan({ x, y }: { x: number; y: number }) {
-    const coordinates = coordinatesToLocal(x, y);
-    setTransform(coordinates.x, coordinates.y);
-  }
+	useEffect(() => {
+		setMapCenter(localCenter.x, localCenter.y);
+	}, [localCenter]);

-  if (!routeData) {
-    console.error("routeData is null");
-    return null;
-  }
+	function setRotationFromDegrees(degrees: number) {
+		rotateToAngle(degrees * Math.PI / 180);
+	}

-  return (
-    <Stack
-      position="absolute"
-      right={8}
-      top={8}
-      bottom={8}
-      p={2}
-      gap={1}
-      minWidth="400px"
-      bgcolor="primary.main"
-      border="1px solid #e0e0e0"
-      borderRadius={2}
-    >
-      <Typography variant="h6" sx={{ mb: 2, color: "#fff" }} textAlign="center">
-        Детали о достопримечательностях
-      </Typography>
+	function pan({x, y}: {x: number, y: number}) {
+		const coordinates = coordinatesToLocal(x,y);
+		setTransform(coordinates.x, coordinates.y);
+	}

-      <Stack spacing={2} direction="row" alignItems="center">
-        <TextField
-          type="number"
-          label="Минимальный масштаб"
-          variant="filled"
-          value={minScale}
-          onChange={(e) => setMinScale(Number(e.target.value))}
-          style={{ backgroundColor: "#222", borderRadius: 4 }}
-          sx={{
-            "& .MuiInputLabel-root": {
-              color: "#fff",
-            },
-            "& .MuiInputBase-input": {
-              color: "#fff",
-            },
-          }}
-          slotProps={{
-            input: {
-              min: 0.1,
-            },
-          }}
-        />
-        <TextField
-          type="number"
-          label="Максимальный масштаб"
-          variant="filled"
-          value={maxScale}
-          onChange={(e) => setMaxScale(Number(e.target.value))}
-          style={{ backgroundColor: "#222", borderRadius: 4, color: "#fff" }}
-          sx={{
-            "& .MuiInputLabel-root": {
-              color: "#fff",
-            },
-            "& .MuiInputBase-input": {
-              color: "#fff",
-            },
-          }}
-          slotProps={{
-            input: {
-              min: 0.1,
-            },
-          }}
-        />
-      </Stack>
+	if(!routeData) {
+		console.error("routeData is null");
+		return null;
+	}

-      <TextField
-        type="number"
-        label="Поворот (в градусах)"
-        variant="filled"
-        value={rotationDegrees}
-        onChange={(e) => {
-          const value = Number(e.target.value);
-          if (!isNaN(value)) {
-            setRotationFromDegrees(value);
-          }
-        }}
-        onKeyDown={(e) => {
-          if (e.key === "Enter") {
-            e.currentTarget.blur();
-          }
-        }}
-        style={{ backgroundColor: "#222", borderRadius: 4 }}
-        sx={{
-          "& .MuiInputLabel-root": {
-            color: "#fff",
-          },
-          "& .MuiInputBase-input": {
-            color: "#fff",
-          },
-        }}
-        slotProps={{
-          input: {
-            min: 0,
-            max: 360,
-          },
-        }}
-      />
+	return (
+		<Stack
+			position="absolute" right={8} top={8} bottom={8} p={2}
+			gap={1}
+			minWidth="400px" bgcolor="primary.main"
+			border="1px solid #e0e0e0" borderRadius={2}
+		>
+			<Typography variant="h6" sx={{ mb: 2 }} textAlign="center">
+				Детали о достопримечательностях
+			</Typography>

-      <Stack direction="row" spacing={2}>
-        <TextField
-          type="number"
-          label="Центр карты, широта"
-          variant="filled"
-          value={Math.round(localCenter.x * 100000) / 100000}
-          onChange={(e) => {
-            setLocalCenter((prev) => ({ ...prev, x: Number(e.target.value) }));
-            pan({ x: Number(e.target.value), y: localCenter.y });
-          }}
-          style={{ backgroundColor: "#222", borderRadius: 4 }}
-          sx={{
-            "& .MuiInputLabel-root": {
-              color: "#fff",
-            },
-            "& .MuiInputBase-input": {
-              color: "#fff",
-            },
-          }}
-        />
-        <TextField
-          type="number"
-          label="Центр карты, высота"
-          variant="filled"
-          value={Math.round(localCenter.y * 100000) / 100000}
-          onChange={(e) => {
-            setLocalCenter((prev) => ({ ...prev, y: Number(e.target.value) }));
-            pan({ x: localCenter.x, y: Number(e.target.value) });
-          }}
-          style={{ backgroundColor: "#222", borderRadius: 4 }}
-          sx={{
-            "& .MuiInputLabel-root": {
-              color: "#fff",
-            },
-            "& .MuiInputBase-input": {
-              color: "#fff",
-            },
-          }}
-        />
-      </Stack>
+			<Stack spacing={2} direction="row" alignItems="center">
+				<TextField
+					type="number"
+					label="Минимальный масштаб"
+					variant="filled"
+					value={minScale}
+					onChange={(e) => setMinScale(Number(e.target.value))}
+					style={{backgroundColor: "#222", borderRadius: 4}}
+					sx={{
+						'& .MuiInputLabel-root.Mui-focused': {
+							color: "#fff"
+						}
+					}}
+					slotProps={{
+						input: {
+							min: 0.1
+						}
+					}}
+				/>
+				<TextField
+					type="number"
+					label="Максимальный масштаб"
+					variant="filled"
+					value={maxScale}
+					onChange={(e) => setMaxScale(Number(e.target.value))}
+					style={{backgroundColor: "#222", borderRadius: 4}}
+					sx={{
+						'& .MuiInputLabel-root.Mui-focused': {
+							color: "#fff"
+						}
+					}}
+					slotProps={{
+						input: {
+							min: 0.1
+						}
+					}}
+				/>
+			</Stack>

-      <Button
-        variant="contained"
-        color="secondary"
-        sx={{ mt: 2 }}
-        onClick={() => {
-          saveChanges();
-        }}
-      >
-        Сохранить изменения
-      </Button>
-    </Stack>
-  );
-}
+			<TextField
+				type="number"
+				label="Поворот (в градусах)"
+				variant="filled"
+				value={rotationDegrees}
+				onChange={(e) => {
+					const value = Number(e.target.value);
+					if (!isNaN(value)) {
+						setRotationFromDegrees(value);
+					}
+				}}
+				onKeyDown={(e) => {
+					if (e.key === 'Enter') {
+						e.currentTarget.blur();
+					}
+				}}
+				style={{backgroundColor: "#222", borderRadius: 4}}
+				sx={{
+					'& .MuiInputLabel-root.Mui-focused': {
+						color: "#fff"
+					}
+				}}
+				slotProps={{
+					input: {
+						min: 0,
+						max: 360
+					}
+				}}
+			/>
+
+			<Stack direction="row" spacing={2}>
+				<TextField
+					type="number"
+					label="Центр карты, широта"
+					variant="filled"
+					value={Math.round(localCenter.x*100000)/100000}
+					onChange={(e) => {
+						setLocalCenter(prev => ({...prev, x: Number(e.target.value)}))
+						pan({x: Number(e.target.value), y: localCenter.y});
+					}}
+					style={{backgroundColor: "#222", borderRadius: 4}}
+					sx={{
+						'& .MuiInputLabel-root.Mui-focused': {
+							color: "#fff"
+						}
+					}}
+				/>
+				<TextField
+					type="number"
+					label="Центр карты, высота" 
+					variant="filled"
+					value={Math.round(localCenter.y*100000)/100000}
+					onChange={(e) => {
+						setLocalCenter(prev => ({...prev, y: Number(e.target.value)}))
+						pan({x: localCenter.x, y: Number(e.target.value)});
+					}}
+					style={{backgroundColor: "#222", borderRadius: 4}}
+					sx={{
+						'& .MuiInputLabel-root.Mui-focused': {
+							color: "#fff"
+						}
+					}}
+				/>
+			</Stack>
+
+			<Button
+				variant="contained"
+				color="secondary"
+				sx={{ mt: 2 }}
+				onClick={() => {
+					saveChanges();
+				}}
+			>
+				Сохранить изменения
+			</Button>
+		</Stack>
+	);
+}
--- a/src/pages/route-preview/Station.tsx
+++ b/src/pages/route-preview/Station.tsx
@ -1,148 +1,109 @@
 import { FederatedMouseEvent, Graphics } from "pixi.js";
-import {
-  BACKGROUND_COLOR,
-  PATH_COLOR,
-  STATION_RADIUS,
-  STATION_OUTLINE_WIDTH,
-  UP_SCALE,
-} from "./Constants";
+import { BACKGROUND_COLOR, PATH_COLOR, STATION_RADIUS, STATION_OUTLINE_WIDTH, UP_SCALE } from "./Constants";
 import { useTransform } from "./TransformContext";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { StationData } from "./types";
 import { useMapData } from "./MapDataContext";
 import { coordinatesToLocal } from "./utils";
-import { observer } from "mobx-react-lite";
-import { languageStore } from "@stores";

 interface StationProps {
-  station: StationData;
-  ruLabel: string | null;
+	station: StationData;
 }

-export const Station = observer(
-  ({ station, ruLabel }: Readonly<StationProps>) => {
-    const draw = useCallback((g: Graphics) => {
-      g.clear();
-      const coordinates = coordinatesToLocal(
-        station.latitude,
-        station.longitude
-      );
-      g.circle(
-        coordinates.x * UP_SCALE,
-        coordinates.y * UP_SCALE,
-        STATION_RADIUS
-      );
-      g.fill({ color: PATH_COLOR });
-      g.stroke({ color: BACKGROUND_COLOR, width: STATION_OUTLINE_WIDTH });
-    }, []);
+export function Station({
+	station
+}: Readonly<StationProps>) {
+	const draw = useCallback((g: Graphics) => {
+		g.clear();
+		const coordinates = coordinatesToLocal(station.latitude, station.longitude);
+		g.circle(coordinates.x * UP_SCALE, coordinates.y * UP_SCALE, STATION_RADIUS);
+		g.fill({color: PATH_COLOR});
+		g.stroke({color: BACKGROUND_COLOR, width: STATION_OUTLINE_WIDTH});
+	}, []);

-    return (
-      <pixiContainer>
-        <pixiGraphics draw={draw} />
-        <StationLabel station={station} ruLabel={ruLabel} />
-      </pixiContainer>
-    );
-  }
-);
+	return (
+		<pixiContainer>
+			<pixiGraphics draw={draw}/>
+			<StationLabel station={station}/>
+		</pixiContainer>
+	);
+}

-export const StationLabel = observer(
-  ({ station, ruLabel }: Readonly<StationProps>) => {
-    const { language } = languageStore;
-    const { rotation, scale } = useTransform();
-    const { setStationOffset } = useMapData();
+export function StationLabel({
+	station
+}: Readonly<StationProps>) {
+	const { rotation, scale } = useTransform();
+	const { setStationOffset } = useMapData();

-    const [position, setPosition] = useState({
-      x: station.offset_x,
-      y: station.offset_y,
-    });
-    const [isDragging, setIsDragging] = useState(false);
+	const [position, setPosition] = useState({ x: station.offset_x, y: station.offset_y });
+	const [isDragging, setIsDragging] = useState(false);
    const [startPosition, setStartPosition] = useState({ x: 0, y: 0 });
-    const [startMousePosition, setStartMousePosition] = useState({
-      x: 0,
-      y: 0,
-    });
+    const [startMousePosition, setStartMousePosition] = useState({ x: 0, y: 0 });

-    if (!station) {
-      console.error("station is null");
-      return null;
-    }
+	if(!station) {
+		console.error("station is null");
+		return null;
+	}

    const handlePointerDown = (e: FederatedMouseEvent) => {
-      setIsDragging(true);
-      setStartPosition({
-        x: position.x,
-        y: position.y,
-      });
-      setStartMousePosition({
-        x: e.globalX,
-        y: e.globalY,
-      });
-
-      e.stopPropagation();
+        setIsDragging(true);
+        setStartPosition({
+            x: position.x,
+            y: position.y
+        });
+		setStartMousePosition({
+			x: e.globalX,
+			y: e.globalY
+		});
+		
+        e.stopPropagation();
    };
    const handlePointerMove = (e: FederatedMouseEvent) => {
-      if (!isDragging) return;
-      const dx = e.globalX - startMousePosition.x;
-      const dy = e.globalY - startMousePosition.y;
-      const newPosition = {
-        x: startPosition.x + dx,
-        y: startPosition.y + dy,
-      };
-      setPosition(newPosition);
-      setStationOffset(station.id, newPosition.x, newPosition.y);
-      e.stopPropagation();
+        if (!isDragging) return;
+		const dx = (e.globalX - startMousePosition.x);
+		const dy = (e.globalY - startMousePosition.y);
+		const newPosition = {
+			x: startPosition.x + dx,
+			y: startPosition.y + dy
+		};
+		setPosition(newPosition);
+		setStationOffset(station.id, newPosition.x, newPosition.y);
+        e.stopPropagation();
    };

    const handlePointerUp = (e: FederatedMouseEvent) => {
-      setIsDragging(false);
-      e.stopPropagation();
+        setIsDragging(false);
+        e.stopPropagation();
    };
-    const coordinates = coordinatesToLocal(station.latitude, station.longitude);
+	const coordinates = coordinatesToLocal(station.latitude, station.longitude);

-    return (
-      <pixiContainer
-        eventMode="static"
-        interactive
-        onPointerDown={handlePointerDown}
-        onGlobalPointerMove={handlePointerMove}
-        onPointerUp={handlePointerUp}
-        onPointerUpOutside={handlePointerUp}
-        width={48}
-        height={48}
-        x={coordinates.x * UP_SCALE}
-        y={coordinates.y * UP_SCALE}
-        rotation={-rotation}
-      >
-        <pixiText
-          anchor={{ x: 1, y: 0.5 }}
-          text={station.name}
-          position={{
-            x: position.x / scale + 24,
-            y: position.y / scale,
-          }}
-          style={{
-            fontSize: 26,
-            fontWeight: "bold",
-            fill: "#ffffff",
-          }}
-        />
-
-        {ruLabel && (
-          <pixiText
-            anchor={{ x: 1, y: -1 }}
-            text={ruLabel}
-            position={{
-              x: position.x / scale + 24,
-              y: position.y / scale,
-            }}
-            style={{
-              fontSize: 16,
-              fontWeight: "bold",
-              fill: "#CCCCCC",
-            }}
-          />
-        )}
-      </pixiContainer>
-    );
-  }
-);
+	return (
+		<pixiContainer
+			eventMode='static'
+			interactive
+			onPointerDown={handlePointerDown}
+			onGlobalPointerMove={handlePointerMove}
+			onPointerUp={handlePointerUp}
+			onPointerUpOutside={handlePointerUp}
+			width={48}
+			height={48}
+			x={coordinates.x * UP_SCALE}
+			y={coordinates.y * UP_SCALE}
+			rotation={-rotation}
+		>
+			<pixiText
+				anchor={{x: 0.5, y: 0.5}}
+				text={station.name}
+				position={{
+					x: position.x/scale,
+					y: position.y/scale
+				}}
+				style={{
+					fontSize: 48,
+					fontWeight: 'bold',
+					fill: "#ffffff"
+				}}
+			/>
+		</pixiContainer>
+	);
+}
--- a/src/pages/route-preview/TransformContext.tsx
+++ b/src/pages/route-preview/TransformContext.tsx
@ -1,204 +1,150 @@
-import {
-  createContext,
-  ReactNode,
-  useContext,
-  useMemo,
-  useState,
-  useCallback,
-} from "react";
+import { createContext, ReactNode, useContext, useMemo, useState } from "react";
 import { SCALE_FACTOR, UP_SCALE } from "./Constants";

-const TransformContext = createContext<{
-  position: { x: number; y: number };
-  scale: number;
-  rotation: number;
-  screenCenter?: { x: number; y: number };

-  setPosition: React.Dispatch<React.SetStateAction<{ x: number; y: number }>>;
-  setScale: React.Dispatch<React.SetStateAction<number>>;
-  setRotation: React.Dispatch<React.SetStateAction<number>>;
-  screenToLocal: (x: number, y: number) => { x: number; y: number };
-  localToScreen: (x: number, y: number) => { x: number; y: number };
-  rotateToAngle: (to: number, fromPosition?: { x: number; y: number }) => void;
-  setTransform: (
-    latitude: number,
-    longitude: number,
-    rotationDegrees?: number,
-    scale?: number
-  ) => void;
-  setScreenCenter: React.Dispatch<
-    React.SetStateAction<{ x: number; y: number } | undefined>
-  >;
+const TransformContext = createContext<{
+    position: { x: number, y: number },
+    scale: number,
+    rotation: number,
+    screenCenter?: { x: number, y: number },
+
+    setPosition: React.Dispatch<React.SetStateAction<{ x: number, y: number }>>,
+    setScale: React.Dispatch<React.SetStateAction<number>>,
+    setRotation: React.Dispatch<React.SetStateAction<number>>,
+	screenToLocal: (x: number, y: number) => { x: number, y: number },
+	localToScreen: (x: number, y: number) => { x: number, y: number },
+	rotateToAngle: (to: number, fromPosition?: {x: number, y: number}) => void,
+	setTransform: (latitude: number, longitude: number, rotationDegrees?: number, scale?: number) => void,
+    setScreenCenter: React.Dispatch<React.SetStateAction<{ x: number, y: number } | undefined>>
 }>({
-  position: { x: 0, y: 0 },
-  scale: 1,
-  rotation: 0,
-  screenCenter: undefined,
-  setPosition: () => {},
-  setScale: () => {},
-  setRotation: () => {},
-  screenToLocal: () => ({ x: 0, y: 0 }),
-  localToScreen: () => ({ x: 0, y: 0 }),
-  rotateToAngle: () => {},
-  setTransform: () => {},
-  setScreenCenter: () => {},
+    position: { x: 0, y: 0 },
+    scale: 1,
+    rotation: 0,
+    screenCenter: undefined,
+    setPosition: () => {},
+    setScale: () => {},
+    setRotation: () => {},
+	screenToLocal: () => ({ x: 0, y: 0 }),
+	localToScreen: () => ({ x: 0, y: 0 }),
+	rotateToAngle: () => {},
+	setTransform: () => {},
+    setScreenCenter: () => {}
 });

 // Provider component
 export const TransformProvider = ({ children }: { children: ReactNode }) => {
-  const [position, setPosition] = useState({ x: 0, y: 0 });
-  const [scale, setScale] = useState(1);
-  const [rotation, setRotation] = useState(0);
-  const [screenCenter, setScreenCenter] = useState<{ x: number; y: number }>();
+    const [position, setPosition] = useState({ x: 0, y: 0 });
+    const [scale, setScale] = useState(1);
+    const [rotation, setRotation] = useState(0);
+    const [screenCenter, setScreenCenter] = useState<{x: number, y: number}>();

-  const screenToLocal = useCallback(
-    (screenX: number, screenY: number) => {
-      // Translate point relative to current pan position
-      const translatedX = (screenX - position.x) / scale;
-      const translatedY = (screenY - position.y) / scale;
+    function screenToLocal(screenX: number, screenY: number) {
+        // Translate point relative to current pan position
+        const translatedX = (screenX - position.x) / scale;
+        const translatedY = (screenY - position.y) / scale;

-      // Rotate point around center
-      const cosRotation = Math.cos(-rotation); // Negative rotation to reverse transform
-      const sinRotation = Math.sin(-rotation);
-      const rotatedX = translatedX * cosRotation - translatedY * sinRotation;
-      const rotatedY = translatedX * sinRotation + translatedY * cosRotation;
+        // Rotate point around center
+        const cosRotation = Math.cos(-rotation); // Negative rotation to reverse transform
+        const sinRotation = Math.sin(-rotation);
+        const rotatedX = translatedX * cosRotation - translatedY * sinRotation;
+        const rotatedY = translatedX * sinRotation + translatedY * cosRotation;

-      return {
-        x: rotatedX / UP_SCALE,
-        y: rotatedY / UP_SCALE,
-      };
-    },
-    [position.x, position.y, scale, rotation]
-  );
+        return {
+            x: rotatedX / UP_SCALE,
+            y: rotatedY / UP_SCALE
+        };
+    }

-  // Inverse of screenToLocal
-  const localToScreen = useCallback(
-    (localX: number, localY: number) => {
-      const upscaledX = localX * UP_SCALE;
-      const upscaledY = localY * UP_SCALE;
+    // Inverse of screenToLocal
+    function localToScreen(localX: number, localY: number) {

-      const cosRotation = Math.cos(rotation);
-      const sinRotation = Math.sin(rotation);
-      const rotatedX = upscaledX * cosRotation - upscaledY * sinRotation;
-      const rotatedY = upscaledX * sinRotation + upscaledY * cosRotation;
+        const upscaledX = localX * UP_SCALE;
+        const upscaledY = localY * UP_SCALE;

-      const translatedX = rotatedX * scale + position.x;
-      const translatedY = rotatedY * scale + position.y;
+        const cosRotation = Math.cos(rotation);
+        const sinRotation = Math.sin(rotation);
+        const rotatedX = upscaledX * cosRotation - upscaledY * sinRotation;
+        const rotatedY = upscaledX * sinRotation + upscaledY * cosRotation;

-      return {
-        x: translatedX,
-        y: translatedY,
-      };
-    },
-    [position.x, position.y, scale, rotation]
-  );
+        const translatedX = rotatedX*scale + position.x;
+        const translatedY = rotatedY*scale + position.y;

-  const rotateToAngle = useCallback(
-    (to: number, fromPosition?: { x: number; y: number }) => {
-      const rotationDiff = to - rotation;
+        return {
+            x: translatedX,
+            y: translatedY
+        };
+    }
+    

-      const center = screenCenter ?? { x: 0, y: 0 };
-      const cosDelta = Math.cos(rotationDiff);
-      const sinDelta = Math.sin(rotationDiff);

-      const currentFromPosition = fromPosition ?? position;
+	function rotateToAngle(to: number, fromPosition?: {x: number, y: number}) {
+        setRotation(to);
+        const rotationDiff = to - rotation;
+        
+		const center = screenCenter ?? {x: 0, y: 0};
+		const cosDelta = Math.cos(rotationDiff);
+		const sinDelta = Math.sin(rotationDiff);

-      const newPosition = {
-        x:
-          center.x * (1 - cosDelta) +
-          currentFromPosition.x * cosDelta +
-          (center.y - currentFromPosition.y) * sinDelta,
-        y:
-          center.y * (1 - cosDelta) +
-          currentFromPosition.y * cosDelta +
-          (currentFromPosition.x - center.x) * sinDelta,
-      };
+        fromPosition ??= position;

-      // Update both rotation and position in a single batch to avoid stale closure
-      setRotation(to);
-      setPosition(newPosition);
-    },
-    [rotation, position, screenCenter]
-  );
+		setPosition({
+			x: center.x * (1 - cosDelta) + fromPosition.x * cosDelta + (center.y - fromPosition.y) * sinDelta,
+			y: center.y * (1 - cosDelta) + fromPosition.y * cosDelta + (fromPosition.x - center.x) * sinDelta
+		});
+	}

-  const setTransform = useCallback(
-    (
-      latitude: number,
-      longitude: number,
-      rotationDegrees?: number,
-      useScale?: number
-    ) => {
-      const selectedRotation =
-        rotationDegrees !== undefined
-          ? (rotationDegrees * Math.PI) / 180
-          : rotation;
-      const selectedScale =
-        useScale !== undefined ? useScale / SCALE_FACTOR : scale;
-      const center = screenCenter ?? { x: 0, y: 0 };
+    function setTransform(latitude: number, longitude: number, rotationDegrees?: number, useScale   ?: number) {
+        const selectedRotation = rotationDegrees ? (rotationDegrees * Math.PI / 180) : rotation;
+        const selectedScale = useScale ? useScale/SCALE_FACTOR : scale;
+        const center = screenCenter ?? {x: 0, y: 0};
+        console.log("center", center.x, center.y);
+        const newPosition = {
+            x: -latitude * UP_SCALE * selectedScale,
+            y: -longitude * UP_SCALE * selectedScale
+        };

-      console.log("center", center.x, center.y);
+        const cos = Math.cos(selectedRotation);
+        const sin = Math.sin(selectedRotation);
+        
+        // Translate point relative to center, rotate, then translate back
+        const dx = newPosition.x;
+        const dy = newPosition.y;
+        newPosition.x = (dx * cos - dy * sin) + center.x;
+        newPosition.y = (dx * sin + dy * cos) + center.y;

-      const newPosition = {
-        x: -latitude * UP_SCALE * selectedScale,
-        y: -longitude * UP_SCALE * selectedScale,
-      };
+        
+        setPosition(newPosition);
+        setRotation(selectedRotation);
+        setScale(selectedScale);
+    }

-      const cosRot = Math.cos(selectedRotation);
-      const sinRot = Math.sin(selectedRotation);
+    const value = useMemo(() => ({
+        position,
+        scale,
+        rotation,
+        screenCenter,
+        setPosition,
+        setScale,
+        setRotation,
+        rotateToAngle,
+		screenToLocal,
+        localToScreen,
+        setTransform,
+        setScreenCenter
+    }), [position, scale, rotation, screenCenter]);

-      // Translate point relative to center, rotate, then translate back
-      const dx = newPosition.x;
-      const dy = newPosition.y;
-      newPosition.x = dx * cosRot - dy * sinRot + center.x;
-      newPosition.y = dx * sinRot + dy * cosRot + center.y;
-
-      // Batch state updates to avoid intermediate renders
-      setPosition(newPosition);
-      setRotation(selectedRotation);
-      setScale(selectedScale);
-    },
-    [rotation, scale, screenCenter]
-  );
-
-  const value = useMemo(
-    () => ({
-      position,
-      scale,
-      rotation,
-      screenCenter,
-      setPosition,
-      setScale,
-      setRotation,
-      rotateToAngle,
-      screenToLocal,
-      localToScreen,
-      setTransform,
-      setScreenCenter,
-    }),
-    [
-      position,
-      scale,
-      rotation,
-      screenCenter,
-      rotateToAngle,
-      screenToLocal,
-      localToScreen,
-      setTransform,
-    ]
-  );
-
-  return (
-    <TransformContext.Provider value={value}>
-      {children}
-    </TransformContext.Provider>
-  );
+    return (
+        <TransformContext.Provider value={value}>
+            {children}
+        </TransformContext.Provider>
+    );
 };

 // Custom hook for easy access to transform values
 export const useTransform = () => {
-  const context = useContext(TransformContext);
-  if (!context) {
-    throw new Error("useTransform must be used within a TransformProvider");
-  }
-  return context;
-};
+    const context = useContext(TransformContext);
+    if (!context) {
+        throw new Error('useTransform must be used within a TransformProvider');
+    }
+    return context;
+};
--- a/src/pages/route-preview/TravelPath.tsx
+++ b/src/pages/route-preview/TravelPath.tsx
@ -3,32 +3,37 @@ import { useCallback } from "react";
 import { PATH_COLOR, PATH_WIDTH } from "./Constants";
 import { coordinatesToLocal } from "./utils";

+
 interface TravelPathProps {
-  points: { x: number; y: number }[];
+	points: {x: number, y: number}[];
 }

-export function TravelPath({ points }: Readonly<TravelPathProps>) {
-  const draw = useCallback(
-    (g: Graphics) => {
-      g.clear();
-      const coordStart = coordinatesToLocal(points[0].x, points[0].y);
-      g.moveTo(coordStart.x, coordStart.y);
-      for (let i = 1; i <= points.length - 1; i++) {
-        const coordinates = coordinatesToLocal(points[i].x, points[i].y);
-        g.lineTo(coordinates.x, coordinates.y);
-      }
-      g.stroke({
-        color: PATH_COLOR,
-        width: PATH_WIDTH,
-      });
-    },
-    [points]
-  );
+export function TravelPath({
+	points
+}: Readonly<TravelPathProps>) {

-  if (points.length === 0) {
-    console.error("points is empty");
-    return null;
-  }
+	const draw = useCallback((g: Graphics) => {
+		g.clear();
+		const coordStart = coordinatesToLocal(points[0].x, points[0].y);
+		g.moveTo(coordStart.x, coordStart.y);
+		for (let i = 1; i < points.length - 1; i++) {
+			const coordinates = coordinatesToLocal(points[i].x, points[i].y);
+			g.lineTo(coordinates.x, coordinates.y);
+		}
+		g.stroke({
+			color: PATH_COLOR,
+			width: PATH_WIDTH
+		});
+	}, [points]);

-  return <pixiGraphics draw={draw} />;
-}
+	if(points.length === 0) {
+		console.error("points is empty");
+		return null;
+	}
+
+	return (
+		<pixiGraphics
+		draw={draw}
+		/>
+	);
+}
--- a/src/pages/route-preview/Widgets.tsx
+++ b/src/pages/route-preview/Widgets.tsx
@ -1,43 +1,31 @@
 import { Stack, Typography } from "@mui/material";

 export function Widgets() {
-  return (
-    <Stack
-      direction="column"
-      spacing={2}
-      position="absolute"
-      top={32}
-      left={32}
-      sx={{ pointerEvents: "none" }}
-    >
-      <Stack
-        bgcolor="primary.main"
-        width={361}
-        height={96}
-        p={2}
-        m={2}
-        borderRadius={2}
-        alignItems="center"
-        justifyContent="center"
-      >
-        <Typography variant="h6" sx={{ color: "#fff" }}>
-          Станция
-        </Typography>
-      </Stack>
-      <Stack
-        bgcolor="primary.main"
-        width={223}
-        height={262}
-        p={2}
-        m={2}
-        borderRadius={2}
-        alignItems="center"
-        justifyContent="center"
-      >
-        <Typography variant="h6" sx={{ color: "#fff" }}>
-          Погода
-        </Typography>
-      </Stack>
-    </Stack>
-  );
+	return (
+		<Stack
+			direction="column" spacing={2}
+			position="absolute"
+			top={32} left={32}
+			sx={{ pointerEvents: 'none' }}
+		>
+			<Stack bgcolor="primary.main"
+				width={361} height={96}
+				p={2} m={2}
+				borderRadius={2}
+				alignItems="center"
+				justifyContent="center"
+			>
+				<Typography variant="h6">Станция</Typography>
+			</Stack>
+			<Stack bgcolor="primary.main"
+				width={223} height={262}
+				p={2} m={2}
+				borderRadius={2}
+				alignItems="center"
+				justifyContent="center"
+			>
+				<Typography variant="h6">Погода</Typography>
+			</Stack>
+		</Stack>
+	)
 }
--- a/src/pages/route-preview/index.tsx
+++ b/src/pages/route-preview/index.tsx
@ -1,14 +1,18 @@
 import { useRef, useEffect, useState } from "react";

-import { Application, ApplicationRef, extend } from "@pixi/react";
 import {
-  Container,
-  Graphics,
-  Sprite,
-  Texture,
-  TilingSprite,
-  Text,
-} from "pixi.js";
+    Application,
+    ApplicationRef,
+    extend
+} from '@pixi/react';
+import {
+    Container,
+    Graphics,
+    Sprite,
+    Texture,
+    TilingSprite,
+	Text
+} from 'pixi.js';
 import { Stack } from "@mui/material";
 import { MapDataProvider, useMapData } from "./MapDataContext";
 import { TransformProvider, useTransform } from "./TransformContext";
@ -21,156 +25,128 @@ import { LeftSidebar } from "./LeftSidebar";
 import { RightSidebar } from "./RightSidebar";
 import { Widgets } from "./Widgets";
 import { coordinatesToLocal } from "./utils";
-import { LanguageSwitch } from "@/components/LanguageSwitch";
-import { languageStore } from "@stores";
-import { observer } from "mobx-react-lite";

 extend({
-  Container,
-  Graphics,
-  Sprite,
-  Texture,
-  TilingSprite,
-  Text,
+    Container,
+    Graphics,
+    Sprite,
+    Texture,
+    TilingSprite,
+	Text
 });

 export const RoutePreview = () => {
-  return (
-    <MapDataProvider>
-      <TransformProvider>
-        <Stack direction="row" height="100vh" width="100vw" overflow="hidden">
-          <div
-            style={{
-              position: "absolute",
-              top: 0,
-              left: "50%",
-              transform: "translateX(-50%)",
-              zIndex: 1000,
-            }}
-          >
-            <LanguageSwitch />
-          </div>
-          <LeftSidebar />
-          <Stack direction="row" flex={1} position="relative" height="100%">
-            <Widgets />
-            <RouteMap />
-            <RightSidebar />
-          </Stack>
-        </Stack>
-      </TransformProvider>
-    </MapDataProvider>
-  );
+	return (
+		<MapDataProvider>
+			<TransformProvider>
+				<Stack direction="row" height="100vh" width="100vw" overflow="hidden">
+					<LeftSidebar />
+					<Stack direction="row" flex={1} position="relative" height="100%">
+						<Widgets />
+						<RouteMap />
+						<RightSidebar />
+					</Stack>
+
+				</Stack>
+			</TransformProvider>
+		</MapDataProvider>
+	);
 };

-export const RouteMap = observer(() => {
-  const { language } = languageStore;
-  const { setPosition, screenToLocal, setTransform, screenCenter } =
-    useTransform();
-  const { routeData, stationData, sightData, originalRouteData } = useMapData();
-  console.log(stationData);
-  const [points, setPoints] = useState<{ x: number; y: number }[]>([]);
-  const [isSetup, setIsSetup] = useState(false);

-  const parentRef = useRef<HTMLDivElement>(null);
+export function RouteMap() {
+	const { setPosition, screenToLocal, setTransform, screenCenter } = useTransform();
+	const {
+		routeData, stationData, sightData, originalRouteData
+	} = useMapData();
+	const [points, setPoints] = useState<{x: number, y: number}[]>([]);
+	const [isSetup, setIsSetup] = useState(false);
+  
+	const parentRef = useRef<HTMLDivElement>(null);
+  
+	useEffect(() => {
+		if (originalRouteData) {
+			const path = originalRouteData?.path;
+			const points = path?.map(([x, y]: [number, number]) => ({x: x * UP_SCALE, y: y * UP_SCALE})) ?? [];
+			setPoints(points);
+		}
+	}, [originalRouteData]);

-  useEffect(() => {
-    if (originalRouteData) {
-      const path = originalRouteData?.path;
-      const points =
-        path?.map(([x, y]: [number, number]) => ({
-          x: x * UP_SCALE,
-          y: y * UP_SCALE,
-        })) ?? [];
-      setPoints(points);
-    }
-  }, [originalRouteData]);
+	useEffect(() => {
+		if(isSetup || !screenCenter) {
+			return;
+		}

-  useEffect(() => {
-    if (isSetup || !screenCenter) {
-      return;
-    }
+		if (
+			originalRouteData?.center_latitude === originalRouteData?.center_longitude &&
+			originalRouteData?.center_latitude === 0
+		) {
+			if (points.length > 0) {
+				let boundingBox = {
+					from: {x: Infinity, y: Infinity},
+					to: {x: -Infinity, y: -Infinity}
+				};
+				for (const point of points) {
+					boundingBox.from.x = Math.min(boundingBox.from.x, point.x);
+					boundingBox.from.y = Math.min(boundingBox.from.y, point.y);
+					boundingBox.to.x = Math.max(boundingBox.to.x, point.x);
+					boundingBox.to.y = Math.max(boundingBox.to.y, point.y);
+				}
+				const newCenter = {
+					x: -(boundingBox.from.x + boundingBox.to.x) / 2, 
+					y: -(boundingBox.from.y + boundingBox.to.y) / 2
+				};
+				setPosition(newCenter);
+				setIsSetup(true);
+			}
+		} else if (
+			originalRouteData?.center_latitude &&
+			originalRouteData?.center_longitude
+		) {
+			const coordinates = coordinatesToLocal(originalRouteData?.center_latitude, originalRouteData?.center_longitude);
+			
+			setTransform(
+				coordinates.x,
+				coordinates.y,
+				originalRouteData?.rotate,
+				originalRouteData?.scale_min
+			);
+			setIsSetup(true);
+		}
+	}, [points, originalRouteData?.center_latitude, originalRouteData?.center_longitude, originalRouteData?.rotate, isSetup, screenCenter]);

-    if (
-      originalRouteData?.center_latitude ===
-        originalRouteData?.center_longitude &&
-      originalRouteData?.center_latitude === 0
-    ) {
-      if (points.length > 0) {
-        let boundingBox = {
-          from: { x: Infinity, y: Infinity },
-          to: { x: -Infinity, y: -Infinity },
-        };
-        for (const point of points) {
-          boundingBox.from.x = Math.min(boundingBox.from.x, point.x);
-          boundingBox.from.y = Math.min(boundingBox.from.y, point.y);
-          boundingBox.to.x = Math.max(boundingBox.to.x, point.x);
-          boundingBox.to.y = Math.max(boundingBox.to.y, point.y);
-        }
-        const newCenter = {
-          x: -(boundingBox.from.x + boundingBox.to.x) / 2,
-          y: -(boundingBox.from.y + boundingBox.to.y) / 2,
-        };
-        setPosition(newCenter);
-        setIsSetup(true);
-      }
-    } else if (
-      originalRouteData?.center_latitude &&
-      originalRouteData?.center_longitude
-    ) {
-      const coordinates = coordinatesToLocal(
-        originalRouteData?.center_latitude,
-        originalRouteData?.center_longitude
-      );

-      setTransform(
-        coordinates.x,
-        coordinates.y,
-        originalRouteData?.rotate,
-        originalRouteData?.scale_min
-      );
-      setIsSetup(true);
-    }
-  }, [
-    points,
-    originalRouteData?.center_latitude,
-    originalRouteData?.center_longitude,
-    originalRouteData?.rotate,
-    isSetup,
-    screenCenter,
-  ]);
+	if (!routeData || !stationData || !sightData) {
+		console.error("routeData, stationData or sightData is null");
+		return <div>Loading...</div>;
+	}

-  if (!routeData || !stationData || !sightData) {
-    console.error("routeData, stationData or sightData is null");
-    return <div>Loading...</div>;
-  }

-  return (
-    <div style={{ width: "100%", height: "100%" }} ref={parentRef}>
-      <Application resizeTo={parentRef} background="#fff">
-        <InfiniteCanvas>
-          <TravelPath points={points} />
-          {stationData[language].map((obj, index) => (
-            <Station
-              station={obj}
-              key={obj.id}
-              ruLabel={
-                language === "ru"
-                  ? stationData.en[index].name
-                  : stationData.ru[index].name
-              }
-            />
-          ))}
+	return (
+		<div style={{width: "100%", height:"100%"}} ref={parentRef}>
+			<Application
+				resizeTo={parentRef}
+				background="#fff"
+			>
+				<InfiniteCanvas>
+					<TravelPath points={points}/>
+					{stationData?.map((obj) => (
+						<Station station={obj} key={obj.id}/>
+					))}
+					{sightData?.map((obj, index) => (
+						<Sight sight={obj} id={index} key={obj.id}/>
+					))}

-          <pixiGraphics
-            draw={(g) => {
-              g.clear();
-              const localCenter = screenToLocal(0, 0);
-              g.circle(localCenter.x, localCenter.y, 10);
-              g.fill("#fff");
-            }}
-          />
-        </InfiniteCanvas>
-      </Application>
-    </div>
-  );
-});
+					<pixiGraphics
+						draw={(g) => {
+							g.clear();
+							const localCenter = screenToLocal(0,0);
+							g.circle(localCenter.x, localCenter.y, 10);
+							g.fill("#fff");
+						}}
+					/>
+				</InfiniteCanvas>
+			</Application>
+		</div>
+	)
+}
--- a/src/pages/route/create.tsx
+++ b/src/pages/route/create.tsx
@ -280,19 +280,13 @@ export const RouteCreate = () => {
        <TextField
          {...register("scale_min", {
            // required: 'Это поле является обязательным',
-            setValueAs: (value) => {
-              if (Number(value) < 0) {
-                return 0;
-              }
-              return Number(value);
-            },
+            setValueAs: (value) => Number(value),
          })}
          error={!!(errors as any)?.scale_min}
          helperText={(errors as any)?.scale_min?.message}
          margin="normal"
          fullWidth
          slotProps={{ inputLabel: { shrink: true } }}
-          inputProps={{ min: 0 }}
          type="number"
          label={"Масштаб (мин)"}
          name="scale_min"
@ -301,19 +295,13 @@ export const RouteCreate = () => {
        <TextField
          {...register("scale_max", {
            // required: 'Это поле является обязательным',
-            setValueAs: (value) => {
-              if (Number(value) < 0) {
-                return 0;
-              }
-              return Number(value);
-            },
+            setValueAs: (value) => Number(value),
          })}
          error={!!(errors as any)?.scale_max}
          helperText={(errors as any)?.scale_max?.message}
          margin="normal"
          fullWidth
          slotProps={{ inputLabel: { shrink: true } }}
-          inputProps={{ min: 0 }}
          type="number"
          label={"Масштаб (макс)"}
          name="scale_max"
--- a/src/pages/route/edit.tsx
+++ b/src/pages/route/edit.tsx
@ -9,7 +9,7 @@ import {
 } from "@mui/material";
 import { Edit, useAutocomplete } from "@refinedev/mui";
 import { useForm } from "@refinedev/react-hook-form";
-import { Controller, useWatch } from "react-hook-form";
+import { Controller } from "react-hook-form";
 import { useNavigate, useParams } from "react-router";
 import { LinkedItems } from "../../components/LinkedItems";
 import {
@ -76,11 +76,6 @@ export const RouteEdit = observer(() => {
    ...META_LANGUAGE(language),
  });

-  const carrierId = useWatch({ control, name: "carrier_id" });
-  const cityId = carrierAutocompleteProps.options.find(
-    (option) => option.id === carrierId
-  )?.city_id;
-
  const { autocompleteProps: governorAppealAutocompleteProps } =
    useAutocomplete({
      resource: "article",
@ -317,12 +312,7 @@ export const RouteEdit = observer(() => {
          <TextField
            {...register("scale_min", {
              // required: 'Это поле является обязательным',
-              setValueAs: (value) => {
-                if (Number(value) < 0) {
-                  return 0;
-                }
-                return Number(value);
-              },
+              setValueAs: (value) => Number(value),
            })}
            error={!!(errors as any)?.scale_min}
            helperText={(errors as any)?.scale_min?.message}
@ -337,12 +327,7 @@ export const RouteEdit = observer(() => {
          <TextField
            {...register("scale_max", {
              // required: 'Это поле является обязательным',
-              setValueAs: (value) => {
-                if (Number(value) < 0) {
-                  return 0;
-                }
-                return Number(value);
-              },
+              setValueAs: (value) => Number(value),
            })}
            error={!!(errors as any)?.scale_max}
            helperText={(errors as any)?.scale_max?.message}
@ -408,19 +393,18 @@ export const RouteEdit = observer(() => {
              parentResource="route"
              childResource="station"
              fields={stationFields}
-              title="остановки"
+              title="станции"
              dragAllowed={true}
-              cityId={cityId}
            />

-            {/* <LinkedItems<VehicleItem>
+            <LinkedItems<VehicleItem>
              type="edit"
              parentId={routeId}
              parentResource="route"
              childResource="vehicle"
              fields={vehicleFields}
              title="транспортные средства"
-            /> */}
+            />
          </>
        )}

--- a/src/pages/route/show.tsx
+++ b/src/pages/route/show.tsx
@ -80,17 +80,17 @@ export const RouteShow = observer(() => {
              parentResource="route"
              childResource="station"
              fields={stationFields}
-              title="остановки"
+              title="станции"
            />

-            {/* <LinkedItems<VehicleItem>
+            <LinkedItems<VehicleItem>
              type="show"
              parentId={record.id}
              parentResource="route"
              childResource="vehicle"
              fields={vehicleFields}
              title="транспортные средства"
-            /> */}
+            />

            <LinkedItems<SightItem>
              type="show"
@ -103,9 +103,10 @@ export const RouteShow = observer(() => {
          </>
        )}

-        <Box sx={{ display: "flex", justifyContent: "flex-start" }}>
-          <Button
-            variant="contained"
+        
+        <Box sx={{ display: 'flex', justifyContent: 'flex-start' }}>
+          <Button 
+            variant="contained" 
            color="primary"
            onClick={() => navigate(`/route-preview/${id}`)}
          >
--- a/src/pages/sight/create.tsx
+++ b/src/pages/sight/create.tsx
@ -22,7 +22,6 @@ import ExpandMoreIcon from "@mui/icons-material/ExpandMore";

 export const SightCreate = observer(() => {
  const { language, setLanguageAction } = languageStore;
-  const [coordinates, setCoordinates] = useState("");
  const [sightData, setSightData] = useState({
    name: EVERY_LANGUAGE(""),
    address: EVERY_LANGUAGE(""),
@ -80,7 +79,10 @@ export const SightCreate = observer(() => {
  });

  const [namePreview, setNamePreview] = useState("");
-  const [coordinatesPreview, setCoordinatesPreview] = useState("");
+  const [coordinatesPreview, setCoordinatesPreview] = useState({
+    latitude: "",
+    longitude: "",
+  });

  const [creatingArticleHeading, setCreatingArticleHeading] =
    useState<string>("");
@ -100,19 +102,13 @@ export const SightCreate = observer(() => {
  const [previewArticlePreview, setPreviewArticlePreview] = useState("");

  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setCoordinates(e.target.value);
-    if (e.target.value) {
-      const [lat, lon] = e.target.value.split(" ").map((s) => s.trim());
-      setCoordinatesPreview(
-        `${lat ? Number(lat) : 0}, ${lon ? Number(lon) : 0}`
-      );
-      setValue("latitude", lat ? Number(lat) : 0);
-      setValue("longitude", lon ? Number(lon) : 0);
-    } else {
-      setCoordinatesPreview("");
-      setValue("latitude", "");
-      setValue("longitude", "");
-    }
+    const [lat, lon] = e.target.value.split(",").map((s) => s.trim());
+    setCoordinatesPreview({
+      latitude: lat,
+      longitude: lon,
+    });
+    setValue("latitude", lat);
+    setValue("longitude", lon);
  };

  // Автокомплиты
@ -174,6 +170,13 @@ export const SightCreate = observer(() => {
    setNamePreview(nameContent ?? "");
  }, [nameContent]);

+  useEffect(() => {
+    setCoordinatesPreview({
+      latitude: latitudeContent || "",
+      longitude: longitudeContent || "",
+    });
+  }, [latitudeContent, longitudeContent]);
+
  useEffect(() => {
    const selectedCity = cityAutocompleteProps.options.find(
      (option) => option.id === cityContent
@ -273,7 +276,7 @@ export const SightCreate = observer(() => {
            />

            <TextField
-              value={coordinates}
+              value={`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
              onChange={handleCoordinatesChange}
              error={!!(errors as any)?.latitude}
              helperText={(errors as any)?.latitude?.message}
@ -283,11 +286,10 @@ export const SightCreate = observer(() => {
              type="text"
              label={"Координаты *"}
            />
-
            <input
              type="hidden"
              {...register("longitude", {
-                value: coordinates.split(" ")[1],
+                value: coordinatesPreview.longitude,
                required: "Это поле является обязательным",
                valueAsNumber: true,
              })}
@ -295,7 +297,7 @@ export const SightCreate = observer(() => {
            <input
              type="hidden"
              {...register("latitude", {
-                value: coordinates.split(" ")[0],
+                value: coordinatesPreview.latitude,
                required: "Это поле является обязательным",
                valueAsNumber: true,
              })}
@ -431,7 +433,7 @@ export const SightCreate = observer(() => {
                  renderInput={(params) => (
                    <TextField
                      {...params}
-                      label="Выберите водяной знак (Левый верх)"
+                      label="Выберите водный знак (Левый верх)"
                      margin="normal"
                      variant="outlined"
                      error={!!errors.watermark_lu}
@ -473,7 +475,7 @@ export const SightCreate = observer(() => {
                  renderInput={(params) => (
                    <TextField
                      {...params}
-                      label="Выберите водяной знак (Правый верх)"
+                      label="Выберите водный знак (Правый верх)"
                      margin="normal"
                      variant="outlined"
                      error={!!errors.watermark_rd}
@ -499,13 +501,13 @@ export const SightCreate = observer(() => {
                  onChange={(_, value) => {
                    field.onChange(value?.id ?? "");
                  }}
-                  getOptionLabel={(item) => (item ? item.service_name : "")}
+                  getOptionLabel={(item) => (item ? item.heading : "")}
                  isOptionEqualToValue={(option, value) =>
                    option.id === value?.id
                  }
                  filterOptions={(options, { inputValue }) =>
                    options.filter((option) =>
-                      option.service_name
+                      option.heading
                        .toLowerCase()
                        .includes(inputValue.toLowerCase())
                    )
@ -666,22 +668,21 @@ export const SightCreate = observer(() => {
          </Typography>

          {/* Координаты */}
-          {coordinatesPreview && (
-            <Typography variant="body1" sx={{ mb: 2 }}>
-              <Box component="span" sx={{ color: "text.secondary" }}>
-                Координаты:{" "}
-              </Box>
-              <Box
-                component="span"
-                sx={{
-                  color: (theme) =>
-                    theme.palette.mode === "dark" ? "grey.300" : "grey.800",
-                }}
-              >
-                {coordinatesPreview}
-              </Box>
-            </Typography>
-          )}
+          <Typography variant="body1" sx={{ mb: 2 }}>
+            <Box component="span" sx={{ color: "text.secondary" }}>
+              Координаты:{" "}
+            </Box>
+            <Box
+              component="span"
+              sx={{
+                color: (theme) =>
+                  theme.palette.mode === "dark" ? "grey.300" : "grey.800",
+              }}
+            >
+              {`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
+            </Box>
+          </Typography>
+
          {/* Обложка */}
          {thumbnailPreview && (
            <Box sx={{ mb: 2 }}>
--- a/src/pages/sight/edit.tsx
+++ b/src/pages/sight/edit.tsx
@ -70,7 +70,6 @@ export const SightEdit = observer(() => {
    name: EVERY_LANGUAGE(""),
    address: EVERY_LANGUAGE(""),
  });
-  const [coordinates, setCoordinates] = useState("");

  const {
    saveButtonProps,
@ -164,13 +163,37 @@ export const SightEdit = observer(() => {
      setValue("address", sightData.address[language]);
  }, [language, sightData, setValue]);

+  useEffect(() => {
+    const latitude = getValues("latitude");
+    const longitude = getValues("longitude");
+    if (latitude && longitude) {
+      setCoordinatesPreview({
+        latitude: latitude,
+        longitude: longitude,
+      });
+    }
+  }, [getValues]);
+
+  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const [lat, lon] = e.target.value.split(",").map((s) => s.trim());
+    setCoordinatesPreview({
+      latitude: lat,
+      longitude: lon,
+    });
+    setValue("latitude", lat);
+    setValue("longitude", lon);
+  };
+
  // Состояния для предпросмотра

  const [creatingArticleHeading, setCreatingArticleHeading] =
    useState<string>("");
  const [creatingArticleBody, setCreatingArticleBody] = useState<string>("");

-  const [coordinatesPreview, setCoordinatesPreview] = useState("");
+  const [coordinatesPreview, setCoordinatesPreview] = useState({
+    latitude: "",
+    longitude: "",
+  });
  const [selectedArticleIndex, setSelectedArticleIndex] = useState(-1);
  const [previewMediaFile, setPreviewMediaFile] = useState<MediaData>();
  const [thumbnailPreview, setThumbnailPreview] = useState<string | null>(null);
@ -220,25 +243,12 @@ export const SightEdit = observer(() => {
  const watermarkRDContent = watch("watermark_rd");

  useEffect(() => {
-    if (latitudeContent && longitudeContent) {
-      setCoordinates(`${latitudeContent} ${longitudeContent}`);
-    }
+    setCoordinatesPreview({
+      latitude: latitudeContent ?? "",
+      longitude: longitudeContent ?? "",
+    });
  }, [latitudeContent, longitudeContent]);

-  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setCoordinates(e.target.value);
-    if (e.target.value) {
-      const [lat, lon] = e.target.value.split(" ").map((s) => s.trim());
-      setCoordinatesPreview(`${lat ?? "0"}, ${lon ?? "0"}`);
-      setValue("latitude", lat ?? "");
-      setValue("longitude", lon ?? "");
-    } else {
-      setCoordinatesPreview("");
-      setValue("latitude", "");
-      setValue("longitude", "");
-    }
-  };
-
  useEffect(() => {
    if (linkedArticles[selectedArticleIndex]?.id) {
      getMedia(linkedArticles[selectedArticleIndex].id).then((media) => {
@ -495,6 +505,7 @@ export const SightEdit = observer(() => {
                  <input
                    type="hidden"
                    {...register("longitude", {
+                      value: coordinatesPreview.longitude,
                      required: "Это поле является обязательным",
                      valueAsNumber: true,
                    })}
@ -502,6 +513,7 @@ export const SightEdit = observer(() => {
                  <input
                    type="hidden"
                    {...register("latitude", {
+                      value: coordinatesPreview.latitude,
                      required: "Это поле является обязательным",
                      valueAsNumber: true,
                    })}
@ -594,7 +606,7 @@ export const SightEdit = observer(() => {
                          renderInput={(params) => (
                            <TextField
                              {...params}
-                              label="Выберите водяной знак (Левый верх)"
+                              label="Выберите водный знак (Левый верх)"
                              margin="normal"
                              variant="outlined"
                              error={!!errors.arms}
@ -638,7 +650,7 @@ export const SightEdit = observer(() => {
                          renderInput={(params) => (
                            <TextField
                              {...params}
-                              label="Выберите водяной знак (Правый вверх)"
+                              label="Выберите водный знак (Правый вверх)"
                              margin="normal"
                              variant="outlined"
                              error={!!errors.arms}
@ -668,14 +680,14 @@ export const SightEdit = observer(() => {
                          setLeftArticleData(undefined);
                        }}
                        getOptionLabel={(item) => {
-                          return item ? item.service_name : "";
+                          return item ? item.heading : "";
                        }}
                        isOptionEqualToValue={(option, value) => {
                          return option.id === value?.id;
                        }}
                        filterOptions={(options, { inputValue }) => {
                          return options.filter((option) =>
-                            option.service_name
+                            option.heading
                              .toLowerCase()
                              .includes(inputValue.toLowerCase())
                          );
@ -782,7 +794,6 @@ export const SightEdit = observer(() => {
                  color: (theme) =>
                    theme.palette.mode === "dark" ? "grey.300" : "grey.800",
                  mb: 3,
-                  mt: 3,
                }}
              >
                {name}
@ -979,14 +990,14 @@ export const SightEdit = observer(() => {
                        setLeftArticleData(undefined);
                      }}
                      getOptionLabel={(item) => {
-                        return item ? item.service_name : "";
+                        return item ? item.heading : "";
                      }}
                      isOptionEqualToValue={(option, value) => {
                        return option.id === value?.id;
                      }}
                      filterOptions={(options, { inputValue }) => {
                        return options.filter((option) =>
-                          option.service_name
+                          option.heading
                            .toLowerCase()
                            .includes(inputValue.toLowerCase())
                        );
@ -1468,7 +1479,7 @@ export const SightEdit = observer(() => {
                      renderInput={(params) => (
                        <TextField
                          {...params}
-                          label="Выберите водяной знак (Левый верх)"
+                          label="Выберите водный знак (Левый верх)"
                          margin="normal"
                          variant="outlined"
                          error={!!errors.arms}
@ -1512,7 +1523,7 @@ export const SightEdit = observer(() => {
                      renderInput={(params) => (
                        <TextField
                          {...params}
-                          label="Выберите водяной знак (Правый вверх)"
+                          label="Выберите водный знак (Правый вверх)"
                          margin="normal"
                          variant="outlined"
                          error={!!errors.arms}
@ -1524,7 +1535,7 @@ export const SightEdit = observer(() => {
                />

                <TextField
-                  value={coordinates}
+                  value={`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
                  onChange={handleCoordinatesChange}
                  error={!!(errors as any)?.latitude}
                  helperText={(errors as any)?.latitude?.message}
@ -1676,7 +1687,7 @@ export const SightEdit = observer(() => {
                            : "grey.800",
                      }}
                    >
-                      {coordinatesPreview}
+                      {`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
                    </Box>
                  </Typography>
                </Box>
--- a/src/pages/sight/list.tsx
+++ b/src/pages/sight/list.tsx
@ -56,7 +56,6 @@ export const SightList = observer(() => {
        display: "flex",
        align: "left",
        headerAlign: "left",
-        flex: 1,
      },
      {
        field: "latitude",
--- a/src/pages/station/create.tsx
+++ b/src/pages/station/create.tsx
@ -41,19 +41,40 @@ export const StationCreate = () => {
    },
  });

-  const [coordinates, setCoordinates] = useState("");
+  const [coordinatesPreview, setCoordinatesPreview] = useState({
+    latitude: "",
+    longitude: "",
+  });

  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setCoordinates(e.target.value);
-    const [lat, lon] = e.target.value
-      .replace(/,/g, "") // Remove all commas from the string
-      .split(" ")
-      .map((s) => s.trim());
-    console.log(lat, lon);
+    const [lat, lon] = e.target.value.split(",").map((s) => s.trim());
+    setCoordinatesPreview({
+      latitude: lat,
+      longitude: lon,
+    });
    setValue("latitude", lat);
    setValue("longitude", lon);
  };
+  const latitudeContent = watch("latitude");
+  const longitudeContent = watch("longitude");

+  useEffect(() => {
+    setCoordinatesPreview({
+      latitude: latitudeContent || "",
+      longitude: longitudeContent || "",
+    });
+  }, [latitudeContent, longitudeContent]);
+
+  useEffect(() => {
+    const latitude = getValues("latitude");
+    const longitude = getValues("longitude");
+    if (latitude && longitude) {
+      setCoordinatesPreview({
+        latitude: latitude,
+        longitude: longitude,
+      });
+    }
+  }, [getValues]);
  const directions = [
    {
      label: "Прямой",
@ -167,7 +188,7 @@ export const StationCreate = () => {
          )}
        />
        <TextField
-          value={coordinates}
+          value={`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
          onChange={handleCoordinatesChange}
          error={!!(errors as any)?.latitude}
          helperText={(errors as any)?.latitude?.message}
@ -177,11 +198,10 @@ export const StationCreate = () => {
          type="text"
          label={"Координаты *"}
        />
-
        <input
          type="hidden"
          {...register("latitude", {
-            value: coordinates.split(",")[0],
+            value: coordinatesPreview.latitude,
            setValueAs: (value) => {
              if (value === "") {
                return 0;
@ -193,7 +213,7 @@ export const StationCreate = () => {
        <input
          type="hidden"
          {...register("longitude", {
-            value: coordinates.split(",")[1],
+            value: coordinatesPreview.longitude,
            setValueAs: (value) => {
              if (value === "") {
                return 0;
--- a/src/pages/station/edit.tsx
+++ b/src/pages/station/edit.tsx
@ -40,24 +40,24 @@ export const StationEdit = observer(() => {
      system_name: "",
      description: "",
      address: "",
-      latitude: 0,
-      longitude: 0,
+      latitude: "",
+      longitude: "",
    },
    en: {
      name: "",
      system_name: "",
      description: "",
      address: "",
-      latitude: 0,
-      longitude: 0,
+      latitude: "",
+      longitude: "",
    },
    zh: {
      name: "",
      system_name: "",
      description: "",
      address: "",
-      latitude: 0,
-      longitude: 0,
+      latitude: "",
+      longitude: "",
    },
  });

@ -69,8 +69,8 @@ export const StationEdit = observer(() => {
        system_name: watch("system_name") ?? "",
        description: watch("description") ?? "",
        address: watch("address") ?? "",
-        latitude: Number(watch("latitude")) || 0,
-        longitude: Number(watch("longitude")) || 0,
+        latitude: watch("latitude") ?? "",
+        longitude: watch("longitude") ?? "",
      },
    }));
  };
@ -120,7 +120,7 @@ export const StationEdit = observer(() => {
    if (stationData[language as keyof typeof stationData]?.name) {
      setValue("name", stationData[language as keyof typeof stationData]?.name);
    }
-    if (stationData[language as keyof typeof stationData]?.system_name) {
+    if (stationData[language as keyof typeof stationData]?.address) {
      setValue(
        "system_name",
        stationData[language as keyof typeof stationData]?.system_name || ""
@ -132,20 +132,16 @@ export const StationEdit = observer(() => {
        stationData[language as keyof typeof stationData]?.description || ""
      );
    }
-    if (
-      stationData[language as keyof typeof stationData]?.latitude !== undefined
-    ) {
+    if (stationData[language as keyof typeof stationData]?.latitude) {
      setValue(
        "latitude",
-        stationData[language as keyof typeof stationData]?.latitude || 0
+        stationData[language as keyof typeof stationData]?.latitude || ""
      );
    }
-    if (
-      stationData[language as keyof typeof stationData]?.longitude !== undefined
-    ) {
+    if (stationData[language as keyof typeof stationData]?.longitude) {
      setValue(
        "longitude",
-        stationData[language as keyof typeof stationData]?.longitude || 0
+        stationData[language as keyof typeof stationData]?.longitude || ""
      );
    }
  }, [language, stationData, setValue]);
@ -154,36 +150,28 @@ export const StationEdit = observer(() => {
    setLanguageAction("ru");
  }, []);

-  const [coordinates, setCoordinates] = useState("");
-
  const { id: stationId } = useParams<{ id: string }>();

+  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const [lat, lon] = e.target.value.split(",").map((s) => s.trim());
+    setCoordinatesPreview({
+      latitude: lat,
+      longitude: lon,
+    });
+    setValue("latitude", lat);
+    setValue("longitude", lon);
+  };
+
  const latitudeContent = watch("latitude");
  const longitudeContent = watch("longitude");

  useEffect(() => {
-    if (latitudeContent && longitudeContent) {
-      setCoordinates(`${latitudeContent} ${longitudeContent}`);
-    }
+    setCoordinatesPreview({
+      latitude: latitudeContent || "",
+      longitude: longitudeContent || "",
+    });
  }, [latitudeContent, longitudeContent]);

-  const handleCoordinatesChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setCoordinates(e.target.value);
-    if (e.target.value) {
-      const [lat, lon] = e.target.value
-        .replace(/,/g, "") // Remove all commas from the string
-        .split(" ")
-        .map((s) => s.trim());
-      setCoordinates(`${lat ?? 0} ${lon ?? 0}`);
-      setValue("latitude", lat ?? 0);
-      setValue("longitude", lon ?? 0);
-    } else {
-      setCoordinates("");
-      setValue("latitude", "");
-      setValue("longitude", "");
-    }
-  };
-
  const { autocompleteProps: cityAutocompleteProps } = useAutocomplete({
    resource: "city",
    onSearch: (value) => [
@ -204,8 +192,6 @@ export const StationEdit = observer(() => {
    },
  });

-  const cityId = watch("city_id");
-
  return (
    <Edit saveButtonProps={saveButtonProps}>
      <Box
@ -294,7 +280,7 @@ export const StationEdit = observer(() => {
        />

        <TextField
-          value={coordinates}
+          value={`${coordinatesPreview.latitude}, ${coordinatesPreview.longitude}`}
          onChange={handleCoordinatesChange}
          error={!!(errors as any)?.latitude}
          helperText={(errors as any)?.latitude?.message}
@ -307,28 +293,12 @@ export const StationEdit = observer(() => {
        <input
          type="hidden"
          {...register("latitude", {
-            valueAsNumber: true,
-            value: Number(coordinates.split(" ")[0]),
-            setValueAs: (value) => {
-              if (value === "") {
-                return 0;
-              }
-              return Number(value);
-            },
+            value: coordinatesPreview.latitude,
          })}
        />
        <input
          type="hidden"
-          {...register("longitude", {
-            valueAsNumber: true,
-            value: Number(coordinates.split(" ")[1]),
-            setValueAs: (value) => {
-              if (value === "") {
-                return 0;
-              }
-              return Number(value);
-            },
-          })}
+          {...register("longitude", { value: coordinatesPreview.longitude })}
        />

        <Controller
@ -383,7 +353,6 @@ export const StationEdit = observer(() => {
          fields={sightFields}
          title="достопримечательности"
          dragAllowed={false}
-          cityId={cityId}
        />
      )}
    </Edit>
--- a/src/pages/vehicle/list.tsx
+++ b/src/pages/vehicle/list.tsx
@ -7,41 +7,14 @@ import {
  ShowButton,
  useDataGrid,
 } from "@refinedev/mui";
-import React, { useEffect, useState } from "react";
+import React, { useEffect } from "react";
 import { VEHICLE_TYPES } from "../../lib/constants";

 import { localeText } from "../../locales/ru/localeText";
 import { observer } from "mobx-react-lite";
 import { languageStore } from "../../store/LanguageStore";
-import { axiosInstance } from "@providers";

 export const VehicleList = observer(() => {
-  const [carriers, setCarriers] = useState<any[]>([]);
-
-  const [cities, setCities] = useState<any[]>([]);
-
-  useEffect(() => {
-    axiosInstance
-      .get("/carrier")
-      .then((res) => {
-        setCarriers(res.data);
-      })
-      .catch((err) => {
-        console.log(err);
-      });
-  }, []);
-
-  useEffect(() => {
-    axiosInstance
-      .get("/city")
-      .then((res) => {
-        setCities(res.data);
-      })
-      .catch((err) => {
-        console.log(err);
-      });
-  }, []);
-
  const { language } = languageStore;

  const { dataGridProps } = useDataGrid({
@ -98,38 +71,6 @@ export const VehicleList = observer(() => {
          );
        },
      },
-      {
-        field: "carrier-name",
-        headerName: "Перевозчик",
-        type: "string",
-        minWidth: 150,
-        display: "flex",
-        flex: 1,
-        align: "left",
-        headerAlign: "left",
-        renderCell: (params) => {
-          const value = params.row.carrier_id;
-          return carriers.find((carrier) => carrier.id === value)?.full_name;
-        },
-      },
-      {
-        field: "city-name",
-        headerName: "Город",
-        type: "string",
-        minWidth: 150,
-        flex: 1,
-        display: "flex",
-        align: "left",
-        headerAlign: "left",
-        renderCell: (params) => {
-          const value = params.row.carrier_id;
-          return cities.find(
-            (city) =>
-              city.id ===
-              carriers.find((carrier) => carrier.id === value)?.city_id
-          )?.name;
-        },
-      },
      // {
      //   field: "city",
      //   headerName: "Город",
@ -152,7 +93,7 @@ export const VehicleList = observer(() => {
          return (
            <>
              <EditButton hideText recordItemId={row.id} />
-              {/* <ShowButton hideText recordItemId={row.id} /> */}
+              <ShowButton hideText recordItemId={row.id} />
              <DeleteButton
                hideText
                confirmTitle="Вы уверены?"
@ -163,7 +104,7 @@ export const VehicleList = observer(() => {
        },
      },
    ],
-    [carriers, cities]
+    []
  );

  return (
--- a/src/providers/data.ts
+++ b/src/providers/data.ts
@ -3,7 +3,7 @@ import dataProvider from "@refinedev/simple-rest";
 import { TOKEN_KEY } from "@providers";

 import axios from "axios";
-
+import { languageStore } from "@stores";
 export const axiosInstance = axios.create({
  baseURL: import.meta.env.VITE_KRBL_API,
 });
@ -22,22 +22,6 @@ axiosInstance.interceptors.request.use((config) => {
  return config;
 });

-export const axiosInstanceForGet = (language: string) => {
-  const axiosInstance = axios.create({
-    baseURL: import.meta.env.VITE_KRBL_API,
-  });
-  axiosInstance.interceptors.request.use((config) => {
-    const token = localStorage.getItem(TOKEN_KEY);
-    if (token) {
-      config.headers.Authorization = `Bearer ${token}`;
-    }
-
-    config.headers["X-Language"] = language;
-    return config;
-  });
-  return axiosInstance;
-};
-
 const apiUrl = import.meta.env.VITE_KRBL_API;

 export const customDataProvider = dataProvider(apiUrl, axiosInstance);
Author	SHA1	Message	Date
itoshi	9bf294e124	feat: Add `service_name` for article list All checks were successful release-tag / release-image (push) Successful in 2m23s Details	2025-05-26 17:24:04 +03:00
itoshi	db5e9d9fc4	fix: Fix station create page All checks were successful release-tag / release-image (push) Successful in 2m16s Details	2025-05-25 23:16:33 +03:00
itoshi	b1a4edc136	fix: Try to fix dockerfile All checks were successful release-tag / release-image (push) Successful in 2m18s Details	2025-05-25 20:20:09 +03:00
itoshi	3110683c7d	fix: Fix `notification` usage Some checks failed release-tag / release-image (push) Failing after 59s Details	2025-05-25 20:10:23 +03:00
itoshi	16640cb116	fix: Fix shit Andrey code Some checks failed release-tag / release-image (push) Failing after 1m53s Details	2025-05-25 19:43:38 +03:00
itoshi	28826123ec	feat: Add `snapshots` page All checks were successful release-tag / release-image (push) Successful in 2m23s Details	2025-05-21 18:31:19 +03:00
Alexander Lazarenko	bd19f1dc88	Add automated Docker image publishing workflow All checks were successful release-tag / release-image (push) Successful in 2m20s Details Introduced a Gitea workflow to automate Docker image building and publishing upon push events. This setup includes QEMU configuration, DockerHub authentication, and multi-platform build support using Docker Buildx.	2025-05-20 20:20:42 +03:00
itoshi	0fac04be0d	fix: Fix `Dockerfile` for correct url response	2025-05-20 17:27:39 +03:00
itoshi	8a443882b5	feat: Redesign `route direction` with `media_order` input	2025-05-20 16:59:57 +03:00
Spynder	7c363f1730	underline	2025-05-20 00:09:57 +03:00
Spynder	d9bbe4f234	carriers	2025-05-19 22:20:26 +03:00
Spynder	6eaa94778b	changed according to the third tour	2025-05-19 21:53:34 +03:00
Spynder	34423b73a3	changes for 15.05	2025-05-17 05:55:57 +03:00
Spynder	ab1fd6b22a	last changes, possibly	2025-05-15 04:32:23 +03:00
Spynder	042b53e6a4	last changes	2025-05-14 14:42:45 +03:00
Spynder	177653d84a	remaining fixes	2025-05-07 00:02:24 +03:00
Spynder	fba2fb0f5c	more fixes	2025-05-06 17:56:05 +03:00
Spynder	86947d6332	moved city into other tab	2025-05-05 03:40:08 +03:00
Spynder	7c920eb81e	fix fix fix fix	2025-05-05 02:54:46 +03:00
Spynder	4b20c94b70	map3	2025-05-05 01:19:59 +03:00
Spynder	fb16891de3	Merge branch 'update' into preview	2025-05-04 22:41:12 +03:00
Spynder	6454af90d3	map 2	2025-05-04 22:40:44 +03:00
Spynder	275eef597b	preview	2025-05-03 01:17:37 +03:00
itoshi	65532f7074	rewrite code with edit article in sight page	2025-05-01 00:10:50 +03:00
itoshi	dc483d62de	added old preview components	2025-04-29 22:10:50 +03:00
itoshi	03829aacc6	station edit in the route edit page	2025-04-29 21:16:53 +03:00
itoshi	a1a2264758	sight edit page update	2025-04-27 16:18:52 +03:00
itoshi	0d325a3aa6	added more types for media	2025-04-27 11:27:22 +03:00
itoshi	abd054b8d4	delete useless querykey	2025-04-25 05:54:41 +03:00
itoshi	9927c0afd6	sight edit update	2025-04-25 05:23:07 +03:00
itoshi	463c593a0e	route edit fixed with drag and drop tool	2025-04-21 15:34:11 +03:00
itoshi	9e34a71e14	fetching data from api for route preview	2025-04-20 10:55:12 +03:00
itoshi	029a2de97e	added route preview with updated dnd	2025-04-16 13:51:44 +03:00
itoshi	4dd149f2af	added route preview	2025-04-15 21:12:43 +03:00
itoshi	b6449b02c0	update route preview	2025-04-14 01:03:58 +03:00
itoshi	607012bd47	abstract urls	2025-04-11 19:24:45 +03:00