-
More templates soon!
-
- Any suggestions?
-
- Create an issue
-
+
setIsWarningOpen(false)}
+ title="Warning"
+ content={
+
+
+ All unsaved changes will be lost. Are you sure you want to
+ continue?
+
+
+
+
+
+ }
+ />
+
+
+ Start a new form
+
+
+ {showGallery && (
+ <>
+
+
+ handleTemplateClick(e, { title: '', questions: [] })
+ }
+ fieldTestSelector="start-from-scratch-field"
+ />
+ {TEMPLATES.map((template, index) => (
+ handleTemplateClick(e, template)}
+ />
+ ))}
+
+
+
+ )}
);
}
diff --git a/src/features/surveys/features/SurveyCreator/components/TitleAndConfigSection/TitleAndConfigSection.tsx b/src/features/surveys/features/SurveyCreator/components/TitleAndConfigSection/TitleAndConfigSection.tsx
index bdc68f32..67ce2799 100644
--- a/src/features/surveys/features/SurveyCreator/components/TitleAndConfigSection/TitleAndConfigSection.tsx
+++ b/src/features/surveys/features/SurveyCreator/components/TitleAndConfigSection/TitleAndConfigSection.tsx
@@ -1,9 +1,4 @@
-import {
- ArrowLeftIcon,
- CogIcon,
- EyeIcon,
- EyeOffIcon,
-} from '@heroicons/react/outline';
+import { CogIcon, EyeIcon, EyeOffIcon } from '@heroicons/react/outline';
import SurveyOptionsModalModal from 'features/surveys/components/SurveyOptionsModal/SurveyOptionsModal';
import useModal from 'features/surveys/hooks/useModal';
import useTranslation from 'next-translate/useTranslation';
@@ -27,8 +22,6 @@ export default function TitleAndConfigSection() {
handleChangeTitle,
surveyOptions,
updateSurveyOptions,
- isEditMode,
- setIsTemplatePicked,
} = useSurveyCreatorContext();
const { togglePanel, isPanelOpened } = usePreviewPanelContext();
@@ -41,19 +34,6 @@ export default function TitleAndConfigSection() {
return (
<>
- {!isEditMode && (
-
- )}
-
{
return result;
};
+beforeEach(() => {
+ window.sessionStorage.clear();
+});
+
describe('useCreateSurveyManager tests', () => {
it('should add questions correctly', async () => {
const result = setUp();
diff --git a/src/features/surveys/features/SurveyCreator/managers/createSurveyManager/createSurveyManager.ts b/src/features/surveys/features/SurveyCreator/managers/createSurveyManager/createSurveyManager.ts
index c34277c1..79bae9f0 100644
--- a/src/features/surveys/features/SurveyCreator/managers/createSurveyManager/createSurveyManager.ts
+++ b/src/features/surveys/features/SurveyCreator/managers/createSurveyManager/createSurveyManager.ts
@@ -38,6 +38,7 @@ export const useCreateSurveyManager = (initialData?: SurveyWithQuestions) => {
const [isEditMode] = useState(!!initialData);
const [title, setTitle] = useState(initialData?.title ?? 'My survey');
+ const [isLoaded, setIsLoaded] = useState(isEditMode);
const mapQuestionsWithExpanded = (
questions: QuestionWithLogicPath[]
@@ -71,16 +72,14 @@ export const useCreateSurveyManager = (initialData?: SurveyWithQuestions) => {
const { copy } = useCopyToClipboard();
const { t } = useTranslation('surveyCreate');
- const [isTemplatePicked, setIsTemplatePicked] = useState(false);
-
const signInToCreateSurvey = () => {
router.push('/login');
};
useEffect(() => {
- if (!isTemplatePicked || isEditMode) return;
+ if (isEditMode) return;
- if (questions.length > 0) {
+ if (typeof window !== 'undefined' && isLoaded) {
sessionStorage.setItem(
DRAFT_SURVEY_SESSION_STORAGE,
JSON.stringify({
@@ -90,26 +89,28 @@ export const useCreateSurveyManager = (initialData?: SurveyWithQuestions) => {
})
);
}
- }, [title, questions, surveyOptions, isTemplatePicked, isEditMode]);
+ }, [title, questions, surveyOptions, isEditMode, isLoaded]);
useEffect(() => {
setActivePage(isEditMode ? Page.EDIT_SURVEY : Page.CREATE_SURVEY);
-
+ if (!isEditMode && typeof window !== 'undefined') {
+ const draftSurvey = sessionStorage.getItem(DRAFT_SURVEY_SESSION_STORAGE);
+ if (draftSurvey) {
+ const { title, questions, surveyOptions } = JSON.parse(draftSurvey);
+ if (title !== undefined) setTitle(title);
+ if (questions !== undefined) setQuestions(questions);
+ if (surveyOptions !== undefined) setSurveyOptions(surveyOptions);
+ }
+ setIsLoaded(true);
+ } else if (isEditMode) {
+ setIsLoaded(true);
+ }
return () => {
setActivePage(undefined);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
- const getDraftSurveyFromSessionStorage = () => {
- const draftSurvey = sessionStorage.getItem(DRAFT_SURVEY_SESSION_STORAGE);
- if (draftSurvey) {
- const { title, questions, surveyOptions } = JSON.parse(draftSurvey);
-
- return { title, questions, surveyOptions };
- }
- };
-
const updateSurveyOptions = (
option: keyof SurveyOptions,
value: boolean | string
@@ -370,7 +371,9 @@ export const useCreateSurveyManager = (initialData?: SurveyWithQuestions) => {
copiedCorrectly ? t('surveyCreationSucessCopiedCorrectly') : ''
}`
);
- sessionStorage.removeItem(DRAFT_SURVEY_SESSION_STORAGE);
+ if (typeof window !== 'undefined') {
+ sessionStorage.removeItem(DRAFT_SURVEY_SESSION_STORAGE);
+ }
} catch (error) {
toast.error(t('surveyCreationFailed'));
}
@@ -521,9 +524,6 @@ export const useCreateSurveyManager = (initialData?: SurveyWithQuestions) => {
updateLogicPath,
expandAdvancedSettings,
selectTemplate,
- getDraftSurveyFromSessionStorage,
- isTemplatePicked,
- setIsTemplatePicked,
};
};
diff --git a/src/features/surveys/features/SurveyCreator/managers/previewPanelManager/previewPanelManager.ts b/src/features/surveys/features/SurveyCreator/managers/previewPanelManager/previewPanelManager.ts
index 3da4731f..6cbce702 100644
--- a/src/features/surveys/features/SurveyCreator/managers/previewPanelManager/previewPanelManager.ts
+++ b/src/features/surveys/features/SurveyCreator/managers/previewPanelManager/previewPanelManager.ts
@@ -1,16 +1,24 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
export const usePreviewPanelManager = () => {
const [isPanelOpened, setIsPanelOpened] = useState(false);
-
+ const [openedWithoutAnimation, setOpenedWithoutAnimation] = useState(false);
const [restartTrigger, setRestartTrigger] = useState(0);
+ useEffect(() => {
+ if (typeof window !== 'undefined' && window.innerWidth >= 1280) {
+ setIsPanelOpened(true);
+ setOpenedWithoutAnimation(true);
+ }
+ }, []);
+
const handleRestart = () => {
setRestartTrigger((prev) => prev + 1);
};
const togglePanel = () => {
setIsPanelOpened((prev) => !prev);
+ setOpenedWithoutAnimation(false);
};
return {
@@ -18,6 +26,7 @@ export const usePreviewPanelManager = () => {
togglePanel,
restartTrigger,
handleRestart,
+ openedWithoutAnimation,
};
};
diff --git a/src/shared/constants/routesConfig.ts b/src/shared/constants/routesConfig.ts
index da8744a9..17134c13 100644
--- a/src/shared/constants/routesConfig.ts
+++ b/src/shared/constants/routesConfig.ts
@@ -1,3 +1,3 @@
export const EXTERNAL_ROUTES = ['/survey/[surveyId]'];
-export const FULL_PAGE_ROUTES = ['/survey/create', '/survey/[surveyId]/edit'];
+export const FULL_PAGE_ROUTES = ['/survey/create', '/survey/edit/[surveyId]'];
diff --git a/src/shared/utilities/getRedirectRoute.ts b/src/shared/utilities/getRedirectRoute.ts
index 65c643db..8113326c 100644
--- a/src/shared/utilities/getRedirectRoute.ts
+++ b/src/shared/utilities/getRedirectRoute.ts
@@ -1,6 +1,8 @@
import { DRAFT_SURVEY_SESSION_STORAGE } from 'shared/constants/app';
export const getRedirectRoute = () => {
+ if (typeof window === 'undefined') return '/';
+
const draftSurvey = sessionStorage.getItem(DRAFT_SURVEY_SESSION_STORAGE);
if (draftSurvey) {
return '/survey/create';