Skip to content

Commit

Permalink
Fix/Change question order on init
Browse files Browse the repository at this point in the history
  • Loading branch information
realswikarrr authored Jan 7, 2024
1 parent 7ada0cb commit d87d170
Showing 1 changed file with 62 additions and 49 deletions.
111 changes: 62 additions & 49 deletions src/pages/survey/create/[[...surveyId]].tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import { useApplicationContext } from 'features/application/context';
import { InferGetServerSidePropsType, NextPageContext } from 'next';
import { getSurveyData } from 'pages/api/answer/[id]';
import { getSession } from 'next-auth/react';
import { useEffect, useState } from 'react';

export async function getServerSideProps(context: NextPageContext) {
const surveyId = context.query.surveyId?.[0];
Expand Down Expand Up @@ -65,6 +66,14 @@ function SurveyCreatePage({
}: InferGetServerSidePropsType<typeof getServerSideProps>) {
const { user } = useApplicationContext();

const [isBrowser, setIsBrowser] = useState(false);

useEffect(() => {
if (typeof window !== 'undefined') {
setIsBrowser(true);
}
}, []);

const {
title,
error,
Expand Down Expand Up @@ -149,55 +158,59 @@ function SurveyCreatePage({
</div>
)}
<DragDropContext onDragEnd={onDragEnd}>
<Droppable droppableId="droppable">
{(provided, snapshot) => (
<div
{...provided.droppableProps}
ref={provided.innerRef}
className={clsx(snapshot.isDraggingOver && '')}
>
{questions.map((question, index) => (
<Draggable
key={question.id}
draggableId={question.id}
index={index}
>
{(provided, snapshot) => (
<div
className={clsx('mb-3', snapshot.isDragging && '')}
ref={provided.innerRef}
{...provided.draggableProps}
style={provided.draggableProps.style}
>
<QuestionBlockFactory
key={question.id}
type={question.type}
dragHandleProps={provided.dragHandleProps}
handleAddingNewOption={handleAddingNewOption}
options={question.options ?? []}
handleOptionChange={handleOptionChange}
handleOptionRemove={handleOptionRemove}
questionIndex={index}
onQuestionRemove={removeQuestion}
updateQuestion={updateQuestion}
questionTitle={question.title}
isSubmitted={isSubmitted}
isRemovingPossible={questions.length > MIN_QUESTIONS}
isDraggingPossible={questions.length > 1}
isRequired={question.isRequired}
updateQuestionRequired={updateQuestionRequired}
expanded={question.expanded}
expandQuestion={expandQuestion}
isEditMode={isEditMode}
/>
</div>
)}
</Draggable>
))}
{provided.placeholder}
</div>
)}
</Droppable>
{isBrowser ? (
<Droppable droppableId="droppable">
{(provided, snapshot) => (
<div
{...provided.droppableProps}
ref={provided.innerRef}
className={clsx(snapshot.isDraggingOver && '')}
>
{questions.map((question, index) => (
<Draggable
key={question.id}
draggableId={question.id}
index={index}
>
{(provided, snapshot) => (
<div
className={clsx('mb-3', snapshot.isDragging && '')}
ref={provided.innerRef}
{...provided.draggableProps}
style={provided.draggableProps.style}
>
<QuestionBlockFactory
key={question.id}
type={question.type}
dragHandleProps={provided.dragHandleProps}
handleAddingNewOption={handleAddingNewOption}
options={question.options ?? []}
handleOptionChange={handleOptionChange}
handleOptionRemove={handleOptionRemove}
questionIndex={index}
onQuestionRemove={removeQuestion}
updateQuestion={updateQuestion}
questionTitle={question.title}
isSubmitted={isSubmitted}
isRemovingPossible={
questions.length > MIN_QUESTIONS
}
isDraggingPossible={questions.length > 1}
isRequired={question.isRequired}
updateQuestionRequired={updateQuestionRequired}
expanded={question.expanded}
expandQuestion={expandQuestion}
isEditMode={isEditMode}
/>
</div>
)}
</Draggable>
))}
{provided.placeholder}
</div>
)}
</Droppable>
) : null}
</DragDropContext>
</div>

Expand Down

1 comment on commit d87d170

@vercel
Copy link

@vercel vercel bot commented on d87d170 Jan 9, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

formslab – ./

formslab-ryczko.vercel.app
formslab-git-main-ryczko.vercel.app
formslab.vercel.app

Please sign in to comment.