-
- {!hideLabel && (
-
- {question.status === QuestionStatus.CLOSED
- ? t("closed")
- : t("communityPredictionLabel")}
-
- )}
- {isEmbedBelow376 && (
-
- {t("currentEstimate")}
-
- )}
- {!hideCP && (
-
- )}
+
+ {t("currentEstimate")}
+
+
+ );
+ }
+
+ // CP reveals in the future — center the countdown, skip the mini chart
+ if (forecastAvailability.cpRevealsOn) {
+ return (
+
+
+
+ );
+ }
+
+ // CP hidden by user preference — center the reveal button, skip the mini chart
+ if (hideCP && !isEmbed) {
+ if (size === "md") {
+ return (
+
+
- {!!continuousAreaChartData && (
+ );
+ }
+ return (
+
+
+
+ );
+ }
+
+ return (
+
+
+ {!hideLabel && (
-
+ {question.status === QuestionStatus.CLOSED
+ ? t("closed")
+ : t("communityPredictionLabel")}
)}
- {!hideCP && (
-
span]:whitespace-normal",
- {
- "-mt-2 text-center": size === "md" && hideLabel,
- "text-center": size === "md" && !hideLabel,
- "mt-0 md:[&>span]:whitespace-nowrap": isEmbed,
- }
- )}
- size={"sm"}
- unit={size === "md" ? "" : undefined}
- boldValueUnit={true}
+ {isEmbedBelow376 && (
+
+ {t("currentEstimate")}
+
+ )}
+ {!hideCP && !forecastAvailability.cpRevealsOn && (
+
)}
- )
+ {!!continuousAreaChartData && !forecastAvailability.cpRevealsOn && (
+
+
+
+ )}
+ {!hideCP && !forecastAvailability.cpRevealsOn && (
+
span]:whitespace-normal",
+ {
+ "-mt-2 text-center": size === "md" && hideLabel,
+ "text-center": size === "md" && !hideLabel,
+ "mt-0 md:[&>span]:whitespace-nowrap": isEmbed,
+ }
+ )}
+ size={"sm"}
+ unit={size === "md" ? "" : undefined}
+ boldValueUnit={true}
+ />
+ )}
+
);
} else if (question.type === QuestionType.Binary) {
+ if (hideCP && !isEmbed) {
+ return (
+
+
+
+ );
+ }
+
+ if (forecastAvailability.cpRevealsOn && !isEmbed) {
+ return (
+
+
+
+ );
+ }
+
return (
= ({
domainPadding={v.domainPadding(variantArgs)}
padding={chartPadding}
containerComponent={
- withTooltip ? (
+ withTooltip && !hideCP && !forecastAvailability?.cpRevealsOn ? (
containerWithTooltip
) : (
= ({
},
]}
containerComponent={
- onCursorChange ? (
+ onCursorChange &&
+ !hideCP &&
+ !forecastAvailability?.cpRevealsOn ? (
CursorContainer
) : (
= ({
},
]}
containerComponent={
- onCursorChange ? (
+ onCursorChange &&
+ !hideCP &&
+ !forecastAvailability?.cpRevealsOn ? (
CursorContainer
) : (
= ({
axis: {
stroke: "transparent",
},
- grid: isEmptyDomain
- ? {
- stroke: getThemeColor(METAC_COLORS.gray["300"]),
- strokeWidth: 1,
- strokeDasharray: "2, 5",
- }
- : {
- stroke: "transparent",
- },
+ grid:
+ isEmptyDomain || hideCP
+ ? {
+ stroke: getThemeColor(METAC_COLORS.gray["300"]),
+ strokeWidth: 1,
+ strokeDasharray: "2, 5",
+ }
+ : {
+ stroke: "transparent",
+ },
}}
label={yLabel}
offsetX={
diff --git a/front_end/src/components/charts/numeric_chart.tsx b/front_end/src/components/charts/numeric_chart.tsx
index c494e5c0e1..c987d37ca2 100644
--- a/front_end/src/components/charts/numeric_chart.tsx
+++ b/front_end/src/components/charts/numeric_chart.tsx
@@ -102,6 +102,7 @@ type Props = {
showNewsAnnotations?: boolean;
onToggleNewsAnnotations?: () => void;
animate?: object;
+ suppressEmptyOverlay?: boolean;
};
const BOTTOM_PADDING = 20;
@@ -139,6 +140,7 @@ const NumericChart: FC = ({
showNewsAnnotations,
onToggleNewsAnnotations,
animate,
+ suppressEmptyOverlay = false,
}) => {
const { theme, getThemeColor } = useAppTheme();
const [isChartReady, setIsChartReady] = useState(false);
@@ -229,7 +231,12 @@ const NumericChart: FC = ({
}, [rightPadding, MIN_RIGHT_PADDING]);
const containerComponent = useMemo(() => {
- if (nonInteractive) {
+ if (
+ nonInteractive ||
+ forecastAvailability?.isEmpty ||
+ hideCP ||
+ !!forecastAvailability?.cpRevealsOn
+ ) {
return (
= ({
handleCursorChange,
nonInteractive,
isCursorActive,
+ forecastAvailability,
+ hideCP,
+ isContinuousConsumerView,
]);
const chartEvents = useMemo(() => {
@@ -594,7 +604,12 @@ const NumericChart: FC = ({
onTouchEnd={handleTouchEnd}
>
void;
hideCursorValueLabel?: boolean;
+ suppressEmptyOverlay?: boolean;
};
const NumericTimeline: FC = ({
@@ -100,6 +101,7 @@ const NumericTimeline: FC = ({
showNewsAnnotations,
onToggleNewsAnnotations,
hideCursorValueLabel,
+ suppressEmptyOverlay,
}) => {
const locale = useLocale();
const resolutionPoint = useMemo(() => {
@@ -238,6 +240,7 @@ const NumericTimeline: FC = ({
showNewsAnnotations={showNewsAnnotations}
onToggleNewsAnnotations={onToggleNewsAnnotations}
hideCursorValueLabel={hideCursorValueLabel}
+ suppressEmptyOverlay={suppressEmptyOverlay}
/>
);
};
diff --git a/front_end/src/components/consumer_post_card/binary_cp_bar.tsx b/front_end/src/components/consumer_post_card/binary_cp_bar.tsx
index 4a84ea67d7..2633c6a840 100644
--- a/front_end/src/components/consumer_post_card/binary_cp_bar.tsx
+++ b/front_end/src/components/consumer_post_card/binary_cp_bar.tsx
@@ -33,7 +33,7 @@ const BinaryCPBar: FC = ({
question.aggregations[question.default_aggregation_method]?.latest
?.centers?.[0];
- if (question.type !== QuestionType.Binary || !questionCP) {
+ if (question.type !== QuestionType.Binary) {
return null;
}
diff --git a/front_end/src/components/detailed_question_card/detailed_group_card/index.tsx b/front_end/src/components/detailed_question_card/detailed_group_card/index.tsx
index 9be6aed4b5..d64adce9f1 100644
--- a/front_end/src/components/detailed_question_card/detailed_group_card/index.tsx
+++ b/front_end/src/components/detailed_question_card/detailed_group_card/index.tsx
@@ -5,7 +5,6 @@ import { VictoryThemeDefinition } from "victory";
import { useIsEmbedMode } from "@/app/(embed)/questions/components/question_view_mode_context";
import GroupTimeline from "@/app/(main)/questions/[id]/components/group_timeline";
-import RevealCPButton from "@/app/(main)/questions/[id]/components/reveal_cp_button";
import FanChart from "@/components/charts/fan_chart";
import { MultipleChoiceTile } from "@/components/post_card/multiple_choice_tile";
import {
@@ -147,68 +146,59 @@ const DetailedGroupCard: FC = ({
);
return (
- <>
-
- {hideCP && }
-
- );
- }
-
- return (
- <>
-
- {hideCP && }
-
+ );
+ }
+
+ return (
+
);
}
case GroupOfQuestionsGraphType.FanGraph:
return (
- <>
-
- {hideCP && }
-
+
);
default:
return null;
diff --git a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
index 0b836a2d81..f61c086fa3 100644
--- a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
+++ b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
@@ -14,7 +14,6 @@ import { VictoryThemeDefinition } from "victory";
import { useIsEmbedMode } from "@/app/(embed)/questions/components/question_view_mode_context";
import QuestionHeaderCPStatus from "@/app/(main)/questions/[id]/components/question_view/forecaster_question_view/question_header/question_header_cp_status";
-import RevealCPButton from "@/app/(main)/questions/[id]/components/reveal_cp_button";
import NumericTimeline from "@/components/charts/numeric_timeline";
import QuestionPredictionTooltip from "@/components/charts/primitives/question_prediction_tooltip";
import ContinuousPredictionChart from "@/components/forecast_maker/continuous_input/continuous_prediction_chart";
@@ -161,10 +160,6 @@ const DetailedContinuousChartCard: FC = ({
const discreteValueOptions = getDiscreteValueOptions(question);
const cpCursorElement = useMemo(() => {
- if (forecastAvailability?.isEmpty) {
- return t("noForecastsYet");
- }
-
if (hideCP) {
return "...";
}
@@ -328,7 +323,8 @@ const DetailedContinuousChartCard: FC = ({
hideCursorValueLabel={isContinuousConsumer && !isEmbed}
title={timelineTitle}
forecastAvailability={forecastAvailability}
- cursorTooltip={cursorTooltip}
+ suppressEmptyOverlay
+ cursorTooltip={forecastAvailability?.isEmpty ? undefined : cursorTooltip}
isConsumerView={isContinuousConsumer}
isEmbedded={isEmbed}
height={chartHeight}
@@ -409,9 +405,7 @@ const DetailedContinuousChartCard: FC = ({
className="flex w-full flex-col justify-center"
style={{ height: chartHeight }}
>
- {hideCP || isCpHidden ? (
-
- ) : (
+ {!hideCP && !isCpHidden && (
= ({
embedChartType={embedChartType}
keyFactors={keyFactors}
/>
- {hideCP && }
);
case QuestionType.MultipleChoice:
@@ -102,7 +100,6 @@ const DetailedQuestionCard: FC = ({
chartTheme={chartTheme}
defaultZoom={defaultZoom}
/>
- {hideCP && }
);
default:
From 7771a5f8184e77bacadcbfec19e26aedf643a91d Mon Sep 17 00:00:00 2001
From: Nikita
Date: Tue, 12 May 2026 12:54:10 +0300
Subject: [PATCH 4/6] feat: enable live cursor sync on continuous questions for
forecaster view
---
.../continuous_chart_card.tsx | 13 ++++++-------
1 file changed, 6 insertions(+), 7 deletions(-)
diff --git a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
index f61c086fa3..0017b5d807 100644
--- a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
+++ b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
@@ -94,17 +94,18 @@ const DetailedContinuousChartCard: FC = ({
const [isChartReady, setIsChartReady] = useState(false);
const [activeView, setActiveView] = useState("timeline");
+ const isContinuous = isContinuousQuestion(question);
const [shouldFetchFull, setShouldFetchFull] = useState(false);
const { data: enrichedAggregation = null } = useFullAggregation(
question.id,
question.default_aggregation_method,
question.include_bots_in_aggregates,
- isContinuousConsumer && shouldFetchFull
+ isContinuous && shouldFetchFull
);
const handlePointerEnter = useCallback(() => {
- if (isContinuousConsumer) setShouldFetchFull(true);
- }, [isContinuousConsumer]);
+ if (isContinuous) setShouldFetchFull(true);
+ }, [isContinuous]);
const aggregation =
question.aggregations[question.default_aggregation_method];
@@ -446,7 +447,7 @@ const DetailedContinuousChartCard: FC = ({
"flex w-full flex-col",
isChartReady ? "opacity-100" : "opacity-0"
)}
- onPointerEnter={isContinuousConsumer ? handlePointerEnter : undefined}
+ onPointerEnter={isContinuous ? handlePointerEnter : undefined}
>
{isContinuousQuestion(question) && !isEmbed ? (
<>
@@ -457,9 +458,7 @@ const DetailedContinuousChartCard: FC = ({
question={question}
size="lg"
hideLabel={true}
- cursorForecast={
- isContinuousConsumer ? activeForecast : undefined
- }
+ cursorForecast={activeForecast}
/>
)}
From d97ed5f77efb1617ab9567e451302dc112d384d7 Mon Sep 17 00:00:00 2001
From: Nikita
Date: Tue, 12 May 2026 12:54:15 +0300
Subject: [PATCH 5/6] feat: bridge timeline cursor to forecaster mobile CP
status chip
---
.../[id]/components/question_page_shell/index.tsx | 12 +++++++-----
.../components/question_page_shell/title_row.tsx | 4 ++++
2 files changed, 11 insertions(+), 5 deletions(-)
diff --git a/front_end/src/app/(main)/questions/[id]/components/question_page_shell/index.tsx b/front_end/src/app/(main)/questions/[id]/components/question_page_shell/index.tsx
index 87a2cd1977..7df8d1f510 100644
--- a/front_end/src/app/(main)/questions/[id]/components/question_page_shell/index.tsx
+++ b/front_end/src/app/(main)/questions/[id]/components/question_page_shell/index.tsx
@@ -328,11 +328,13 @@ const QuestionPageShell: FC = ({
}
forecaster={
-
+
+
+
}
/>
diff --git a/front_end/src/app/(main)/questions/[id]/components/question_page_shell/title_row.tsx b/front_end/src/app/(main)/questions/[id]/components/question_page_shell/title_row.tsx
index 0433151a5d..f60629117a 100644
--- a/front_end/src/app/(main)/questions/[id]/components/question_page_shell/title_row.tsx
+++ b/front_end/src/app/(main)/questions/[id]/components/question_page_shell/title_row.tsx
@@ -6,6 +6,7 @@ import QuestionHeaderCPStatus from "@/app/(main)/questions/[id]/components/quest
import QuestionTitle from "@/app/(main)/questions/[id]/components/question_view/shared/question_title";
import RevealCPButton from "@/app/(main)/questions/[id]/components/reveal_cp_button";
import ConditionalTile from "@/components/conditional_tile";
+import { useContinuousChartCursor } from "@/contexts/continuous_chart_cursor_context";
import { useHideCP } from "@/contexts/cp_context";
import { PostWithForecasts } from "@/types/post";
import { QuestionType, QuestionWithForecasts } from "@/types/question";
@@ -27,6 +28,8 @@ type Props = {
const TitleRow: FC = ({ post, variant, className }) => {
const { hideCP } = useHideCP();
+ const cursorCtx = useContinuousChartCursor();
+ const cursorForecast = cursorCtx?.activeForecast ?? null;
if (isConditionalPost(post)) {
return (
@@ -65,6 +68,7 @@ const TitleRow: FC = ({ post, variant, className }) => {
question={post.question as QuestionWithForecasts}
size="md"
hideLabel={isContinuous}
+ cursorForecast={isContinuous ? cursorForecast : undefined}
/>
)}
From df30316ab7a66f982401adcb4c7449d613b007d8 Mon Sep 17 00:00:00 2001
From: Nikita
Date: Tue, 12 May 2026 12:54:19 +0300
Subject: [PATCH 6/6] fix: hide cursor tooltip for continuous questions in
forecaster view
---
.../detailed_question_card/continuous_chart_card.tsx | 6 +++++-
1 file changed, 5 insertions(+), 1 deletion(-)
diff --git a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
index 0017b5d807..5fec30471e 100644
--- a/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
+++ b/front_end/src/components/detailed_question_card/detailed_question_card/continuous_chart_card.tsx
@@ -325,7 +325,11 @@ const DetailedContinuousChartCard: FC = ({
title={timelineTitle}
forecastAvailability={forecastAvailability}
suppressEmptyOverlay
- cursorTooltip={forecastAvailability?.isEmpty ? undefined : cursorTooltip}
+ cursorTooltip={
+ forecastAvailability?.isEmpty || isContinuous
+ ? undefined
+ : cursorTooltip
+ }
isConsumerView={isContinuousConsumer}
isEmbedded={isEmbed}
height={chartHeight}