удаление line результа при создании дерева

src/pages/Questions/BranchingMap/CsComponent.tsx

@@ -1,13 +1,12 @@
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import Cytoscape from "cytoscape";
-import { Button } from "@mui/material";
 import CytoscapeComponent from "react-cytoscapejs";
 import popper from "cytoscape-popper";
 import { useCurrentQuiz } from "@root/quizes/hooks";
 import { updateRootContentId } from "@root/quizes/actions"
 import { AnyTypedQuizQuestion } from "@model/questionTypes/shared"
 import { useQuestionsStore } from "@root/questions/store";
-import { deleteQuestion, cleardragQuestionContentId, updateQuestion, updateOpenedModalSettingsId, getQuestionByContentId, clearRuleForAll } from "@root/questions/actions";
+import { cleardragQuestionContentId, updateQuestion, updateOpenedModalSettingsId, getQuestionByContentId, clearRuleForAll, deleteQuestion } from "@root/questions/actions";
 import { withErrorBoundary } from "react-error-boundary";
 
 import { storeToNodes } from "./helper";
@@ -112,6 +111,9 @@ interface Props {
 }
 
 
+let zoomTimeout = null
+
+
 function CsComponent({
   modalQuestionParentContentId,
   modalQuestionTargetContentId,
@@ -216,6 +218,7 @@ function CsComponent({
     }
   }
 
+
   const removeNode = ({ targetNodeContentId }: { targetNodeContentId: string }) => {
     const deleteNodes = [] as string[]
     const deleteEdges: any = []
@@ -331,6 +334,7 @@ function CsComponent({
   }
 
 
+
   useEffect(() => {
     if (startCreate) {
       addNode({ parentNodeContentId: startCreate });
@@ -348,7 +352,6 @@ function CsComponent({
 
 
   const readyLO = (e) => {
-    console.log('REAdy')
     if (e.cy.data('firstNode') === 'nonroot') {
       e.cy.data('firstNode', 'root')
       e.cy.nodes().sort((a, b) => (a.data('root') ? 1 : -1)).layout(lyopts).run()
@@ -433,7 +436,6 @@ function CsComponent({
           task.task.forEach(n => {
             const width = n.data('subtreeWidth')
 
-            console.log('ORORORORO', n.data(), yoffset, width, oldPos, task.parent.data('subtreeWidth'))
             n.data('oldPos', { x: 250 * n.data('layer'), y: yoffset + width / 2 })
             yoffset += width
             queue.push({ task: n.cy().edges(`[source="${n.id()}"]`).targets(), parent: n })
@@ -462,7 +464,6 @@ function CsComponent({
   }
 
   useEffect(() => {
-    console.log('KEKEKE')
     document.querySelector("#root")?.addEventListener("mouseup", cleardragQuestionContentId);
     const cy = cyRef.current;
     const eles = cy?.add(storeToNodes(questions.filter((question: AnyTypedQuizQuestion) => (question.type !== "result" && question.type !== null))))
@@ -510,7 +511,6 @@ function CsComponent({
     if (!container) {
       return;
     }
-    console.log('POP')
 
     container.style.overflow = "hidden";
 
@@ -540,7 +540,6 @@ function CsComponent({
       const bb = n.boundingBox()
       return bb.x2 > ext.x1 && bb.x1 < ext.x2 && bb.y2 > ext.y1 && bb.y1 < ext.y2
     })
-    console.log('POPE')
 
     nodesInView
       .toArray()
@@ -553,7 +552,6 @@ function CsComponent({
             modifiers: [{ name: "flip", options: { boundary: node } }],
           },
           content: ([item]) => {
-    console.log('POPPER', item.id())
             const itemId = item.id();
             const itemElement = layoutsContainer.current?.querySelector(
               `.popper-layout[data-id='${itemId}']`
@@ -583,7 +581,6 @@ function CsComponent({
             modifiers: [{ name: "flip", options: { boundary: node } }],
           },
           content: ([item]) => {
-    console.log('POPPER+', item.id())
             const itemId = item.id();
             const itemElement = plusesContainer.current?.querySelector(
               `.popper-plus[data-id='${itemId}']`
@@ -612,7 +609,6 @@ function CsComponent({
             modifiers: [{ name: "flip", options: { boundary: node } }],
           },
           content: ([item]) => {
-    console.log('POPPERx', item.id())
             const itemId = item.id();
             const itemElement = crossesContainer.current?.querySelector(
               `.popper-cross[data-id='${itemId}']`
@@ -643,7 +639,6 @@ function CsComponent({
             modifiers: [{ name: "flip", options: { boundary: node } }],
           },
           content: ([item]) => {
-    console.log('POPPERg', item.id())
             const itemId = item.id();
             if (item.cy().edges(`[target="${itemId}"]`).sources().length === 0) {
               return;
@@ -670,7 +665,6 @@ function CsComponent({
         });
 
         const update = async () => {
-    console.log('POPPERi=u', item.id())
           await plusesPopper.update();
           await crossesPopper.update();
           await gearsPopper.update();
@@ -678,7 +672,11 @@ function CsComponent({
         };
 
         const onZoom = (event: AbstractEventObject) => {
-          console.log('ZOOOOM')
+          if (zoomTimeout) clearTimeout(zoomTimeout)
+          zoomTimeout = setTimeout(() => {
+            update()
+          }, 300)
+          
           const zoom = event.cy.zoom();
 
           //update();
@@ -735,13 +733,13 @@ function CsComponent({
         };
 
         //node?.on("position", update);
-let pressed = false
+        let pressed = false
         let hide = false
-        cy?.on('mousedown',() => {pressed = true})
+        cy?.on('mousedown', () => { pressed = true })
-        cy?.on('mouseup',() => {
+        cy?.on('mouseup', () => {
           pressed = false
           hide = false
-          
+
 
           const gc = gearsContainer.current
           if (gc) gc.style.display = 'block'
@@ -751,46 +749,29 @@ let pressed = false
           if (pc) pc.style.display = 'block'
           if (xc) xc.style.display = 'block'
           if (lc) lc.style.display = 'block'
-            update()
+          update()
         })
 
-        cy?.on('mousemove',() => {
+        cy?.on('mousemove', () => {
           if (pressed && !hide) {
             hide = true
             const gc = gearsContainer.current
             if (gc) gc.style.display = 'none'
-          const pc = plusesContainer.current
+            const pc = plusesContainer.current
-          const xc = crossesContainer.current
+            const xc = crossesContainer.current
-          const lc = layoutsContainer.current
+            const lc = layoutsContainer.current
-          if (pc) pc.style.display = 'none'
+            if (pc) pc.style.display = 'none'
-          if (xc) xc.style.display = 'none'
+            if (xc) xc.style.display = 'none'
-          if (lc) lc.style.display = 'block'
+            if (lc) lc.style.display = 'block'
           }
-          });
+        });
- 
+
         cy?.on("zoom render", onZoom);
       });
   };
 
   return (
     <>
-      <Button
-        sx={{
-          mb: "20px",
-          height: "27px",
-          color: "#7E2AEA",
-          textDecoration: "underline",
-          fontSize: "16px",
-        }}
-        variant="text"
-        onClick={() => {
-
-          //код сюда
-
-        }}
-      >
-        Выровнять
-      </Button>
       <CytoscapeComponent
         wheelSensitivity={0.1}
         elements={[]}

src/pages/Questions/BranchingMap/FirstNodeField.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mui/material"
 import { useEffect, useRef, useState } from "react";
-import { updateDragQuestionContentId, updateQuestion } from "@root/questions/actions"
+import { deleteQuestion, updateDragQuestionContentId, updateQuestion } from "@root/questions/actions"
 import { updateRootContentId } from "@root/quizes/actions"
 import { useCurrentQuiz } from "@root/quizes/hooks"
 import { useQuestionsStore } from "@root/questions/store"
@@ -11,8 +11,9 @@ interface Props {
     modalQuestionTargetContentId: string;
 }
 export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetContentId }: Props) => {
+
     const quiz = useCurrentQuiz();
-    const { dragQuestionContentId } = useQuestionsStore()
+    const { dragQuestionContentId, questions } = useQuestionsStore()
     const Container = useRef<HTMLDivElement | null>(null);
 
     const modalOpen = () => setOpenedModalQuestions(true)
@@ -22,6 +23,11 @@ export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetCon
             if (dragQuestionContentId) {
                 updateRootContentId(quiz?.id, dragQuestionContentId)
                 updateQuestion(dragQuestionContentId, (question) => question.content.rule.parentId = "root")
+                //если были результаты - удалить
+                questions.forEach((q) => {
+                    if (q.type === 'result') deleteQuestion(q.id)
+                })
+
             }
         } else {
             enqueueSnackbar("Нет информации о взятом опроснике")
@@ -44,6 +50,10 @@ export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetCon
             if (modalQuestionTargetContentId) {
                 updateRootContentId(quiz?.id, modalQuestionTargetContentId)
                 updateQuestion(modalQuestionTargetContentId, (question) => question.content.rule.parentId = "root")
+                //если были результаты - удалить
+                questions.forEach((q) => {
+                    if (q.type === 'result') deleteQuestion(q.id)
+                })
             }
         } else {
             enqueueSnackbar("Нет информации о взятом опроснике")

src/pages/Questions/ButtonsOptions.tsx

@@ -11,7 +11,7 @@ import {
     useMediaQuery,
     useTheme,
 } from "@mui/material";
-import { copyQuestion, deleteQuestion, updateOpenBranchingPanel, updateDesireToOpenABranchingModal } from "@root/questions/actions";
+import { copyQuestion, deleteQuestion, updateOpenBranchingPanel, updateDesireToOpenABranchingModal, updateOpenedModalSettingsId, clearRuleForAll } from "@root/questions/actions";
 import MiniButtonSetting from "@ui_kit/MiniButtonSetting";
 import { CopyIcon } from "../../assets/icons/questionsPage/CopyIcon";
 import Branching from "../../assets/icons/questionsPage/branching";
@@ -22,7 +22,7 @@ import type { AnyTypedQuizQuestion } from "../../model/questionTypes/shared";
 import { useCurrentQuiz } from "@root/quizes/hooks";
 import { enqueueSnackbar } from "notistack";
 import { useQuestionsStore } from "@root/questions/store";
-import { updateOpenedModalSettingsId } from "@root/questions/actions";
+import { updateRootContentId } from "@root/quizes/actions";
 
 interface Props {
     switchState: string;
@@ -40,7 +40,7 @@ export default function ButtonsOptions({
     const isMobile = useMediaQuery(theme.breakpoints.down(790));
     const isWrappMiniButtonSetting = useMediaQuery(theme.breakpoints.down(920));
     const quiz = useCurrentQuiz();
-    const { openBranchingPanel } = useQuestionsStore.getState()
+    const { questions } = useQuestionsStore.getState()
 
     const openedModal = () => {
         updateOpenedModalSettingsId(question.id)

src/pages/ResultPage/ResultSettings.tsx

@@ -33,7 +33,6 @@ export const ResultSettings = () => {
         isReadyToLeave = false;
       }
     });
-    console.log(`setting isReadyToLeaveRef to ${isReadyToLeave}`);
     isReadyToLeaveRef.current = isReadyToLeave;
   }, [results])
 

src/pages/ViewPublicationPage/questions/Number.tsx

@@ -46,7 +46,6 @@ export const Number = ({ currentQuestion }: NumberProps) => {
   const max = window.Number(currentQuestion.content.range.split("—")[1]);
 
   useEffect(() => {
-    console.log("ans", currentQuestion.content.start);
     if (answer) {
       setMinRange(answer.split("—")[0]);
       setMaxRange(answer.split("—")[1]);