diff --git a/front_end/src/app/(main)/questions/[id]/components/forecast_maker/resolution/resolution_modal.tsx b/front_end/src/app/(main)/questions/[id]/components/forecast_maker/resolution/resolution_modal.tsx index 4fa52d9843..5f00db1620 100644 --- a/front_end/src/app/(main)/questions/[id]/components/forecast_maker/resolution/resolution_modal.tsx +++ b/front_end/src/app/(main)/questions/[id]/components/forecast_maker/resolution/resolution_modal.tsx @@ -152,7 +152,9 @@ const QuestionResolutionModal: FC = ({ isOpen, onClose, question }) => { buttons={unambiguousOptions} onChange={(value) => { setValue("unambiguousType", value); - value !== "knownValue" && setValue("resolutionValue", value); + value !== "knownValue" + ? setValue("resolutionValue", value) + : setValue("resolutionValue", undefined); }} variant="tertiary" /> diff --git a/front_end/src/app/(main)/questions/components/group_form.tsx b/front_end/src/app/(main)/questions/components/group_form.tsx index f9e0e26370..2fc18ffe08 100644 --- a/front_end/src/app/(main)/questions/components/group_form.tsx +++ b/front_end/src/app/(main)/questions/components/group_form.tsx @@ -156,7 +156,9 @@ const GroupForm: React.FC = ({ }; } else if (subtype === QuestionType.Date) { if (x.scaling.range_max === null || x.scaling.range_min === null) { - setError("Please enter a max or min value for numeric questions"); + setError( + "Please enter a range_max and range_min value for date questions" + ); break_out = true; return; } @@ -460,7 +462,7 @@ const GroupForm: React.FC = ({ {collapsedSubQuestions[index] && (
-
+
= ({ hasForecasts={ subquestionHasForecasts && mode !== "create" } + chartWidth={720} onChange={({ min: range_min, max: range_max, diff --git a/front_end/src/app/(main)/questions/components/numeric_question_input.tsx b/front_end/src/app/(main)/questions/components/numeric_question_input.tsx index 27874fdc6a..abf3da6b25 100644 --- a/front_end/src/app/(main)/questions/components/numeric_question_input.tsx +++ b/front_end/src/app/(main)/questions/components/numeric_question_input.tsx @@ -4,6 +4,7 @@ import dynamic from "next/dynamic"; import { useEffect, useRef, useState } from "react"; import Checkbox from "@/components/ui/checkbox"; +import DatetimeUtc from "@/components/ui/datetime_utc"; import { Input } from "@/components/ui/form_field"; import { QuestionWithNumericForecasts } from "@/types/question"; import { QuestionType } from "@/types/question"; @@ -36,6 +37,7 @@ const NumericQuestionInput: React.FC<{ defaultOpenLowerBound: boolean | undefined | null; defaultZeroPoint: number | undefined | null; hasForecasts: boolean; + chartWidth?: number; }> = ({ onChange, questionType, @@ -45,6 +47,7 @@ const NumericQuestionInput: React.FC<{ defaultOpenLowerBound, defaultZeroPoint, hasForecasts, + chartWidth = 800, }) => { const [errors, setError] = useState([]); const [max, setMax] = useState(defaultMax); @@ -134,6 +137,9 @@ const NumericQuestionInput: React.FC<{ } } if (min !== undefined && max !== undefined) { + if (isNaN(min) || isNaN(max)) { + current_errors.push("Provide correct min and max values"); + } if (min >= max) { current_errors.push("Minimum value should be less than maximum value"); } @@ -229,35 +235,33 @@ const NumericQuestionInput: React.FC<{
Min - { - setMin(new Date(e.target.value).getTime() / 1000); + onChange={(dateString) => { + setMin(new Date(dateString).getTime() / 1000); }} />
Max - { - setMax(new Date(e.target.value).getTime() / 1000); + onChange={(dateString) => { + setMax(new Date(dateString).getTime() / 1000); }} />
@@ -310,8 +314,7 @@ const NumericQuestionInput: React.FC<{ }} checked={zeroPoint !== null && zeroPoint !== undefined} /> - {zeroPoint !== null && - zeroPoint !== undefined && + {!isNil(zeroPoint) && (questionType == QuestionType.Numeric ? (
Zero Point @@ -328,17 +331,16 @@ const NumericQuestionInput: React.FC<{ ) : (
Zero Point - { - setZeroPoint(new Date(e.target.value).getTime() / 1000); + className="w-full rounded border border-gray-500 px-3 py-2 text-base dark:border-gray-500-dark dark:bg-blue-50-dark" + defaultValue={new Date( + !Number.isNaN(zeroPoint) ? zeroPoint * 1000 : 0 + ).toISOString()} + onChange={(dateString) => { + setZeroPoint(new Date(dateString).getTime() / 1000); }} - defaultValue={format( - new Date(!Number.isNaN(zeroPoint) ? zeroPoint * 1000 : 0), - "yyyy-MM-dd'T'HH:mm" - )} />
))} @@ -412,7 +414,7 @@ const NumericQuestionInput: React.FC<{ question={question} readOnly={false} height={100} - width={800} + width={chartWidth} showCP={false} /> diff --git a/front_end/src/components/ui/datetime_utc.tsx b/front_end/src/components/ui/datetime_utc.tsx index 5b6eef001e..1eea04d565 100644 --- a/front_end/src/components/ui/datetime_utc.tsx +++ b/front_end/src/components/ui/datetime_utc.tsx @@ -1,16 +1,11 @@ import { format, formatISO, parseISO } from "date-fns"; -import React, { - ChangeEvent, - InputHTMLAttributes, - useEffect, - useState, -} from "react"; +import { isNil } from "lodash"; +import React, { ChangeEvent, useEffect, useState } from "react"; -import { Input } from "@/components/ui/form_field"; +import { Input, InputProps } from "@/components/ui/form_field"; import { logError } from "@/utils/errors"; -interface DatetimeUtcProps - extends Omit, "onChange"> { +interface DatetimeUtcProps extends Omit { defaultValue?: string; onChange?: (value: string) => void; onError?: (error: any) => void; @@ -29,9 +24,11 @@ const DatetimeUtc: React.FC = ({ const [localValue, setLocalValue] = useState(""); useEffect(() => { - if (defaultValue) { + if (!isNil(defaultValue)) { // Convert stored UTC value to local time for rendering const localDate = parseISO(defaultValue); + if (isNaN(localDate.getTime())) return; + const localDateString = format(localDate, "yyyy-MM-dd'T'HH:mm"); setLocalValue(localDateString); } @@ -43,12 +40,12 @@ const DatetimeUtc: React.FC = ({ try { // Convert local time to UTC for storage - const localDate = new Date(localDateString); - const utcDateString = formatISO(localDate, { - representation: "complete", - }); - if (onChange) { + const localDate = new Date(localDateString); + const utcDateString = formatISO(localDate, { + representation: "complete", + }); + onChange(utcDateString); } } catch (e) {