Merge branch 'fix' into 'main'

Fix

See merge request frontend/squiz!80

src/pages/InstallQuiz/InstallQuiz.tsx

@@ -193,7 +193,8 @@ export default function InstallQuiz() {
               <TextField
                 disabled
                 id={"inputLinkone"}
-                value="https://pena.com/"
+                value="https://hbpn.link/"
+                // value="https://pena.com/"
                 sx={{
                   "& .css-1d3z3hw-MuiOutlinedInput-notchedOutline": {
                     border: "none",

src/pages/Questions/DraggableList/QuestionPageCard.tsx

@@ -302,7 +302,8 @@ export default function QuestionsPageCard({ question, draggableProps, isDragging
                                         margin: "0 5px 0 10px",
                                     }}
                                     onClick={() => {
-                                        if(question.content.rule.parentId.length !== 0) {
+                                        if (question.type === null) deleteQuestion(question.id)
+                                        if(question?.content?.rule.parentId.length !== 0) {
                                             setOpenDelete(true)
                                         } else {
                                             deleteQuestionWithTimeout(question.id, deleteFn);

src/pages/ViewPublicationPage/ContactForm.tsx

@@ -155,8 +155,6 @@ const Inputs = () => {
     return <CustomInput title={FC.innerText || data.defaultText} desc={FC.text || data.defaultTitle} Icon={data.icon} />
   })
   
-  console.log(someUsed)
-  console.log(Icons)
   if (someUsed.length) {
     return <>{someUsed}</>
   } else {

src/pages/ViewPublicationPage/Footer.tsx

@@ -148,6 +148,8 @@ export const Footer = ({ setCurrentQuestion, question, setShowContactForm, setSh
   };
 
   const followNextStep = () => {
+
+
     if (linear) {
       const questionIndex = questions.findIndex(({ id }) => id === question.id);
       const nextQuestion = questions[questionIndex + 1];
@@ -171,6 +173,7 @@ export const Footer = ({ setCurrentQuestion, question, setShowContactForm, setSh
     if (nextQuestionId) {
       const nextQuestion = getQuestionByContentId(nextQuestionId);
 
+      console.log(nextQuestion);
       if (nextQuestion?.type && nextQuestion.type !== "result") {
         setCurrentQuestion(nextQuestion);
         return;
@@ -182,7 +185,7 @@ export const Footer = ({ setCurrentQuestion, question, setShowContactForm, setSh
       if (nextQuestion?.type && nextQuestion.type !== "result") {
         setCurrentQuestion(nextQuestion);
       } else {
-        showResult();
+        showResult(nextQuestion);
       }
     }
   };

src/pages/ViewPublicationPage/Question.tsx

@@ -43,8 +43,7 @@ const QUESTIONS_MAP: any = {
 
 export const Question = ({ questions }: QuestionProps) => {
   const quiz = useCurrentQuiz();
-  const [currentQuestion, setCurrentQuestion] =
+  const [currentQuestion, setCurrentQuestion] = useState<AnyTypedQuizQuestion>();
-    useState<AnyTypedQuizQuestion>();
   const [showContactForm, setShowContactForm] = useState<boolean>(false);
   const [showResultForm, setShowResultForm] = useState<boolean>(false);
 
@@ -62,8 +61,7 @@ export const Question = ({ questions }: QuestionProps) => {
 
   if (!currentQuestion) return <>не смог отобразить вопрос</>;
 
-  const QuestionComponent =
+  const QuestionComponent = QUESTIONS_MAP[currentQuestion.type as Exclude<QuestionType, "nonselected">];
-    QUESTIONS_MAP[currentQuestion.type as Exclude<QuestionType, "nonselected">];
 
     console.log("showResultForm " , showResultForm)
   return (

src/pages/ViewPublicationPage/StartPageViewPublication.tsx

@@ -1,24 +1,16 @@
-import {
+import { Box, Button, ButtonBase, Link, Paper, Typography, useMediaQuery, useTheme } from "@mui/material";
-  Box,
-  Button,
-  ButtonBase,
-  Link,
-  Paper,
-  Typography,
-  useMediaQuery,
-  useTheme,
-} from "@mui/material";
 import { useCurrentQuiz } from "@root/quizes/hooks";
 import YoutubeEmbedIframe from "../../ui_kit/StartPagePreview/YoutubeEmbedIframe";
 import { QuizStartpageAlignType, QuizStartpageType } from "@model/quizSettings";
 import { notReachable } from "../../utils/notReachable";
 import { useUADevice } from "../../utils/hooks/useUADevice";
+import { NameplateLogo } from "@icons/NameplateLogo";
 
 interface Props {
-  setVisualStartPage: (a:boolean) => void
+  setVisualStartPage: (a: boolean) => void;
 }
 
-export const StartPageViewPublication = ({setVisualStartPage}:Props) => {
+export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
   const theme = useTheme();
   const quiz = useCurrentQuiz();
   const { isMobileDevice } = useUADevice();
@@ -29,9 +21,9 @@ export const StartPageViewPublication = ({setVisualStartPage}:Props) => {
     navigator.clipboard.writeText(quiz.config.info.phonenumber);
   };
 
-  const background = quiz.config.startpage.background.type === "image"
+  const background =
-    ? quiz.config.startpage.background.desktop
+    quiz.config.startpage.background.type === "image" ? (
-      ? (
+      quiz.config.startpage.background.desktop ? (
         <img
           src={quiz.config.startpage.background.desktop}
           alt=""
@@ -39,155 +31,199 @@ export const StartPageViewPublication = ({setVisualStartPage}:Props) => {
             width: "100%",
             height: "100%",
             objectFit: "cover",
-            overflow: "hidden"
+            overflow: "hidden",
           }}
         />
-      )
+      ) : null
-      : null
+    ) : quiz.config.startpage.background.type === "video" ? (
-    : quiz.config.startpage.background.type === "video"
+      quiz.config.startpage.background.video ? (
-      ? quiz.config.startpage.background.video
+        <YoutubeEmbedIframe
-        ? (
+          videoUrl={quiz.config.startpage.background.video}
-          <YoutubeEmbedIframe videoUrl={quiz.config.startpage.background.video}
+          containerSX={{
-            containerSX={{
+            width:
-              width: quiz.config.startpageType === "centered" ? "550px" : quiz.config.startpageType === "expanded" ? "100vw" : "100%",
+              quiz.config.startpageType === "centered"
-              height: quiz.config.startpageType === "centered" ? "275px" : quiz.config.startpageType === "expanded" ? "100vh" : "100%",
+                ? "550px"
-              borderRadius: quiz.config.startpageType === "centered" ? "10px" : "0",
+                : quiz.config.startpageType === "expanded"
-              overflow: "hidden",
+                ? "100vw"
-              "& iframe": {
+                : "100%",
-                width: "100%",
+            height:
-                height: "100%",
+              quiz.config.startpageType === "centered"
-                transform: quiz.config.startpageType === "centered" ? "" : quiz.config.startpageType === "expanded" ? "scale(1.5)" : "scale(2.4)",
+                ? "275px"
-
+                : quiz.config.startpageType === "expanded"
-              }
+                ? "100vh"
-
+                : "100%",
-            }}
+            borderRadius: quiz.config.startpageType === "centered" ? "10px" : "0",
-          />
+            overflow: "hidden",
-        )
+            "& iframe": {
-        : null
+              width: "100%",
-      : null;
+              height: "100%",
+              transform:
+                quiz.config.startpageType === "centered"
+                  ? ""
+                  : quiz.config.startpageType === "expanded"
+                  ? "scale(1.5)"
+                  : "scale(2.4)",
+            },
+          }}
+        />
+      ) : null
+    ) : null;
 
   return (
-    <Paper className="quiz-preview-draghandle"
+    <Paper
+      className="quiz-preview-draghandle"
       sx={{
         height: "100vh",
-        background: quiz.config.startpageType === "expanded" ?
+        background:
-          quiz.config.startpage.position === "left" ? "linear-gradient(90deg,#272626,transparent)" :
+          quiz.config.startpageType === "expanded"
-          quiz.config.startpage.position === "center" ? "linear-gradient(180deg,transparent,#272626)" :
+            ? quiz.config.startpage.position === "left"
-          "linear-gradient(270deg,#272626,transparent)" 
+              ? "linear-gradient(90deg,#272626,transparent)"
-        : "",
+              : quiz.config.startpage.position === "center"
-        color: quiz.config.startpageType === "expanded" ? "white" : "black"
+              ? "linear-gradient(180deg,transparent,#272626)"
-      
+              : "linear-gradient(270deg,#272626,transparent)"
-
+            : "",
-      }}>
+        color: quiz.config.startpageType === "expanded" ? "white" : "black",
+      }}
+    >
       <QuizPreviewLayoutByType
-        quizHeaderBlock={<Box 
+        quizHeaderBlock={
-        p={quiz.config.startpageType === "standard" ? "" : "16px"}
+          <Box p={quiz.config.startpageType === "standard" ? "" : "16px"}>
-        >
+            <Box
-          <Box sx={{
+              sx={{
-            display: "flex",
+                display: "flex",
-            alignItems: "center",
+                alignItems: "center",
-            gap: "20px",
+                gap: "20px",
-            mb: "7px"
+                mb: "7px",
-          }}>
+              }}
-            {quiz.config.startpage.logo && (
+            >
-              <img
+              {quiz.config.startpage.logo && (
-                src={quiz.config.startpage.logo}
+                <img
-                style={{
+                  src={quiz.config.startpage.logo}
-                  height: "37px",
+                  style={{
-                  maxWidth: "43px",
+                    height: "37px",
-                  objectFit: "cover",
+                    maxWidth: "43px",
-                }}
+                    objectFit: "cover",
-                alt=""
+                  }}
-              />
+                  alt=""
-            )}
+                />
-            <Typography sx={{ fontSize: "14px" }}>
+              )}
-              {quiz.config.info.orgname}
+              <Typography sx={{ fontSize: "14px" }}>{quiz.config.info.orgname}</Typography>
-            </Typography>
+            </Box>
+            <Link mb="16px" href={quiz.config.info.site}>
+              <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
+                {quiz.config.info.site}
+              </Typography>
+            </Link>
           </Box>
-          <Link mb="16px" href={quiz.config.info.site}>
+        }
-            <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
+        quizMainBlock={
-              {quiz.config.info.site}
+          <>
-            </Typography>
+            <Box
-          </Link>
+              sx={{
-        </Box>}
+                display: "flex",
-        quizMainBlock={<>
+                flexDirection: "column",
-          <Box sx={{
+                justifyContent: "center",
-            display: "flex",
+                alignItems:
-            flexDirection: "column",
+                  quiz.config.startpageType === "centered"
-            justifyContent: "center",
+                    ? "center"
-            alignItems: quiz.config.startpageType === "centered" ? "center" :
+                    : quiz.config.startpageType === "expanded"
-              quiz.config.startpageType === "expanded"
+                    ? quiz.config.startpage.position === "center"
-                ? quiz.config.startpage.position === "center" ?
+                      ? "center"
-                "center"
+                      : "start"
-                : "start": "start",
+                    : "start",
-            mt: "28px",
+                mt: "28px",
-            width: "100%"
+                width: "100%",
-          }}>
+              }}
-            <Typography sx={{
+            >
-              fontWeight: "bold",
+              <Typography
-              fontSize: "26px",
+                sx={{
-              fontStyle: "normal",
+                  fontWeight: "bold",
-              fontStretch: "normal",
+                  fontSize: "26px",
-              lineHeight: "1.2",
+                  fontStyle: "normal",
-            }}>{quiz.name}</Typography>
+                  fontStretch: "normal",
-            <Typography sx={{
+                  lineHeight: "1.2",
-              fontSize: "16px",
+                }}
-              m: "16px 0"
+              >
-            }}>
+                {quiz.name}
-              {quiz.config.startpage.description}
+              </Typography>
-            </Typography>
+              <Typography
-            <Box width={ quiz.config.startpageType === "standard" ? "100%" : "auto"}>
-              <Button
-                variant="contained"
                 sx={{
                   fontSize: "16px",
-                  padding: "10px 15px",
+                  m: "16px 0",
-                  width: quiz.config.startpageType === "standard" ? "100%" : "auto"
                 }}
-              onClick={() => setVisualStartPage(true)}
               >
-                {quiz.config.startpage.button.trim() ? quiz.config.startpage.button : "Пройти тест"}
+                {quiz.config.startpage.description}
-              </Button>
-            </Box>
-          </Box>
-          <Box
-            sx={{
-              mt: "46px"
-            }}
-          >
-            {quiz.config.info.clickable ? (
-              isMobileDevice ? (
-                <Link href={`tel:${quiz.config.info.phonenumber}`}>
-                  <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
-                    {quiz.config.info.phonenumber}
-                  </Typography>
-                </Link>
-              ) : (
-                <ButtonBase onClick={handleCopyNumber}>
-                  <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
-                    {quiz.config.info.phonenumber}
-                  </Typography>
-                </ButtonBase>
-              )
-            ) : (
-              <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
-                {quiz.config.info.phonenumber}
               </Typography>
-            )}
+              <Box width={quiz.config.startpageType === "standard" ? "100%" : "auto"}>
-            <Typography sx={{ fontSize: "12px", textAlign: "end" }}>
+                <Button
-              {quiz.config.info.law}
+                  variant="contained"
-            </Typography>
+                  sx={{
-          </Box>
+                    fontSize: "16px",
-        </>}
+                    padding: "10px 15px",
+                    width: quiz.config.startpageType === "standard" ? "100%" : "auto",
+                  }}
+                  onClick={() => setVisualStartPage(true)}
+                >
+                  {quiz.config.startpage.button.trim() ? quiz.config.startpage.button : "Пройти тест"}
+                </Button>
+              </Box>
+            </Box>
+
+            <Box
+              sx={{ mt: "46px", display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%" }}
+            >
+              <Box>
+                {quiz.config.info.clickable ? (
+                  isMobileDevice ? (
+                    <Link href={`tel:${quiz.config.info.phonenumber}`}>
+                      <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
+                        {quiz.config.info.phonenumber}
+                      </Typography>
+                    </Link>
+                  ) : (
+                    <ButtonBase onClick={handleCopyNumber}>
+                      <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
+                        {quiz.config.info.phonenumber}
+                      </Typography>
+                    </ButtonBase>
+                  )
+                ) : (
+                  <Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
+                    {quiz.config.info.phonenumber}
+                  </Typography>
+                )}
+                <Typography sx={{ fontSize: "12px", textAlign: "end" }}>{quiz.config.info.law}</Typography>
+              </Box>
+
+              <Box
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                }}
+              >
+                <NameplateLogo style={{ fontSize: "34px" }} />
+                <Typography sx={{ fontSize: "20px", color: "#4D4D4D", whiteSpace: "nowrap" }}>
+                  Сделано на PenaQuiz
+                </Typography>
+              </Box>
+            </Box>
+          </>
+        }
         backgroundBlock={background}
         startpageType={quiz.config.startpageType}
         alignType={quiz.config.startpage.position}
       />
     </Paper>
   );
-}
+};
 
-function QuizPreviewLayoutByType({ quizHeaderBlock, quizMainBlock, backgroundBlock, startpageType, alignType }: {
+function QuizPreviewLayoutByType({
+  quizHeaderBlock,
+  quizMainBlock,
+  backgroundBlock,
+  startpageType,
+  alignType,
+}: {
   quizHeaderBlock: JSX.Element;
   quizMainBlock: JSX.Element;
   backgroundBlock: JSX.Element | null;
@@ -201,28 +237,35 @@ function QuizPreviewLayoutByType({ quizHeaderBlock, quizMainBlock, backgroundBlo
     case null:
     case "standard": {
       return (
-        <Box sx={{
+        <Box
-          display: "flex",
+          sx={{
-          flexDirection: alignType === "left" ? "row" : "row-reverse",
-          flexGrow: 1,
-          height: "100vh",
-          "&::-webkit-scrollbar": { width: 0 },
-        }}>
-          <Box sx={{
-            width: !isTablet ? "40%" : "100%",
             display: "flex",
-            flexDirection: "column",
+            flexDirection: alignType === "left" ? "row" : "row-reverse",
-            justifyContent: "space-between",
+            flexGrow: 1,
-            alignItems: !isTablet ? "flex-start" : "center",
+            height: "100vh",
-            p: "25px"
+            "&::-webkit-scrollbar": { width: 0 },
-          }}>
+          }}
+        >
+          <Box
+            sx={{
+              width: !isTablet ? "40%" : "100%",
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "space-between",
+              alignItems: !isTablet ? "flex-start" : "center",
+              p: "25px",
+            }}
+          >
             {quizHeaderBlock}
             {quizMainBlock}
           </Box>
-          <Box sx={{
+
-            width: "60%",
+          <Box
-            overflow: "hidden"
+            sx={{
-          }}>
+              width: "60%",
+              overflow: "hidden",
+            }}
+          >
             {backgroundBlock}
           </Box>
         </Box>
@@ -230,36 +273,42 @@ function QuizPreviewLayoutByType({ quizHeaderBlock, quizMainBlock, backgroundBlo
     }
     case "expanded": {
       return (
-        <Box sx={{
+        <Box
-          position: "relative",
+          sx={{
-          display: "flex",
-          justifyContent: startpageAlignTypeToJustifyContent[alignType],
-          flexGrow: 1,
-          height: "100%",
-          "&::-webkit-scrollbar": { width: 0 },
-        }}>
-          <Box sx={{
-            width: "40%",
             position: "relative",
-            padding: "16px",
-            zIndex: 2,
             display: "flex",
-            flexDirection: "column",
+            justifyContent: startpageAlignTypeToJustifyContent[alignType],
-            justifyContent: "space-between",
+            flexGrow: 1,
-            alignItems: alignType === "center" ? "center" : "start",
+            height: "100%",
-          }}>
+            "&::-webkit-scrollbar": { width: 0 },
+          }}
+        >
+          <Box
+            sx={{
+              width: "40%",
+              position: "relative",
+              padding: "16px",
+              zIndex: 2,
+              display: "flex",
+              flexDirection: "column",
+              justifyContent: "space-between",
+              alignItems: alignType === "center" ? "center" : "start",
+            }}
+          >
             {quizHeaderBlock}
             {quizMainBlock}
           </Box>
-          <Box sx={{
+          <Box
-            position: "absolute",
+            sx={{
-            left: 0,
+              position: "absolute",
-            top: 0,
+              left: 0,
-            height: "100%",
+              top: 0,
-            width: "100%",
+              height: "100%",
-            zIndex: 1,
+              width: "100%",
-            overflow: "hidden"
+              zIndex: 1,
-          }}>
+              overflow: "hidden",
+            }}
+          >
             {backgroundBlock}
           </Box>
         </Box>
@@ -267,27 +316,26 @@ function QuizPreviewLayoutByType({ quizHeaderBlock, quizMainBlock, backgroundBlo
     }
     case "centered": {
       return (
-        <Box sx={{
+        <Box
-          padding: "16px",
+          sx={{
-          display: "flex",
+            padding: "16px",
-          flexDirection: "column",
+            display: "flex",
-          justifyContent: "center",
+            flexDirection: "column",
-          alignItems: "center",
+            justifyContent: "center",
-          height: "100%",
+            alignItems: "center",
-          "&::-webkit-scrollbar": { width: 0 },
+            height: "100%",
-          overflow: "hidden"
+            "&::-webkit-scrollbar": { width: 0 },
-        }}>
+            overflow: "hidden",
+          }}
+        >
           {quizHeaderBlock}
-          {backgroundBlock &&
+          {backgroundBlock && <Box>{backgroundBlock}</Box>}
-            <Box>
-              {backgroundBlock}
-            </Box>
-          }
           {quizMainBlock}
         </Box>
       );
     }
-    default: notReachable(startpageType);
+    default:
+      notReachable(startpageType);
   }
 }
 

src/pages/startPage/EditPage.tsx

@@ -78,7 +78,9 @@ export default function EditPage() {
     []
   );
   console.log(currentStep)
+  console.log(quizConfig)
 
+  if (!quizConfig) return <></>
   return (
     <>
       {/*хедер*/}
@@ -349,6 +351,14 @@ export default function EditPage() {
                       )
                   }}
               >{quiz?.status === "start" ? "Стоп" : "Старт"}</Button>
+
+              {quiz?.status === "start" && <Box
+              component={Link}
+              sx={{
+                color: "#7e2aea",
+                fontSize: "14px"
+              }}
+              target="_blank" to={"https://hbpn.link/" + quiz.qid}>https://hbpn.link/{quiz.qid}</Box> }
           </Box>
       </Box>
     </>