fix: progress bar (#4589)

This commit is contained in:
Dhruwang Jariwala
2025-01-13 14:22:49 +05:30
committed by GitHub
parent cb1e4fa583
commit 7d94861db9
3 changed files with 17 additions and 11 deletions

View File

@@ -17,20 +17,21 @@ export function ProgressBar({ survey, questionId }: ProgressBarProps) {
const endingCardIds = useMemo(() => survey.endings.map((ending) => ending.id), [survey.endings]);
const calculateProgress = useCallback(
(index: number, questionsLength: number) => {
(index: number) => {
let totalCards = survey.questions.length;
if (endingCardIds.length > 0) totalCards += 1;
let idx = index;
if (questionsLength === 0) return 0;
if (index === -1) idx = 0;
const elementIdx = calculateElementIdx(survey, idx);
return elementIdx / questionsLength;
const elementIdx = calculateElementIdx(survey, idx, totalCards);
return elementIdx / totalCards;
},
[survey]
);
const progressArray = useMemo(() => {
return survey.questions.map((_, index) => calculateProgress(index, survey.questions.length));
return survey.questions.map((_, index) => calculateProgress(index));
}, [calculateProgress, survey]);
const progressValue = useMemo(() => {

View File

@@ -77,7 +77,9 @@ export function WelcomeCard({
variablesData,
}: WelcomeCardProps) {
const calculateTimeToComplete = () => {
let idx = calculateElementIdx(survey, 0);
let totalCards = survey.questions.length;
if (survey.endings.length > 0) totalCards += 1;
let idx = calculateElementIdx(survey, 0, totalCards);
if (idx === 0.5) {
idx = 1;
}

View File

@@ -61,12 +61,15 @@ export const getShuffledChoicesIds = (
return shuffledChoices.map((choice) => choice.id);
};
export const calculateElementIdx = (survey: TJsEnvironmentStateSurvey, currentQustionIdx: number): number => {
export const calculateElementIdx = (
survey: TJsEnvironmentStateSurvey,
currentQustionIdx: number,
totalCards: number
): number => {
const currentQuestion = survey.questions[currentQustionIdx];
const surveyLength = survey.questions.length;
const middleIdx = Math.floor(surveyLength / 2);
const middleIdx = Math.floor(totalCards / 2);
const possibleNextQuestions = getPossibleNextQuestions(currentQuestion);
const endingCardIds = survey.endings.map((ending) => ending.id);
const getLastQuestionIndex = () => {
const lastQuestion = survey.questions
.filter((q) => possibleNextQuestions.includes(q.id))
@@ -79,7 +82,7 @@ export const calculateElementIdx = (survey: TJsEnvironmentStateSurvey, currentQu
const lastprevQuestionIdx = getLastQuestionIndex();
if (lastprevQuestionIdx > 0) elementIdx = Math.min(middleIdx, lastprevQuestionIdx - 1);
if (possibleNextQuestions.includes("end")) elementIdx = middleIdx;
if (possibleNextQuestions.some((id) => endingCardIds.includes(id))) elementIdx = middleIdx;
return elementIdx;
};