feat: big update 07.05.26

src/pages/Carrier/CarrierEditPage/index.tsx

@@ -7,8 +7,6 @@ import {
   FormControl,
   InputLabel,
   Box,
-  ToggleButtonGroup,
-  ToggleButton,
 } from "@mui/material";
 import { observer } from "mobx-react-lite";
 import { ArrowLeft, Save } from "lucide-react";
@@ -32,13 +30,12 @@ import {
   UploadMediaDialog,
 } from "@shared";
 
-type ColorFields = { main_color: string; left_color: string; right_color: string; rgb_color: string };
+type ColorFields = { main_color: string; left_color: string; right_color: string };
 
 const colorFields = (data: ColorFields) => ({
   main_color: data.main_color,
   left_color: data.left_color,
   right_color: data.right_color,
-  rgb_color: data.rgb_color,
 });
 
 const ColorPickerField = ({
@@ -90,7 +87,6 @@ export const CarrierEditPage = observer(() => {
   const { language } = languageStore;
   const canReadCities = authStore.canRead("cities");
 
-  const [colorMode, setColorMode] = useState<"rgb" | "three">("rgb");
   const [isLoading, setIsLoading] = useState(false);
   const [isLoadingData, setIsLoadingData] = useState(true);
   const [isSelectMediaOpen, setIsSelectMediaOpen] = useState(false);
@@ -126,13 +122,7 @@ export const CarrierEditPage = observer(() => {
             main_color: carrierData.ru?.main_color || "",
             left_color: carrierData.ru?.left_color || "",
             right_color: carrierData.ru?.right_color || "",
-            rgb_color: carrierData.ru?.rgb_color || "",
           };
-          if (colors.rgb_color) {
-            setColorMode("rgb");
-          } else {
-            setColorMode("three");
-          }
           setEditCarrierData(
             carrierData.ru?.full_name || "",
             carrierData.ru?.short_name || "",
@@ -339,51 +329,11 @@ export const CarrierEditPage = observer(() => {
           }
         />
 
-        <div className="w-full flex flex-col gap-4">
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-3">
-              <span className="text-sm font-medium">Режим цвета:</span>
-            <ToggleButtonGroup
-              size="small"
-              exclusive
-              value={colorMode}
-              onChange={(_, val) => {
-                if (!val) return;
-                setColorMode(val);
-                if (val === "rgb") {
-                  setEditCarrierData(
-                    editCarrierData[language].full_name,
-                    editCarrierData[language].short_name,
-                    editCarrierData.city_id,
-                    editCarrierData[language].slogan,
-                    editCarrierData.logo,
-                    language,
-                    { main_color: "", left_color: "", right_color: "", rgb_color: editCarrierData.rgb_color }
-                  );
-                } else {
-                  setEditCarrierData(
-                    editCarrierData[language].full_name,
-                    editCarrierData[language].short_name,
-                    editCarrierData.city_id,
-                    editCarrierData[language].slogan,
-                    editCarrierData.logo,
-                    language,
-                    { main_color: editCarrierData.main_color, left_color: editCarrierData.left_color, right_color: editCarrierData.right_color, rgb_color: "" }
-                  );
-                }
-              }}
-            >
-              <ToggleButton value="rgb">Один цвет</ToggleButton>
-              <ToggleButton value="three">Три цвета</ToggleButton>
-            </ToggleButtonGroup>
-            </div>
-            <span className="text-xs text-gray-400">* при переключении цвет сбрасывается</span>
-          </div>
-
-          {colorMode === "rgb" ? (
+        <div className="w-full flex flex-col gap-6">
+          <div className="flex flex-col gap-1">
             <ColorPickerField
-              label="Один цвет"
-              value={editCarrierData.rgb_color}
+              label="Основной цвет"
+              value={editCarrierData.main_color}
               onChange={(val) =>
                 setEditCarrierData(
                   editCarrierData[language].full_name,
@@ -392,59 +342,54 @@ export const CarrierEditPage = observer(() => {
                   editCarrierData[language].slogan,
                   editCarrierData.logo,
                   language,
-                  { ...colorFields(editCarrierData), rgb_color: val }
+                  { ...colorFields(editCarrierData), main_color: val }
                 )
               }
             />
-          ) : (
-            <>
-              <ColorPickerField
-                label="Основной цвет"
-                value={editCarrierData.main_color}
-                onChange={(val) =>
-                  setEditCarrierData(
-                    editCarrierData[language].full_name,
-                    editCarrierData[language].short_name,
-                    editCarrierData.city_id,
-                    editCarrierData[language].slogan,
-                    editCarrierData.logo,
-                    language,
-                    { ...colorFields(editCarrierData), main_color: val }
-                  )
-                }
-              />
-              <ColorPickerField
-                label="Левый цвет"
-                value={editCarrierData.left_color}
-                onChange={(val) =>
-                  setEditCarrierData(
-                    editCarrierData[language].full_name,
-                    editCarrierData[language].short_name,
-                    editCarrierData.city_id,
-                    editCarrierData[language].slogan,
-                    editCarrierData.logo,
-                    language,
-                    { ...colorFields(editCarrierData), left_color: val }
-                  )
-                }
-              />
-              <ColorPickerField
-                label="Правый цвет"
-                value={editCarrierData.right_color}
-                onChange={(val) =>
-                  setEditCarrierData(
-                    editCarrierData[language].full_name,
-                    editCarrierData[language].short_name,
-                    editCarrierData.city_id,
-                    editCarrierData[language].slogan,
-                    editCarrierData.logo,
-                    language,
-                    { ...colorFields(editCarrierData), right_color: val }
-                  )
-                }
-              />
-            </>
-          )}
+            <p className="text-xs text-gray-500 pl-1">
+              Используется в: виджет маршрута, виджет обращений, значки на карте, скопление достопримечательностей на карте, информационный виджет
+            </p>
+          </div>
+          <div className="flex flex-col gap-1">
+            <ColorPickerField
+              label="Левый цвет"
+              value={editCarrierData.left_color}
+              onChange={(val) =>
+                setEditCarrierData(
+                  editCarrierData[language].full_name,
+                  editCarrierData[language].short_name,
+                  editCarrierData.city_id,
+                  editCarrierData[language].slogan,
+                  editCarrierData.logo,
+                  language,
+                  { ...colorFields(editCarrierData), left_color: val }
+                )
+              }
+            />
+            <p className="text-xs text-gray-500 pl-1">
+              Используется в: боковое меню, левый виджет достопримечательности
+            </p>
+          </div>
+          <div className="flex flex-col gap-1">
+            <ColorPickerField
+              label="Правый цвет"
+              value={editCarrierData.right_color}
+              onChange={(val) =>
+                setEditCarrierData(
+                  editCarrierData[language].full_name,
+                  editCarrierData[language].short_name,
+                  editCarrierData.city_id,
+                  editCarrierData[language].slogan,
+                  editCarrierData.logo,
+                  language,
+                  { ...colorFields(editCarrierData), right_color: val }
+                )
+              }
+            />
+            <p className="text-xs text-gray-500 pl-1">
+              Используется в: список достопримечательностей, страница достопримечательности
+            </p>
+          </div>
         </div>
 
         <div className="w-full flex flex-col gap-4 max-w-[300px] mx-auto">