From 8c983cb91a8734edc77c3091d41322ae4de71650 Mon Sep 17 00:00:00 2001
From: IlyaDoronin <ryletd@gmail.com>
Date: Fri, 13 Oct 2023 14:28:51 +0300
Subject: [PATCH] fix: branchOptions

---
 src/pages/Questions/ButtonsOptions.tsx        | 244 ++++++++---------
 src/pages/Questions/ButtonsOptionsAndPict.tsx | 250 +++++++++---------
 2 files changed, 240 insertions(+), 254 deletions(-)

diff --git a/src/pages/Questions/ButtonsOptions.tsx b/src/pages/Questions/ButtonsOptions.tsx
index 8ea8d21b..fd6c744b 100644
--- a/src/pages/Questions/ButtonsOptions.tsx
+++ b/src/pages/Questions/ButtonsOptions.tsx
@@ -129,140 +129,130 @@ export default function ButtonsOptions({
         {buttonSetting.map(({ icon, title, value, myFunc }) => (
           <Box key={value}>
             {value === "branching" ? (
-              quize.config.type === "quize" && (
-                <Tooltip
-                  arrow
-                  placement="right"
-                  title={
-                    <Box>
-                      <Typography
-                        sx={{
-                          color: "#4D4D4D",
-                          fontWeight: "bold",
-                          fontSize: "14px",
-                          marginBottom: "10px",
-                        }}
-                      >
-                        Будет показан при условии
-                      </Typography>
-                      <Typography sx={{ fontWeight: "bold", fontSize: "12px" }}>
-                        Название
-                      </Typography>
-                      <Typography
-                        sx={{
-                          fontWeight: "bold",
-                          fontSize: "12px",
-                          marginBottom: "10px",
-                        }}
-                      >
-                        Условие 1, Условие 2
-                      </Typography>
-                      <Typography sx={{ color: "#7E2AEA", fontSize: "12px" }}>
-                        Все условия обязательны
-                      </Typography>
-                    </Box>
-                  }
+              <Tooltip
+                arrow
+                placement="right"
+                title={
+                  <Box>
+                    <Typography
+                      sx={{
+                        color: "#4D4D4D",
+                        fontWeight: "bold",
+                        fontSize: "14px",
+                        marginBottom: "10px",
+                      }}
+                    >
+                      Будет показан при условии
+                    </Typography>
+                    <Typography sx={{ fontWeight: "bold", fontSize: "12px" }}>
+                      Название
+                    </Typography>
+                    <Typography
+                      sx={{
+                        fontWeight: "bold",
+                        fontSize: "12px",
+                        marginBottom: "10px",
+                      }}
+                    >
+                      Условие 1, Условие 2
+                    </Typography>
+                    <Typography sx={{ color: "#7E2AEA", fontSize: "12px" }}>
+                      Все условия обязательны
+                    </Typography>
+                  </Box>
+                }
+              >
+                <MiniButtonSetting
+                  key={title}
+                  onClick={() => {
+                    SSHC(value);
+                    myFunc();
+                  }}
+                  sx={{
+                    backgroundColor:
+                      switchState === value
+                        ? theme.palette.brightPurple.main
+                        : "transparent",
+                    color:
+                      switchState === value
+                        ? "#ffffff"
+                        : theme.palette.grey3.main,
+                    minWidth: isWrappMiniButtonSetting ? "30px" : "64px",
+                    height: "30px",
+                    "&:hover": {
+                      color: theme.palette.grey3.main,
+                      "& path": { stroke: theme.palette.grey3.main },
+                    },
+                  }}
                 >
-                  <MiniButtonSetting
-                    key={title}
-                    onClick={() => {
-                      SSHC(value);
-                      myFunc();
-                    }}
-                    sx={{
-                      backgroundColor:
-                        switchState === value
-                          ? theme.palette.brightPurple.main
-                          : "transparent",
-                      color:
-                        switchState === value
-                          ? "#ffffff"
-                          : theme.palette.grey3.main,
-                      minWidth: isWrappMiniButtonSetting ? "30px" : "64px",
-                      height: "30px",
-                      "&:hover": {
-                        color: theme.palette.grey3.main,
-                        "& path": { stroke: theme.palette.grey3.main },
-                      },
-                    }}
-                  >
-                    {icon}
-                    {isWrappMiniButtonSetting ? null : title}
-                  </MiniButtonSetting>
-                </Tooltip>
-              )
+                  {icon}
+                  {isWrappMiniButtonSetting ? null : title}
+                </MiniButtonSetting>
+              </Tooltip>
             ) : (
               <>
-                {(value !== "setting" ||
-                  quize.config.type === "quize" ||
-                  (value === "setting" &&
-                    quize.config.type === "form" &&
-                    question.type)) && (
-                  <MiniButtonSetting
-                    key={title}
-                    onClick={() => {
-                      SSHC(value);
-                      myFunc();
-                    }}
-                    sx={{
-                      backgroundColor:
-                        switchState === value
-                          ? theme.palette.brightPurple.main
-                          : "transparent",
-                      color:
-                        switchState === value
-                          ? "#ffffff"
-                          : theme.palette.grey3.main,
-                      minWidth: isWrappMiniButtonSetting ? "30px" : "64px",
-                      height: "30px",
-                      "&:hover": {
-                        color: theme.palette.grey3.main,
-                        "& path": { stroke: theme.palette.grey3.main },
-                      },
-                    }}
-                  >
-                    {icon}
-                    {isWrappMiniButtonSetting ? null : title}
-                  </MiniButtonSetting>
-                )}
+                <MiniButtonSetting
+                  key={title}
+                  onClick={() => {
+                    SSHC(value);
+                    myFunc();
+                  }}
+                  sx={{
+                    backgroundColor:
+                      switchState === value
+                        ? theme.palette.brightPurple.main
+                        : "transparent",
+                    color:
+                      switchState === value
+                        ? "#ffffff"
+                        : theme.palette.grey3.main,
+                    minWidth: isWrappMiniButtonSetting ? "30px" : "64px",
+                    height: "30px",
+                    "&:hover": {
+                      color: theme.palette.grey3.main,
+                      "& path": { stroke: theme.palette.grey3.main },
+                    },
+                  }}
+                >
+                  {icon}
+                  {isWrappMiniButtonSetting ? null : title}
+                </MiniButtonSetting>
               </>
             )}
           </Box>
         ))}
-        {quize.config.type === "quize" && (
-          <>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <DoubleTick style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <DoubleArrowRight style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <VectorQuestions style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-          </>
-        )}
+        <>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <DoubleTick style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <DoubleArrowRight style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <VectorQuestions style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+        </>
       </Box>
       <Box
         sx={{
diff --git a/src/pages/Questions/ButtonsOptionsAndPict.tsx b/src/pages/Questions/ButtonsOptionsAndPict.tsx
index 1fa10c25..fc59b983 100644
--- a/src/pages/Questions/ButtonsOptionsAndPict.tsx
+++ b/src/pages/Questions/ButtonsOptionsAndPict.tsx
@@ -149,160 +149,156 @@ export default function ButtonsOptionsAndPict({
           />
           {isIconMobile ? null : "Подсказка"}
         </MiniButtonSetting>
-        {quize.config.type === "quize" && (
-          <>
-            <Tooltip
-              arrow
-              placement="right"
-              componentsProps={{
-                tooltip: {
-                  sx: {
-                    background: "#fff",
-                    borderRadius: "6px",
-                    color: "#9A9AAF",
-                    boxShadow: "0px 8px 24px rgba(210, 208, 225, 0.4)",
-                    "& .MuiTooltip-arrow": {
-                      color: "#FFF",
-                    },
+        <>
+          <Tooltip
+            arrow
+            placement="right"
+            componentsProps={{
+              tooltip: {
+                sx: {
+                  background: "#fff",
+                  borderRadius: "6px",
+                  color: "#9A9AAF",
+                  boxShadow: "0px 8px 24px rgba(210, 208, 225, 0.4)",
+                  "& .MuiTooltip-arrow": {
+                    color: "#FFF",
                   },
                 },
-              }}
-              title={
-                <Box>
-                  <Typography
-                    sx={{
-                      color: "#4D4D4D",
-                      fontWeight: "bold",
-                      fontSize: "14px",
-                      marginBottom: "10px",
-                    }}
-                  >
-                    Будет показан при условии
-                  </Typography>
-                  <Typography sx={{ fontWeight: "bold", fontSize: "12px" }}>
-                    Название
-                  </Typography>
-                  <Typography
-                    sx={{
-                      fontWeight: "bold",
-                      fontSize: "12px",
-                      marginBottom: "10px",
-                    }}
-                  >
-                    Условие 1, Условие 2
-                  </Typography>
-                  <Typography sx={{ color: "#7E2AEA", fontSize: "12px" }}>
-                    Все условия обязательны
-                  </Typography>
-                </Box>
-              }
-            >
-              <MiniButtonSetting
-                onMouseEnter={() => setButtonHover("branching")}
-                onMouseLeave={() => setButtonHover("")}
-                onClick={() => {
-                  SSHC("branching");
-                  openedModal();
-                }}
-                sx={{
-                  height: "30px",
-                  maxWidth: "103px",
-                  minWidth: isIconMobile ? "30px" : "64px",
-                  backgroundColor:
-                    switchState === "branching"
-                      ? theme.palette.brightPurple.main
-                      : "transparent",
-                  color:
-                    switchState === "branching"
-                      ? "#ffffff"
-                      : theme.palette.grey3.main,
-                  "&:hover": {
-                    color:
-                      switchState === "branching"
-                        ? theme.palette.grey3.main
-                        : null,
-                  },
-                }}
-              >
-                <Branching
-                  color={
-                    buttonHover === "branching"
-                      ? theme.palette.grey3.main
-                      : switchState === "branching"
-                      ? "#ffffff"
-                      : theme.palette.grey3.main
-                  }
-                />
-                {isIconMobile ? null : "Ветвление"}
-              </MiniButtonSetting>
-            </Tooltip>
+              },
+            }}
+            title={
+              <Box>
+                <Typography
+                  sx={{
+                    color: "#4D4D4D",
+                    fontWeight: "bold",
+                    fontSize: "14px",
+                    marginBottom: "10px",
+                  }}
+                >
+                  Будет показан при условии
+                </Typography>
+                <Typography sx={{ fontWeight: "bold", fontSize: "12px" }}>
+                  Название
+                </Typography>
+                <Typography
+                  sx={{
+                    fontWeight: "bold",
+                    fontSize: "12px",
+                    marginBottom: "10px",
+                  }}
+                >
+                  Условие 1, Условие 2
+                </Typography>
+                <Typography sx={{ color: "#7E2AEA", fontSize: "12px" }}>
+                  Все условия обязательны
+                </Typography>
+              </Box>
+            }
+          >
             <MiniButtonSetting
-              onMouseEnter={() => setButtonHover("image")}
+              onMouseEnter={() => setButtonHover("branching")}
               onMouseLeave={() => setButtonHover("")}
               onClick={() => {
-                SSHC("image");
+                SSHC("branching");
+                openedModal();
               }}
               sx={{
                 height: "30px",
-                maxWidth: "123px",
+                maxWidth: "103px",
                 minWidth: isIconMobile ? "30px" : "64px",
                 backgroundColor:
-                  switchState === "image"
+                  switchState === "branching"
                     ? theme.palette.brightPurple.main
                     : "transparent",
                 color:
-                  switchState === "image"
+                  switchState === "branching"
                     ? "#ffffff"
                     : theme.palette.grey3.main,
                 "&:hover": {
                   color:
-                    switchState === "image" ? theme.palette.grey3.main : null,
+                    switchState === "branching"
+                      ? theme.palette.grey3.main
+                      : null,
                 },
               }}
             >
-              <ImgIcon
+              <Branching
                 color={
-                  buttonHover === "image"
+                  buttonHover === "branching"
                     ? theme.palette.grey3.main
-                    : switchState === "image"
+                    : switchState === "branching"
                     ? "#ffffff"
                     : theme.palette.grey3.main
                 }
               />
-              {isIconMobile ? null : "Изображение"}
+              {isIconMobile ? null : "Ветвление"}
             </MiniButtonSetting>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <DoubleTick style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <DoubleArrowRight style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-            <MiniButtonSetting
-              onClick={() => setOpenedReallyChangingModal(true)}
-              sx={{
-                minWidth: "30px",
-                height: "30px",
-                backgroundColor: "#FEDFD0",
-              }}
-            >
-              <VectorQuestions style={{ color: "#FC712F", fontSize: "9px" }} />
-            </MiniButtonSetting>
-          </>
-        )}
+          </Tooltip>
+          <MiniButtonSetting
+            onMouseEnter={() => setButtonHover("image")}
+            onMouseLeave={() => setButtonHover("")}
+            onClick={() => {
+              SSHC("image");
+            }}
+            sx={{
+              height: "30px",
+              maxWidth: "123px",
+              minWidth: isIconMobile ? "30px" : "64px",
+              backgroundColor:
+                switchState === "image"
+                  ? theme.palette.brightPurple.main
+                  : "transparent",
+              color:
+                switchState === "image" ? "#ffffff" : theme.palette.grey3.main,
+              "&:hover": {
+                color:
+                  switchState === "image" ? theme.palette.grey3.main : null,
+              },
+            }}
+          >
+            <ImgIcon
+              color={
+                buttonHover === "image"
+                  ? theme.palette.grey3.main
+                  : switchState === "image"
+                  ? "#ffffff"
+                  : theme.palette.grey3.main
+              }
+            />
+            {isIconMobile ? null : "Изображение"}
+          </MiniButtonSetting>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <DoubleTick style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <DoubleArrowRight style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+          <MiniButtonSetting
+            onClick={() => setOpenedReallyChangingModal(true)}
+            sx={{
+              minWidth: "30px",
+              height: "30px",
+              backgroundColor: "#FEDFD0",
+            }}
+          >
+            <VectorQuestions style={{ color: "#FC712F", fontSize: "9px" }} />
+          </MiniButtonSetting>
+        </>
       </Box>
       <Box
         sx={{