From 5127f0b0801d3e6e736f8ebdd58a58f81f135cc9 Mon Sep 17 00:00:00 2001 From: sjschlapbach Date: Tue, 29 Oct 2024 16:02:22 +0100 Subject: [PATCH 1/6] fix: migrate numerical question evaluation on asynchronous activities to new histogram --- apps/frontend-manage/package.json | 4 - .../courses/IndividualLeaderboard.tsx | 2 +- .../components/evaluation/ElementChart.tsx | 21 +++-- .../hooks/useEvaluationHistogramData.tsx | 32 ++++--- packages/shared-components/dist/utilities.css | 34 ++++++++ packages/shared-components/package.json | 4 + .../shared-components/src}/DataTable.tsx | 6 +- .../src}/charts/ElementBarChart.tsx | 12 ++- .../src}/charts/ElementHistogram.tsx | 86 +++++++++++++------ .../src}/charts/ElementTableChart.tsx | 10 +-- .../src}/charts/ElementWordcloud.tsx | 8 +- .../src/evaluation/NREvaluation.tsx | 44 ++++------ pnpm-lock.yaml | 24 +++--- 13 files changed, 181 insertions(+), 106 deletions(-) rename {apps/frontend-manage/src/components/common => packages/shared-components/src}/DataTable.tsx (98%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/charts/ElementBarChart.tsx (92%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/charts/ElementHistogram.tsx (77%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/charts/ElementTableChart.tsx (82%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/charts/ElementWordcloud.tsx (92%) diff --git a/apps/frontend-manage/package.json b/apps/frontend-manage/package.json index 62d0891f19..2255442bf2 100644 --- a/apps/frontend-manage/package.json +++ b/apps/frontend-manage/package.json @@ -19,7 +19,6 @@ "@klicker-uzh/prisma": "workspace:*", "@klicker-uzh/shared-components": "workspace:*", "@socialgouv/matomo-next": "1.9.1", - "@tanstack/react-table": "8.20.5", "@uzh-bf/design-system": "3.0.0-alpha.32", "d3": "7.9.0", "dayjs": "1.11.13", @@ -39,7 +38,6 @@ "next-intl": "3.21.1", "nookies": "2.5.2", "react": "18.3.1", - "react-csv-downloader": "3.1.1", "react-d3-speedometer": "2.2.1", "react-dnd": "16.0.1", "react-dnd-html5-backend": "16.0.1", @@ -49,7 +47,6 @@ "react-resizable-panels": "2.1.4", "react-select": "5.8.1", "react-sizeme": "3.0.2", - "react-tagcloud": "2.3.3", "recharts": "2.13.0", "remark-slate": "1.8.6", "remeda": "2.15.0", @@ -73,7 +70,6 @@ "@types/node": "^20.16.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", - "@types/react-tagcloud": "^2.3.2", "autoprefixer": "~10.4.20", "cross-env": "~7.0.3", "cssnano": "~6.0.1", diff --git a/apps/frontend-manage/src/components/courses/IndividualLeaderboard.tsx b/apps/frontend-manage/src/components/courses/IndividualLeaderboard.tsx index 420576bb66..576f50c398 100644 --- a/apps/frontend-manage/src/components/courses/IndividualLeaderboard.tsx +++ b/apps/frontend-manage/src/components/courses/IndividualLeaderboard.tsx @@ -1,5 +1,5 @@ -import DataTable from '@components/common/DataTable' import { LeaderboardEntry } from '@klicker-uzh/graphql/dist/ops' +import DataTable from '@klicker-uzh/shared-components/src/DataTable' import { Tabs } from '@uzh-bf/design-system' import { TableCell } from '@uzh-bf/design-system/dist/future' import { useTranslations } from 'next-intl' diff --git a/apps/frontend-manage/src/components/evaluation/ElementChart.tsx b/apps/frontend-manage/src/components/evaluation/ElementChart.tsx index adf5467817..c32b98d6ff 100644 --- a/apps/frontend-manage/src/components/evaluation/ElementChart.tsx +++ b/apps/frontend-manage/src/components/evaluation/ElementChart.tsx @@ -1,12 +1,12 @@ import { ElementInstanceEvaluation } from '@klicker-uzh/graphql/dist/ops' +import ElementBarChart from '@klicker-uzh/shared-components/src/charts/ElementBarChart' +import ElementHistogram from '@klicker-uzh/shared-components/src/charts/ElementHistogram' +import ElementTableChart from '@klicker-uzh/shared-components/src/charts/ElementTableChart' +import ElementWordcloud from '@klicker-uzh/shared-components/src/charts/ElementWordcloud' import { ChartType } from '@klicker-uzh/shared-components/src/constants' import { useTranslations } from 'next-intl' import React from 'react' import { TextSizeType } from '../sessions/evaluation/constants' -import ElementBarChart from './charts/ElementBarChart' -import ElementHistogram from './charts/ElementHistogram' -import ElementTableChart from './charts/ElementTableChart' -import ElementWordcloud from './charts/ElementWordcloud' interface ElementChartProps { chartType: string @@ -35,9 +35,20 @@ function ElementChart({ chartType === ChartType.HISTOGRAM && instanceEvaluation.__typename === 'NumericalElementInstanceEvaluation' ) { + const responses = instanceEvaluation.results.responseValues.map( + (response) => ({ + value: response.value, + count: response.count, + }) + ) + return ( diff --git a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx b/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx index 18c450044c..643169b3c8 100644 --- a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx +++ b/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx @@ -1,36 +1,34 @@ -import { - ElementType, - NumericalElementInstanceEvaluation, -} from '@klicker-uzh/graphql/dist/ops' +import { ElementType } from '@klicker-uzh/graphql/dist/ops' import { maxBy, minBy, round, sumBy } from 'lodash' import { useMemo } from 'react' interface UseEvaluationHistogramDataProps { - instance: NumericalElementInstanceEvaluation + type: ElementType + responses: { value: number; count: number }[] + minValue?: number | null + maxValue?: number | null binCount: number } function useEvaluationHistogramData({ - instance, + type, + responses, + minValue, + maxValue, binCount, }: UseEvaluationHistogramDataProps) { const histogramData = useMemo(() => { - if (instance.type !== ElementType.Numerical) { + if (type !== ElementType.Numerical) { return null } - const responses = instance.results.responseValues.map((response) => ({ - value: response.value, - count: response.count, - })) - const min: number = - instance.results.minValue && typeof instance.results.minValue === 'number' - ? instance.results.minValue + minValue !== null && typeof minValue === 'number' + ? minValue : (minBy(responses, 'value')?.value ?? 0) - 10 const max: number = - instance.results.maxValue && typeof instance.results.maxValue === 'number' - ? instance.results.maxValue + maxValue !== null && typeof maxValue === 'number' + ? maxValue : (maxBy(responses, 'value')?.value ?? 0) + 10 let dataArray = Array.from({ length: binCount }, (_, i) => ({ @@ -61,7 +59,7 @@ function useEvaluationHistogramData({ }) return { data: dataArray, domain: { min: min, max: max } } - }, [instance, binCount]) + }, [type, responses, minValue, maxValue, binCount]) return histogramData } diff --git a/packages/shared-components/dist/utilities.css b/packages/shared-components/dist/utilities.css index d636af77b8..0a757bccfa 100644 --- a/packages/shared-components/dist/utilities.css +++ b/packages/shared-components/dist/utilities.css @@ -120,6 +120,10 @@ display: flex } +.\!table { + display: table !important +} + .table { display: table } @@ -136,6 +140,10 @@ height: 2.5rem } +.h-24 { + height: 6rem +} + .h-3 { height: 0.75rem } @@ -144,6 +152,10 @@ height: 10rem } +.h-7 { + height: 1.75rem +} + .h-8 { height: 2rem } @@ -168,6 +180,10 @@ height: calc(100% - 4rem) } +.h-full { + height: 100% +} + .min-h-\[2\.5rem\] { min-height: 2.5rem } @@ -328,6 +344,10 @@ align-self: stretch } +.overflow-y-auto { + overflow-y: auto +} + .rounded { border-radius: 0.25rem } @@ -621,6 +641,10 @@ padding-bottom: 2.5rem } +.pb-2 { + padding-bottom: 0.5rem +} + .pt-2 { padding-top: 0.5rem } @@ -764,6 +788,16 @@ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } +.shadow-sm { + --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); + --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) +} + +.outline { + outline-style: solid +} + .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) } diff --git a/packages/shared-components/package.json b/packages/shared-components/package.json index e427a30596..f358056833 100644 --- a/packages/shared-components/package.json +++ b/packages/shared-components/package.json @@ -10,16 +10,20 @@ "@tailwindcss/aspect-ratio": "~0.4.2", "@tailwindcss/forms": "~0.5.9", "@tailwindcss/typography": "~0.5.15", + "@tanstack/react-table": "~8.20.5", "@types/js-cookie": "^3.0.6", "@types/lodash": "^4.17.10", "@types/node": "^20.16.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", + "@types/react-tagcloud": "^2.3.2", "autoprefixer": "~10.4.20", "eslint": "~8.45.0", "lodash": "~4.17.21", "npm-run-all": "~4.1.5", "postcss-import": "~16.1.0", + "react-csv-downloader": "~3.1.1", + "react-tagcloud": "~2.3.3", "recharts": "~2.13.0", "remark-parse": "~10.0.2", "remark-slate": "~1.8.6", diff --git a/apps/frontend-manage/src/components/common/DataTable.tsx b/packages/shared-components/src/DataTable.tsx similarity index 98% rename from apps/frontend-manage/src/components/common/DataTable.tsx rename to packages/shared-components/src/DataTable.tsx index 58059661fa..e549dc70fd 100644 --- a/apps/frontend-manage/src/components/common/DataTable.tsx +++ b/packages/shared-components/src/DataTable.tsx @@ -1,8 +1,8 @@ import { faDownload, faRepeat } from '@fortawesome/free-solid-svg-icons' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { - ColumnDef, - SortingState, + type ColumnDef, + type SortingState, flexRender, getCoreRowModel, getPaginationRowModel, @@ -21,7 +21,7 @@ import { } from '@uzh-bf/design-system/dist/future' import dayjs from 'dayjs' import { useTranslations } from 'next-intl' -import { useMemo, useState } from 'react' +import React, { useMemo, useState } from 'react' import CsvDownloader from 'react-csv-downloader' import { twMerge } from 'tailwind-merge' diff --git a/apps/frontend-manage/src/components/evaluation/charts/ElementBarChart.tsx b/packages/shared-components/src/charts/ElementBarChart.tsx similarity index 92% rename from apps/frontend-manage/src/components/evaluation/charts/ElementBarChart.tsx rename to packages/shared-components/src/charts/ElementBarChart.tsx index ece5f260cc..9c39a5935b 100644 --- a/apps/frontend-manage/src/components/evaluation/charts/ElementBarChart.tsx +++ b/packages/shared-components/src/charts/ElementBarChart.tsx @@ -1,5 +1,5 @@ import { - ElementInstanceEvaluation, + type ElementInstanceEvaluation, ElementType, } from '@klicker-uzh/graphql/dist/ops' import { @@ -8,6 +8,7 @@ import { } from '@klicker-uzh/shared-components/src/constants' import { UserNotification } from '@uzh-bf/design-system' import { useTranslations } from 'next-intl' +import React from 'react' import { Bar, BarChart as BarChartRecharts, @@ -18,13 +19,16 @@ import { XAxis, YAxis, } from 'recharts' -import useEvaluationBarChartData from '../hooks/useEvaluationBarChartData' -import { TextSizeType } from '../textSizes' +import useEvaluationBarChartData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationBarChartData' interface ElementBarChartProps { instance: ElementInstanceEvaluation showSolution: boolean - textSize: TextSizeType + textSize: { + legend: string + textXl: string + text3Xl: string + } } function ElementBarChart({ diff --git a/apps/frontend-manage/src/components/evaluation/charts/ElementHistogram.tsx b/packages/shared-components/src/charts/ElementHistogram.tsx similarity index 77% rename from apps/frontend-manage/src/components/evaluation/charts/ElementHistogram.tsx rename to packages/shared-components/src/charts/ElementHistogram.tsx index 1b81ba0ec7..876dd835a6 100644 --- a/apps/frontend-manage/src/components/evaluation/charts/ElementHistogram.tsx +++ b/packages/shared-components/src/charts/ElementHistogram.tsx @@ -1,26 +1,28 @@ -import { - ElementType, - NumericalElementInstanceEvaluation, -} from '@klicker-uzh/graphql/dist/ops' +import { ElementType } from '@klicker-uzh/graphql/dist/ops' import { CHART_SOLUTION_COLORS } from '@klicker-uzh/shared-components/src/constants' import { NumberField, UserNotification } from '@uzh-bf/design-system' import { useTranslations } from 'next-intl' -import { useState } from 'react' +import React, { useState } from 'react' import { Bar, BarChart, CartesianGrid, ReferenceArea, + ReferenceLine, ResponsiveContainer, Tooltip, XAxis, YAxis, } from 'recharts' import { twMerge } from 'tailwind-merge' -import useEvaluationHistogramData from '../hooks/useEvaluationHistogramData' +import useEvaluationHistogramData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData' interface ElementHistogramProps { - instance: NumericalElementInstanceEvaluation + type: ElementType + responses: { value: number; count: number }[] + solutionRanges?: { min?: number | null; max?: number | null }[] + minValue?: number | null + maxValue?: number | null showSolution: { general: boolean mean?: boolean @@ -30,13 +32,23 @@ interface ElementHistogramProps { sd?: boolean } textSize: string - className?: string + reference?: number + hideBins?: boolean + basic?: boolean + className?: { root?: string } } function ElementHistogram({ - instance, + type, + responses, + solutionRanges, + minValue, + maxValue, showSolution, textSize, + reference, + hideBins = false, + basic = false, className, }: ElementHistogramProps) { const t = useTranslations() @@ -44,11 +56,14 @@ function ElementHistogram({ const [numBins, setNumBins] = useState('20') const processedData = useEvaluationHistogramData({ - instance, + type, + responses, + minValue, + maxValue, binCount: parseInt(numBins), }) - if (!supportedElementTypes.includes(instance.type) || !processedData) { + if (!supportedElementTypes.includes(type) || !processedData) { return ( {t('manage.evaluation.chartTypeNotSupported')} @@ -57,7 +72,7 @@ function ElementHistogram({ } return ( -
+
+ {reference && ( + + )} {/* // TODO: reintroduce these elements as soon as statistics are available for asynchronous elements */} {/* {data.statistics && showSolution.mean && ( @@ -187,8 +211,8 @@ function ElementHistogram({ )} */} {showSolution.general && - instance.results.solutionRanges && - instance.results.solutionRanges.map( + solutionRanges && + solutionRanges.map( ( solutionRange: { min?: number | null; max?: number | null }, index: number @@ -201,11 +225,15 @@ function ElementHistogram({ fill={CHART_SOLUTION_COLORS.correct} enableBackground="#FFFFFF" opacity={1} - label={{ - fill: CHART_SOLUTION_COLORS.correct, - position: 'top', - value: 'Korrekt', - }} + label={ + !basic + ? { + fill: CHART_SOLUTION_COLORS.correct, + position: 'top', + value: 'Korrekt', + } + : undefined + } className={textSize} /> ) @@ -213,15 +241,17 @@ function ElementHistogram({ -
- setNumBins(value)} - /> -
+ {hideBins ? null : ( +
+ setNumBins(value)} + /> +
+ )}
) } diff --git a/apps/frontend-manage/src/components/evaluation/charts/ElementTableChart.tsx b/packages/shared-components/src/charts/ElementTableChart.tsx similarity index 82% rename from apps/frontend-manage/src/components/evaluation/charts/ElementTableChart.tsx rename to packages/shared-components/src/charts/ElementTableChart.tsx index afda055386..4a5e484c0e 100644 --- a/apps/frontend-manage/src/components/evaluation/charts/ElementTableChart.tsx +++ b/packages/shared-components/src/charts/ElementTableChart.tsx @@ -1,14 +1,14 @@ -import DataTable from '@components/common/DataTable' import { - ElementInstanceEvaluation, + type ElementInstanceEvaluation, ElementType, } from '@klicker-uzh/graphql/dist/ops' import { UserNotification } from '@uzh-bf/design-system' import { useTranslations } from 'next-intl' -import { useRef } from 'react' +import React, { useRef } from 'react' import { twMerge } from 'tailwind-merge' -import useEvaluationTableColumns from '../hooks/useEvaluationTableColumns' -import useEvaluationTableData from '../hooks/useEvaluationTableData' +import useEvaluationTableColumns from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableColumns' +import useEvaluationTableData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableData' +import DataTable from '../DataTable' export type EvaluationTableRowType = { count: number diff --git a/apps/frontend-manage/src/components/evaluation/charts/ElementWordcloud.tsx b/packages/shared-components/src/charts/ElementWordcloud.tsx similarity index 92% rename from apps/frontend-manage/src/components/evaluation/charts/ElementWordcloud.tsx rename to packages/shared-components/src/charts/ElementWordcloud.tsx index 07de851f7f..5736ab4232 100644 --- a/apps/frontend-manage/src/components/evaluation/charts/ElementWordcloud.tsx +++ b/packages/shared-components/src/charts/ElementWordcloud.tsx @@ -1,15 +1,19 @@ import { - ElementInstanceEvaluation, + type ElementInstanceEvaluation, ElementType, } from '@klicker-uzh/graphql/dist/ops' import { UserNotification } from '@uzh-bf/design-system' import { useTranslations } from 'next-intl' +import React from 'react' import { TagCloud } from 'react-tagcloud' interface ElementWordcloudProps { instance: ElementInstanceEvaluation showSolution: boolean - textSize: Record + textSize: { + min: number + max: number + } } function ElementWordcloud({ diff --git a/packages/shared-components/src/evaluation/NREvaluation.tsx b/packages/shared-components/src/evaluation/NREvaluation.tsx index a8c1e98f8d..07f2b1d470 100644 --- a/packages/shared-components/src/evaluation/NREvaluation.tsx +++ b/packages/shared-components/src/evaluation/NREvaluation.tsx @@ -1,11 +1,11 @@ -import type { - NumericalInstanceEvaluation, - NumericalQuestionData, - NumericalQuestionOptions, +import { + ElementType, + type NumericalInstanceEvaluation, + type NumericalQuestionOptions, } from '@klicker-uzh/graphql/dist/ops' import { useTranslations } from 'next-intl' import React from 'react' -import Histogram from '../Histogram' +import ElementHistogram from '../charts/ElementHistogram' interface NREvaluationProps { options: NumericalQuestionOptions @@ -16,30 +16,24 @@ interface NREvaluationProps { function NREvaluation({ options, evaluation, reference }: NREvaluationProps) { const t = useTranslations() - const results = Object.entries( - evaluation.answers as Record< - string, - { value: string; count: number; correct: boolean } - > - ).reduce( - (acc, [_, answer]) => ({ - ...acc, - [answer.value]: { value: answer.value, count: answer.count }, - }), - {} - ) + const answers = evaluation.answers as Record< + string, + { value: string; count: number; correct: boolean } + > + const responses = Object.entries(answers).map(([_, answer]) => ({ + value: parseFloat(answer.value), + count: answer.count, + })) return (
{t('pwa.practiceQuiz.othersAnswered')}
- Date: Tue, 29 Oct 2024 16:31:12 +0100 Subject: [PATCH 2/6] chore: move remaining files and add missing imports --- apps/frontend-manage/package.json | 2 ++ apps/frontend-manage/tsconfig.json | 11 +++++++++- .../src/charts/ElementBarChart.tsx | 2 +- .../src/charts/ElementHistogram.tsx | 2 +- .../src/charts/ElementTableChart.tsx | 4 ++-- .../src}/hooks/useEvaluationBarChartData.tsx | 2 +- .../src}/hooks/useEvaluationHistogramData.tsx | 0 .../src}/hooks/useEvaluationTableColumns.tsx | 2 +- .../src}/hooks/useEvaluationTableData.tsx | 4 ++-- pnpm-lock.yaml | 22 ++++++++++++------- 10 files changed, 34 insertions(+), 17 deletions(-) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/hooks/useEvaluationBarChartData.tsx (92%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/hooks/useEvaluationHistogramData.tsx (100%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/hooks/useEvaluationTableColumns.tsx (98%) rename {apps/frontend-manage/src/components/evaluation => packages/shared-components/src}/hooks/useEvaluationTableData.tsx (90%) diff --git a/apps/frontend-manage/package.json b/apps/frontend-manage/package.json index 2255442bf2..d08e9dca0b 100644 --- a/apps/frontend-manage/package.json +++ b/apps/frontend-manage/package.json @@ -70,6 +70,7 @@ "@types/node": "^20.16.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", + "@types/react-tagcloud": "^2.3.2", "autoprefixer": "~10.4.20", "cross-env": "~7.0.3", "cssnano": "~6.0.1", @@ -77,6 +78,7 @@ "eslint-config-next": "~15.0.0", "postcss": "~8.4.47", "postcss-import": "~16.1.0", + "react-tagcloud": "~2.3.3", "swc-loader": "~0.2.6", "tailwindcss": "~3.4.14", "tailwindcss-radix": "~3.0.5", diff --git a/apps/frontend-manage/tsconfig.json b/apps/frontend-manage/tsconfig.json index c0d10d0cf8..42b433edb4 100644 --- a/apps/frontend-manage/tsconfig.json +++ b/apps/frontend-manage/tsconfig.json @@ -22,6 +22,15 @@ "@type/*": ["src/types/*"] } }, - "include": ["next-env.d.ts", "src/types/app.d.ts", "**/*.ts", "**/*.tsx"], + "include": [ + "next-env.d.ts", + "src/types/app.d.ts", + "**/*.ts", + "**/*.tsx", + "../../packages/shared-components/src/hooks/useEvaluationBarChartData.tsx", + "../../packages/shared-components/src/hooks/useEvaluationHistogramData.tsx", + "../../packages/shared-components/src/hooks/useEvaluationTableColumns.tsx", + "../../packages/shared-components/src/hooks/useEvaluationTableData.tsx" + ], "exclude": ["node_modules"] } diff --git a/packages/shared-components/src/charts/ElementBarChart.tsx b/packages/shared-components/src/charts/ElementBarChart.tsx index 9c39a5935b..a8fcf72f93 100644 --- a/packages/shared-components/src/charts/ElementBarChart.tsx +++ b/packages/shared-components/src/charts/ElementBarChart.tsx @@ -19,7 +19,7 @@ import { XAxis, YAxis, } from 'recharts' -import useEvaluationBarChartData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationBarChartData' +import useEvaluationBarChartData from '../hooks/useEvaluationBarChartData' interface ElementBarChartProps { instance: ElementInstanceEvaluation diff --git a/packages/shared-components/src/charts/ElementHistogram.tsx b/packages/shared-components/src/charts/ElementHistogram.tsx index 876dd835a6..8f26d67a17 100644 --- a/packages/shared-components/src/charts/ElementHistogram.tsx +++ b/packages/shared-components/src/charts/ElementHistogram.tsx @@ -15,7 +15,7 @@ import { YAxis, } from 'recharts' import { twMerge } from 'tailwind-merge' -import useEvaluationHistogramData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData' +import useEvaluationHistogramData from '../hooks/useEvaluationHistogramData' interface ElementHistogramProps { type: ElementType diff --git a/packages/shared-components/src/charts/ElementTableChart.tsx b/packages/shared-components/src/charts/ElementTableChart.tsx index 4a5e484c0e..b406725bd3 100644 --- a/packages/shared-components/src/charts/ElementTableChart.tsx +++ b/packages/shared-components/src/charts/ElementTableChart.tsx @@ -6,9 +6,9 @@ import { UserNotification } from '@uzh-bf/design-system' import { useTranslations } from 'next-intl' import React, { useRef } from 'react' import { twMerge } from 'tailwind-merge' -import useEvaluationTableColumns from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableColumns' -import useEvaluationTableData from '../../../../apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableData' import DataTable from '../DataTable' +import useEvaluationTableColumns from '../hooks/useEvaluationTableColumns' +import useEvaluationTableData from '../hooks/useEvaluationTableData' export type EvaluationTableRowType = { count: number diff --git a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationBarChartData.tsx b/packages/shared-components/src/hooks/useEvaluationBarChartData.tsx similarity index 92% rename from apps/frontend-manage/src/components/evaluation/hooks/useEvaluationBarChartData.tsx rename to packages/shared-components/src/hooks/useEvaluationBarChartData.tsx index d76440b69b..28c455ad11 100644 --- a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationBarChartData.tsx +++ b/packages/shared-components/src/hooks/useEvaluationBarChartData.tsx @@ -1,4 +1,4 @@ -import { ElementInstanceEvaluation } from '@klicker-uzh/graphql/dist/ops' +import type { ElementInstanceEvaluation } from '@klicker-uzh/graphql/dist/ops' import { SMALL_BAR_THRESHOLD } from '@klicker-uzh/shared-components/src/constants' import { useMemo } from 'react' diff --git a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx b/packages/shared-components/src/hooks/useEvaluationHistogramData.tsx similarity index 100% rename from apps/frontend-manage/src/components/evaluation/hooks/useEvaluationHistogramData.tsx rename to packages/shared-components/src/hooks/useEvaluationHistogramData.tsx diff --git a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableColumns.tsx b/packages/shared-components/src/hooks/useEvaluationTableColumns.tsx similarity index 98% rename from apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableColumns.tsx rename to packages/shared-components/src/hooks/useEvaluationTableColumns.tsx index d262cd7eb3..95d5a17071 100644 --- a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableColumns.tsx +++ b/packages/shared-components/src/hooks/useEvaluationTableColumns.tsx @@ -9,7 +9,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { Markdown } from '@klicker-uzh/markdown' import { Button } from '@uzh-bf/design-system/dist/future' import { useTranslations } from 'next-intl' -import { useMemo } from 'react' +import React, { useMemo } from 'react' import { twMerge } from 'tailwind-merge' interface UseEvaluationTableColumnsProps { diff --git a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableData.tsx b/packages/shared-components/src/hooks/useEvaluationTableData.tsx similarity index 90% rename from apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableData.tsx rename to packages/shared-components/src/hooks/useEvaluationTableData.tsx index 2746ccb192..4d20bae4a7 100644 --- a/apps/frontend-manage/src/components/evaluation/hooks/useEvaluationTableData.tsx +++ b/packages/shared-components/src/hooks/useEvaluationTableData.tsx @@ -1,5 +1,5 @@ -import { ElementInstanceEvaluation } from '@klicker-uzh/graphql/dist/ops' -import { EvaluationTableRowType } from '../charts/ElementTableChart' +import { type ElementInstanceEvaluation } from '@klicker-uzh/graphql/dist/ops' +import { type EvaluationTableRowType } from '../charts/ElementTableChart' interface UseEvaluationTableColumnsProps { instance: ElementInstanceEvaluation diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a68220542f..a51ed76676 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -456,7 +456,7 @@ importers: version: 3.11.8(@types/react@18.3.11)(graphql-ws@5.16.0(graphql@16.9.0))(graphql@16.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@ducanh2912/next-pwa': specifier: 7.3.3 - version: 7.3.3(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/babel__core@7.20.5)(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(swc-loader@0.2.6(@swc/core@1.3.101(@swc/helpers@0.5.13))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))) + version: 7.3.3(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/babel__core@7.20.5)(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(swc-loader@0.2.6(@swc/core@1.3.101(@swc/helpers@0.5.13))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))) '@fortawesome/fontawesome-svg-core': specifier: 6.6.0 version: 6.6.0 @@ -489,7 +489,7 @@ importers: version: link:../../packages/shared-components '@socialgouv/matomo-next': specifier: 1.9.1 - version: 1.9.1(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) + version: 1.9.1(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) '@uzh-bf/design-system': specifier: 3.0.0-alpha.32 version: 3.0.0-alpha.32(@fortawesome/fontawesome-svg-core@6.6.0)(@fortawesome/free-regular-svg-icons@6.6.0)(@fortawesome/free-solid-svg-icons@6.6.0)(@fortawesome/react-fontawesome@0.2.2(@fortawesome/fontawesome-svg-core@6.6.0)(react@18.3.1))(@types/react-dom@18.3.1)(@types/react@18.3.11)(class-variance-authority@0.7.0)(clsx@2.1.1)(dayjs@1.11.13)(formik@2.4.6(react@18.3.1))(lucide-react@0.424.0(react@18.3.1))(postcss-import@16.1.0(postcss@8.4.47))(postcss@8.4.47)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwind-merge@2.5.4)(tailwindcss-animate@1.0.7(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3))))(tailwindcss-radix@3.0.5(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3))))(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3)))(yup@1.4.0) @@ -528,10 +528,10 @@ importers: version: 1.10.0 next: specifier: 15.0.0 - version: 15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) next-intl: specifier: 3.21.1 - version: 3.21.1(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) + version: 3.21.1(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) nookies: specifier: 2.5.2 version: 2.5.2 @@ -625,7 +625,7 @@ importers: version: 12.25.0 '@ducanh2912/next-pwa': specifier: 7.3.3 - version: 7.3.3(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/babel__core@7.20.5)(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(swc-loader@0.2.6(@swc/core@1.3.101(@swc/helpers@0.5.13))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))) + version: 7.3.3(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/babel__core@7.20.5)(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(swc-loader@0.2.6(@swc/core@1.3.101(@swc/helpers@0.5.13))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))) '@fortawesome/fontawesome-svg-core': specifier: 6.6.0 version: 6.6.0 @@ -661,7 +661,7 @@ importers: version: link:../../packages/shared-components '@socialgouv/matomo-next': specifier: 1.9.1 - version: 1.9.1(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) + version: 1.9.1(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) '@uzh-bf/design-system': specifier: 3.0.0-alpha.32 version: 3.0.0-alpha.32(@fortawesome/fontawesome-svg-core@6.6.0)(@fortawesome/free-regular-svg-icons@6.6.0)(@fortawesome/free-solid-svg-icons@6.6.0)(@fortawesome/react-fontawesome@0.2.2(@fortawesome/fontawesome-svg-core@6.6.0)(react@18.3.1))(@types/react-dom@18.3.1)(@types/react@18.3.11)(class-variance-authority@0.7.0)(clsx@2.1.1)(dayjs@1.11.13)(formik@2.4.6(react@18.3.1))(lucide-react@0.424.0(react@18.3.1))(postcss-import@16.1.0(postcss@8.4.47))(postcss@8.4.47)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwind-merge@2.5.4)(tailwindcss-animate@1.0.7(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3))))(tailwindcss-radix@3.0.5(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3))))(tailwindcss@3.4.14(ts-node@10.9.1(@swc/core@1.3.101(@swc/helpers@0.5.13))(@types/node@20.16.1)(typescript@5.6.3)))(yup@1.4.0) @@ -709,10 +709,10 @@ importers: version: 4.17.21 next: specifier: 15.0.0 - version: 15.0.0(@babel/core@7.25.8)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) next-intl: specifier: 3.21.1 - version: 3.21.1(next@15.0.0(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) + version: 3.21.1(next@15.0.0(@babel/core@7.21.8)(@opentelemetry/api@1.9.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) nookies: specifier: 2.5.2 version: 2.5.2 @@ -810,6 +810,9 @@ importers: '@types/react-dom': specifier: ^18.3.1 version: 18.3.1 + '@types/react-tagcloud': + specifier: ^2.3.2 + version: 2.3.2 autoprefixer: specifier: ~10.4.20 version: 10.4.20(postcss@8.4.47) @@ -831,6 +834,9 @@ importers: postcss-import: specifier: ~16.1.0 version: 16.1.0(postcss@8.4.47) + react-tagcloud: + specifier: ~2.3.3 + version: 2.3.3(react@18.3.1) swc-loader: specifier: ~0.2.6 version: 0.2.6(@swc/core@1.3.101(@swc/helpers@0.5.13))(webpack@5.94.0(@swc/core@1.3.101(@swc/helpers@0.5.13))) From e645f129d0b93524a9931c2bb8615ce720356945 Mon Sep 17 00:00:00 2001 From: sjschlapbach Date: Tue, 29 Oct 2024 16:34:42 +0100 Subject: [PATCH 3/6] chore: udpate tailwind file --- packages/shared-components/dist/utilities.css | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/packages/shared-components/dist/utilities.css b/packages/shared-components/dist/utilities.css index 0a757bccfa..fadbd03996 100644 --- a/packages/shared-components/dist/utilities.css +++ b/packages/shared-components/dist/utilities.css @@ -80,6 +80,10 @@ margin-left: 0.25rem } +.ml-2 { + margin-left: 0.5rem +} + .mr-1\.5 { margin-right: 0.375rem } @@ -184,6 +188,10 @@ height: 100% } +.max-h-32 { + max-height: 8rem +} + .min-h-\[2\.5rem\] { min-height: 2.5rem } @@ -192,6 +200,18 @@ min-height: 6rem } +.w-10 { + width: 2.5rem +} + +.w-14 { + width: 3.5rem +} + +.w-20 { + width: 5rem +} + .w-3 { width: 0.75rem } @@ -637,6 +657,10 @@ padding-bottom: 1rem } +.\!pl-0 { + padding-left: 0px !important +} + .pb-10 { padding-bottom: 2.5rem } @@ -832,6 +856,10 @@ border-color: rgb(254 215 170 / var(--tw-border-opacity)) } + .hover\:bg-transparent:hover { + background-color: transparent + } + .hover\:shadow:hover { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); From 9f6fc37c7b968da4585b5994c41816a606eba495 Mon Sep 17 00:00:00 2001 From: sjschlapbach Date: Tue, 29 Oct 2024 16:45:07 +0100 Subject: [PATCH 4/6] chore: re-add missing questions test cases --- .../cypress/e2e/D-questions-workflow.cy.ts | 698 +++++++++--------- 1 file changed, 349 insertions(+), 349 deletions(-) diff --git a/cypress/cypress/e2e/D-questions-workflow.cy.ts b/cypress/cypress/e2e/D-questions-workflow.cy.ts index 3021d9724c..b34b1165b4 100644 --- a/cypress/cypress/e2e/D-questions-workflow.cy.ts +++ b/cypress/cypress/e2e/D-questions-workflow.cy.ts @@ -39,353 +39,353 @@ describe('Create questions', () => { cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() }) - // it('Create a flashcard element', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A Flashcard ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.SC.typeLabel) - // cy.get('[data-cy="select-question-type"]').click() - // cy.get( - // `[data-cy="select-question-type-${messages.shared.FLASHCARD.typeLabel}"]` - // ).click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.FLASHCARD.typeLabel) - // cy.get('[data-cy="insert-question-title"]').type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.REVIEW.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="insert-question-explanation"]').realClick().type(question) - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.REVIEW.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // }) - - // it('Create a single choice question', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A Single Choice ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // const choice1 = '50%' - // const choice2 = '100%' - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="insert-question-title"]').type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) - // cy.get('[data-cy="insert-question-title"]').click() // remove editor focus - - // cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') - // cy.get('[data-cy="move-answer-option-ix-0-down"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) - - // cy.get('[data-cy="move-answer-option-ix-1-up"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="move-answer-option-ix-1-down"]').should('be.disabled') - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.READY.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // cy.get('[data-cy="sc-1-answer-option-1"]').should('exist') - // cy.get('[data-cy="sc-1-answer-option-2"]').should('exist') - // }) - - // it('Create a multiple choice question', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A Multiple Choice ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // const choice1 = '50%' - // const choice2 = '100%' - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.SC.typeLabel) - // cy.get('[data-cy="select-question-type"]').click() - // cy.get( - // `[data-cy="select-question-type-${messages.shared.MC.typeLabel}"]` - // ).click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.MC.typeLabel) - // cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) - // cy.get('[data-cy="insert-question-title"]').click() // remove editor focus - - // cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') - // cy.get('[data-cy="move-answer-option-ix-0-down"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) - - // cy.get('[data-cy="move-answer-option-ix-1-up"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="move-answer-option-ix-1-down"]').should('be.disabled') - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.READY.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // cy.get('[data-cy="mc-1-answer-option-1"]').should('exist') - // cy.get('[data-cy="mc-1-answer-option-2"]').should('exist') - // }) - - // it('Create a KPRIM question', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A KPRIM ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // const choice1 = '50%' - // const choice2 = '100%' - // const choice3 = '75%' - // const choice4 = '60%' - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.SC.typeLabel) - // cy.get('[data-cy="select-question-type"]').click() - // cy.get( - // `[data-cy="select-question-type-${messages.shared.KPRIM.typeLabel}"]` - // ).click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.KPRIM.typeLabel) - // cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-2"]').realClick().type(choice3) - // cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-3"]').realClick().type(choice4) - // cy.get('[data-cy="insert-answer-field-3"]').findByText(choice4) - // cy.get('[data-cy="insert-question-title"]').click() // remove editor focus - - // cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') - // cy.get('[data-cy="move-answer-option-ix-0-down"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) - // cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) - // cy.get('[data-cy="insert-answer-field-3"]').findByText(choice4) - - // cy.get('[data-cy="move-answer-option-ix-3-up"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="move-answer-option-ix-3-down"]').should('be.disabled') - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) - // cy.get('[data-cy="insert-answer-field-2"]').findByText(choice4) - // cy.get('[data-cy="insert-answer-field-3"]').findByText(choice3) - - // cy.get('[data-cy="move-answer-option-ix-2-up"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice4) - // cy.get('[data-cy="insert-answer-field-2"]').findByText(choice1) - // cy.get('[data-cy="insert-answer-field-3"]').findByText(choice3) - - // cy.get('[data-cy="move-answer-option-ix-2-down"]') - // .should('not.be.disabled') - // .click() - // cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) - // cy.get('[data-cy="insert-answer-field-1"]').findByText(choice4) - // cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) - // cy.get('[data-cy="insert-answer-field-3"]').findByText(choice1) - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.READY.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // cy.get('[data-cy="kp-answer-options"]').should('have.length', 4) - // }) - - // it('Create a Numeric question', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A Numeric ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.SC.typeLabel) - // cy.get('[data-cy="select-question-type"]').click() - // cy.get( - // `[data-cy="select-question-type-${messages.shared.NUMERICAL.typeLabel}"]` - // ).click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.NUMERICAL.typeLabel) - // cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="set-numerical-minimum"]').click().type('0') - // cy.get('[data-cy="set-numerical-maximum"]').click().type('100') - // cy.get('[data-cy="set-numerical-unit"]').click().type('%') - // cy.get('[data-cy="set-numerical-accuracy"]').click().type('0') - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.READY.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // cy.get('[data-cy="input-numerical-minimum"]').contains('Min: 0') - // cy.get('[data-cy="input-numerical-maximum"]').contains('Max: 100') - // cy.get('[data-cy="input-numerical-accuracy"]').contains('Precision: 0') - // cy.get('[data-cy="input-numerical-unit"]').contains('%') - // }) - - // it('Create a Free Text question', () => { - // const randomQuestionNumber = uuid() - // const questionTitle = 'A Free Text ' + randomQuestionNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.SC.typeLabel) - // cy.get('[data-cy="select-question-type"]').click() - // cy.get( - // `[data-cy="select-question-type-${messages.shared.FREE_TEXT.typeLabel}"]` - // ).click() - // cy.get('[data-cy="select-question-type"]') - // .should('exist') - // .contains(messages.shared.FREE_TEXT.typeLabel) - // cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="set-free-text-length"]').click().type('100') - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) - // cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( - // messages.shared.READY.statusLabel - // ) - // cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() - // cy.get('[data-cy="free-text-input-1"]').should('exist') - // }) - - // it('Create a new question, duplicates it and then deletes the duplicate again', () => { - // const randomNumber = uuid() - // const questionTitle = 'A Single Choice ' + randomNumber - // const question = 'Was ist die Wahrscheinlichkeit? ' + randomNumber - - // cy.get('[data-cy="create-question"]').click() - // cy.get('[data-cy="insert-question-title"]').type(questionTitle) - // cy.get('[data-cy="select-question-status"]').click() - // cy.get( - // `[data-cy="select-question-status-${messages.shared.DRAFT.statusLabel}"]` - // ).click() - // cy.get('[data-cy="insert-question-text"]').realClick().type(question) - // cy.get('[data-cy="insert-answer-field-0"]').realClick().type('50%') - // cy.get('[data-cy="add-new-answer"]').click() - // cy.wait(500) - // cy.get('[data-cy="insert-answer-field-1"]').realClick().type('100%') - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // // duplicate question and save - // cy.get(`[data-cy="duplicate-question-${questionTitle}"]`).click() - // cy.wait(500) - // cy.findByText(messages.manage.questionForms.DUPLICATETitle).should('exist') - // cy.get('[data-cy="save-new-question"]').click({ force: true }) - // cy.wait(500) - - // // check if duplicated question exists alongside original question - // cy.get(`[data-cy="question-item-${questionTitle}"]`).should('exist') - // cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).should( - // 'exist' - // ) - // cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).contains( - // messages.shared.DRAFT.statusLabel - // ) - - // // delete the duplicated question - // cy.get(`[data-cy="delete-question-${questionTitle} (Copy)"]`).click() - // cy.get('[data-cy="confirm-question-deletion"]').click() - // cy.get(`[data-cy="question-item-${questionTitle}"]`).should('exist') - // cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).should( - // 'not.exist' - // ) - // }) + it('Create a flashcard element', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A Flashcard ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.SC.typeLabel) + cy.get('[data-cy="select-question-type"]').click() + cy.get( + `[data-cy="select-question-type-${messages.shared.FLASHCARD.typeLabel}"]` + ).click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.FLASHCARD.typeLabel) + cy.get('[data-cy="insert-question-title"]').type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.REVIEW.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="insert-question-explanation"]').realClick().type(question) + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.REVIEW.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + }) + + it('Create a single choice question', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A Single Choice ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + const choice1 = '50%' + const choice2 = '100%' + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="insert-question-title"]').type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) + cy.get('[data-cy="insert-question-title"]').click() // remove editor focus + + cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') + cy.get('[data-cy="move-answer-option-ix-0-down"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) + + cy.get('[data-cy="move-answer-option-ix-1-up"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="move-answer-option-ix-1-down"]').should('be.disabled') + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.READY.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + cy.get('[data-cy="sc-1-answer-option-1"]').should('exist') + cy.get('[data-cy="sc-1-answer-option-2"]').should('exist') + }) + + it('Create a multiple choice question', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A Multiple Choice ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + const choice1 = '50%' + const choice2 = '100%' + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.SC.typeLabel) + cy.get('[data-cy="select-question-type"]').click() + cy.get( + `[data-cy="select-question-type-${messages.shared.MC.typeLabel}"]` + ).click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.MC.typeLabel) + cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) + cy.get('[data-cy="insert-question-title"]').click() // remove editor focus + + cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') + cy.get('[data-cy="move-answer-option-ix-0-down"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) + + cy.get('[data-cy="move-answer-option-ix-1-up"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="move-answer-option-ix-1-down"]').should('be.disabled') + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.READY.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + cy.get('[data-cy="mc-1-answer-option-1"]').should('exist') + cy.get('[data-cy="mc-1-answer-option-2"]').should('exist') + }) + + it('Create a KPRIM question', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A KPRIM ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + const choice1 = '50%' + const choice2 = '100%' + const choice3 = '75%' + const choice4 = '60%' + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.SC.typeLabel) + cy.get('[data-cy="select-question-type"]').click() + cy.get( + `[data-cy="select-question-type-${messages.shared.KPRIM.typeLabel}"]` + ).click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.KPRIM.typeLabel) + cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="insert-answer-field-0"]').realClick().type(choice1) + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice1) + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-1"]').realClick().type(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice2) + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-2"]').realClick().type(choice3) + cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-3"]').realClick().type(choice4) + cy.get('[data-cy="insert-answer-field-3"]').findByText(choice4) + cy.get('[data-cy="insert-question-title"]').click() // remove editor focus + + cy.get('[data-cy="move-answer-option-ix-0-up"]').should('be.disabled') + cy.get('[data-cy="move-answer-option-ix-0-down"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) + cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) + cy.get('[data-cy="insert-answer-field-3"]').findByText(choice4) + + cy.get('[data-cy="move-answer-option-ix-3-up"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="move-answer-option-ix-3-down"]').should('be.disabled') + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice1) + cy.get('[data-cy="insert-answer-field-2"]').findByText(choice4) + cy.get('[data-cy="insert-answer-field-3"]').findByText(choice3) + + cy.get('[data-cy="move-answer-option-ix-2-up"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice4) + cy.get('[data-cy="insert-answer-field-2"]').findByText(choice1) + cy.get('[data-cy="insert-answer-field-3"]').findByText(choice3) + + cy.get('[data-cy="move-answer-option-ix-2-down"]') + .should('not.be.disabled') + .click() + cy.get('[data-cy="insert-answer-field-0"]').findByText(choice2) + cy.get('[data-cy="insert-answer-field-1"]').findByText(choice4) + cy.get('[data-cy="insert-answer-field-2"]').findByText(choice3) + cy.get('[data-cy="insert-answer-field-3"]').findByText(choice1) + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.READY.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + cy.get('[data-cy="kp-answer-options"]').should('have.length', 4) + }) + + it('Create a Numeric question', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A Numeric ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.SC.typeLabel) + cy.get('[data-cy="select-question-type"]').click() + cy.get( + `[data-cy="select-question-type-${messages.shared.NUMERICAL.typeLabel}"]` + ).click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.NUMERICAL.typeLabel) + cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="set-numerical-minimum"]').click().type('0') + cy.get('[data-cy="set-numerical-maximum"]').click().type('100') + cy.get('[data-cy="set-numerical-unit"]').click().type('%') + cy.get('[data-cy="set-numerical-accuracy"]').click().type('0') + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.READY.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + cy.get('[data-cy="input-numerical-minimum"]').contains('Min: 0') + cy.get('[data-cy="input-numerical-maximum"]').contains('Max: 100') + cy.get('[data-cy="input-numerical-accuracy"]').contains('Precision: 0') + cy.get('[data-cy="input-numerical-unit"]').contains('%') + }) + + it('Create a Free Text question', () => { + const randomQuestionNumber = uuid() + const questionTitle = 'A Free Text ' + randomQuestionNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomQuestionNumber + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.SC.typeLabel) + cy.get('[data-cy="select-question-type"]').click() + cy.get( + `[data-cy="select-question-type-${messages.shared.FREE_TEXT.typeLabel}"]` + ).click() + cy.get('[data-cy="select-question-type"]') + .should('exist') + .contains(messages.shared.FREE_TEXT.typeLabel) + cy.get('[data-cy="insert-question-title"]').click().type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.READY.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="set-free-text-length"]').click().type('100') + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(question) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains(questionTitle) + cy.get(`[data-cy="question-item-${questionTitle}"]`).contains( + messages.shared.READY.statusLabel + ) + cy.get(`[data-cy="edit-question-${questionTitle}"]`).click() + cy.get('[data-cy="free-text-input-1"]').should('exist') + }) + + it('Create a new question, duplicates it and then deletes the duplicate again', () => { + const randomNumber = uuid() + const questionTitle = 'A Single Choice ' + randomNumber + const question = 'Was ist die Wahrscheinlichkeit? ' + randomNumber + + cy.get('[data-cy="create-question"]').click() + cy.get('[data-cy="insert-question-title"]').type(questionTitle) + cy.get('[data-cy="select-question-status"]').click() + cy.get( + `[data-cy="select-question-status-${messages.shared.DRAFT.statusLabel}"]` + ).click() + cy.get('[data-cy="insert-question-text"]').realClick().type(question) + cy.get('[data-cy="insert-answer-field-0"]').realClick().type('50%') + cy.get('[data-cy="add-new-answer"]').click() + cy.wait(500) + cy.get('[data-cy="insert-answer-field-1"]').realClick().type('100%') + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + // duplicate question and save + cy.get(`[data-cy="duplicate-question-${questionTitle}"]`).click() + cy.wait(500) + cy.findByText(messages.manage.questionForms.DUPLICATETitle).should('exist') + cy.get('[data-cy="save-new-question"]').click({ force: true }) + cy.wait(500) + + // check if duplicated question exists alongside original question + cy.get(`[data-cy="question-item-${questionTitle}"]`).should('exist') + cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).should( + 'exist' + ) + cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).contains( + messages.shared.DRAFT.statusLabel + ) + + // delete the duplicated question + cy.get(`[data-cy="delete-question-${questionTitle} (Copy)"]`).click() + cy.get('[data-cy="confirm-question-deletion"]').click() + cy.get(`[data-cy="question-item-${questionTitle}"]`).should('exist') + cy.get(`[data-cy="question-item-${questionTitle + ' (Copy)'}"]`).should( + 'not.exist' + ) + }) }) From addb65e139020c1f0ba523346a050ce324128839 Mon Sep 17 00:00:00 2001 From: sjschlapbach Date: Tue, 29 Oct 2024 20:22:49 +0100 Subject: [PATCH 5/6] chore: fix numerical question preview --- .../questions/manipulation/StudentElementPreview.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx b/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx index 7e917ac0e5..dd02ebec1b 100644 --- a/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx +++ b/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx @@ -72,7 +72,9 @@ function StudentElementPreview({ 'restrictions' in values.options && values.options.restrictions && 'min' in values.options.restrictions && - values.options.restrictions.min + typeof values.options.restrictions.min !== + 'undefined' && + values.options.restrictions.min !== null ? parseFloat( String(values.options.restrictions.min) ) @@ -81,7 +83,9 @@ function StudentElementPreview({ 'restrictions' in values.options && values.options.restrictions && 'max' in values.options.restrictions && - values.options.restrictions.max + typeof values.options.restrictions.max !== + 'undefined' && + values.options.restrictions.max !== null ? parseFloat( String(values.options.restrictions.max) ) From 70c9cb98109904b557336e37080227894315ef8e Mon Sep 17 00:00:00 2001 From: sjschlapbach Date: Tue, 29 Oct 2024 21:22:28 +0100 Subject: [PATCH 6/6] fix: ensure that remaining numerical question params are displayed correctly on preview --- .../questions/manipulation/StudentElementPreview.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx b/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx index dd02ebec1b..dec4da2ab6 100644 --- a/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx +++ b/apps/frontend-manage/src/components/questions/manipulation/StudentElementPreview.tsx @@ -60,7 +60,8 @@ function StudentElementPreview({ : undefined, accuracy: 'accuracy' in values.options && - values.options.accuracy + typeof values.options.accuracy !== 'undefined' && + values.options.accuracy !== null ? parseInt(String(values.options.accuracy)) : undefined, unit: @@ -94,7 +95,9 @@ function StudentElementPreview({ 'restrictions' in values.options && values.options.restrictions && 'maxLength' in values.options.restrictions && - values.options.restrictions.maxLength + typeof values.options.restrictions.maxLength !== + 'undefined' && + values.options.restrictions.maxLength !== null ? parseFloat( String(values.options.restrictions.maxLength) )