Forceast view

thewca · Jan 17, 2025 · c54dfe2 · c54dfe2
1 parent bac7352
commit c54dfe2
Show file tree

Hide file tree

Showing 9 changed files with 204 additions and 17 deletions.
diff --git a/client/src/components/ResultStat/ResultStat.jsx b/client/src/components/ResultStat/ResultStat.jsx
@@ -7,7 +7,7 @@ import {
 } from "../../lib/attempt-result";
 import { shouldComputeAverage } from "../../lib/result";
 
-function ResultStat({ result, field, eventId, format }) {
+function ResultStat({ result, field, eventId, format, forecastView }) {
   if (
     field === "average" &&
     result.average === 0 &&
@@ -18,6 +18,18 @@ function ResultStat({ result, field, eventId, format }) {
     if (format.numberOfAttempts === 5 && result.attempts.length === 4) {
       return (
         <Box component="span" sx={{ opacity: 0.5 }}>
+          {forecastView &&
+            (<>
+              <Tooltip title="Projected average">
+                <span>
+                  {formatAttemptResult(
+                    result.projectedAverage,
+                    eventId
+                  )}
+                </span>
+              </Tooltip>
+              {" ("}
+            </>)}
           <Tooltip title="Best possible average">
             <span>
               {formatAttemptResult(
@@ -35,6 +47,22 @@ function ResultStat({ result, field, eventId, format }) {
               )}
             </span>
           </Tooltip>
+          {forecastView && (<>{")"}</>)}
+        </Box>
+      );
+    }
+
+    if (forecastView) {
+      return (
+        <Box component="span" sx={{ opacity: 0.5 }}>
+          <Tooltip title="Projected average">
+            <span>
+              {formatAttemptResult(
+                result.projectedAverage,
+                eventId
+              )}
+            </span>
+          </Tooltip>
         </Box>
       );
     }

diff --git a/client/src/components/ResultsProjector/ResultsProjector.jsx b/client/src/components/ResultsProjector/ResultsProjector.jsx
@@ -20,8 +20,9 @@ import { alpha } from "@mui/material/styles";
 import CloseIcon from "@mui/icons-material/Close";
 import FlagIcon from "../FlagIcon/FlagIcon";
 import { times } from "../../lib/utils";
-import { formatAttemptResult } from "../../lib/attempt-result";
+import { formatAttemptResult, getExpandedResults } from "../../lib/attempt-result";
 import { orderedResultStats, paddedAttemptResults } from "../../lib/result";
+import { forecastViewDisabled } from "../Round/Round";
 import RecordTagBadge from "../RecordTagBadge/RecordTagBadge";
 import ResultStat from "../ResultStat/ResultStat";
 
@@ -72,13 +73,15 @@ function getNumberOfRows() {
   return Math.floor((window.innerHeight - 64 - 56) / 67);
 }
 
-function ResultsProjector({ results, format, eventId, title, exitUrl }) {
+function ResultsProjector({ results, format, eventId, title, exitUrl, forecastView, advancementCondition }) {
   const [status, setStatus] = useState(STATUS.SHOWING);
   const [topResultIndex, setTopResultIndex] = useState(0);
 
+  if (forecastViewDisabled(format, eventId)) {
+    forecastView = false;
+  }
   const stats = orderedResultStats(eventId, format);
-
-  const nonemptyResults = results.filter(
+  const nonemptyResults = getExpandedResults(results, format, forecastView, advancementCondition).filter(
     (result) => result.attempts.length > 0
   );
 
@@ -237,6 +240,7 @@ function ResultsProjector({ results, format, eventId, title, exitUrl }) {
                             field={field}
                             eventId={eventId}
                             format={format}
+                            forecastView={forecastView}
                           />
                         </RecordTagBadge>
                       </TableCell>

diff --git a/client/src/components/Round/Round.jsx b/client/src/components/Round/Round.jsx
@@ -50,6 +50,10 @@ const ROUND_QUERY = gql`
         numberOfAttempts
         sortBy
       }
+      advancementCondition {
+        level
+        type
+      }
       results {
         id
         ...roundResult
@@ -72,6 +76,12 @@ const ROUND_UPDATED_SUBSCRIPTION = gql`
   ${ROUND_RESULT_FRAGMENT}
 `;
 
+// Events sorted by best don't need forecast view.
+// Fewest moves is currently unsupported
+export function forecastViewDisabled(format, eventId) {
+  return format.sortBy === "best" || eventId === "333fm";
+}
+
 function Round() {
   const { competitionId, roundId } = useParams();
 
@@ -85,6 +95,7 @@ function Round() {
   });
 
   const [previousData, setPreviousData] = useState(null);
+  const [forecastView, setForecastView] = useState(false);
 
   useEffect(() => {
     if (newData) setPreviousData(newData);
@@ -110,12 +121,13 @@ function Round() {
   if (error) return <Error error={error} />;
   const { round } = data;
 
+
   return (
     <>
       {loading && <Loading />}
       <Grid container direction="column" spacing={1}>
         <Grid item>
-          <RoundToolbar round={round} competitionId={competitionId} />
+          <RoundToolbar round={round} competitionId={competitionId} forecastView={forecastView} setForecastView={setForecastView} />
         </Grid>
         <Grid item>
           <Routes>
@@ -128,6 +140,8 @@ function Round() {
                   eventId={round.competitionEvent.event.id}
                   title={`${round.competitionEvent.event.name} - ${round.name}`}
                   exitUrl={`/competitions/${competitionId}/rounds/${roundId}`}
+                  forecastView={forecastView}
+                  advancementCondition={round.advancementCondition}
                 />
               }
             />
@@ -141,6 +155,8 @@ function Round() {
                   format={round.format}
                   eventId={round.competitionEvent.event.id}
                   competitionId={competitionId}
+                  forecastView={forecastView}
+                  advancementCondition={round.advancementCondition}
                 />
               }
             />

diff --git a/client/src/components/Round/RoundToolbar.jsx b/client/src/components/Round/RoundToolbar.jsx
@@ -8,9 +8,11 @@ import {
 } from "@mui/material";
 import TvIcon from "@mui/icons-material/Tv";
 import PrintIcon from "@mui/icons-material/Print";
+import ForecastIcon from "@mui/icons-material/ViewList";
 import { appUrl } from "../../lib/urls";
+import { forecastViewDisabled } from "./Round";
 
-function RoundToolbar({ round, competitionId }) {
+function RoundToolbar({ round, competitionId, forecastView, setForecastView }) {
   const mdScreen = useMediaQuery((theme) => theme.breakpoints.up("md"));
 
   return (
@@ -23,6 +25,16 @@ function RoundToolbar({ round, competitionId }) {
       <Grid item style={{ flexGrow: 1 }} />
       {mdScreen && (
         <Grid item>
+          {!forecastViewDisabled(round.format, round.competitionEvent.event.id) &&
+            (<Tooltip title="Forecast view" placement="top">
+              <IconButton
+                component="a"
+                target="_blank"
+                onClick={() => setForecastView(!forecastView)}
+              >
+                <ForecastIcon />
+              </IconButton>
+            </Tooltip>)}
           <Tooltip title="PDF" placement="top">
             <IconButton
               component="a"

diff --git a/client/src/components/RoundResults/RoundResults.jsx b/client/src/components/RoundResults/RoundResults.jsx
@@ -5,7 +5,7 @@ import RoundResultDialog from "./RoundResultDialog";
 
 const DEFAULT_VISIBLE_RESULTS = 100;
 
-function RoundResults({ results, format, eventId, competitionId }) {
+function RoundResults({ results, format, eventId, competitionId, forecastView, advancementCondition}) {
   const smScreen = useMediaQuery((theme) => theme.breakpoints.up("sm"));
 
   const [selectedResult, setSelectedResult] = useState(null);
@@ -35,6 +35,8 @@ function RoundResults({ results, format, eventId, competitionId }) {
             eventId={eventId}
             competitionId={competitionId}
             onResultClick={handleResultClick}
+            forecastView={forecastView}
+            advancementCondition={advancementCondition}
           />
         </Grid>
         {!showAll && (

diff --git a/client/src/components/RoundResults/RoundResultsTable.jsx b/client/src/components/RoundResults/RoundResultsTable.jsx
@@ -13,10 +13,11 @@ import {
 import { green } from "@mui/material/colors";
 import { alpha } from "@mui/material/styles";
 import { times } from "../../lib/utils";
-import { formatAttemptResult } from "../../lib/attempt-result";
+import { formatAttemptResult, getExpandedResults } from "../../lib/attempt-result";
 import { orderedResultStats, paddedAttemptResults } from "../../lib/result";
 import RecordTagBadge from "../RecordTagBadge/RecordTagBadge";
 import ResultStat from "../ResultStat/ResultStat";
+import { forecastViewDisabled } from "../Round/Round";
 
 const styles = {
   cell: {
@@ -47,12 +48,16 @@ const styles = {
 };
 
 const RoundResultsTable = memo(
-  ({ results, format, eventId, competitionId, onResultClick }) => {
+  ({ results, format, eventId, competitionId, onResultClick, forecastView, advancementCondition }) => {
     const smScreen = useMediaQuery((theme) => theme.breakpoints.up("sm"));
     const mdScreen = useMediaQuery((theme) => theme.breakpoints.up("md"));
 
+    if (forecastViewDisabled(format, eventId)) {
+      forecastView = false;
+    }
     const stats = orderedResultStats(eventId, format);
 
+    const expandedResults = getExpandedResults(results, format, forecastView, advancementCondition);
     return (
       <Paper>
         <Table size="small">
@@ -80,7 +85,7 @@ const RoundResultsTable = memo(
             </TableRow>
           </TableHead>
           <TableBody>
-            {results.map((result) => (
+            {expandedResults.map((result) => (
               <TableRow
                 key={result.id}
                 hover
@@ -144,6 +149,7 @@ const RoundResultsTable = memo(
                         field={field}
                         eventId={eventId}
                         format={format}
+                        forecastView={forecastView}
                       />
                     </RecordTagBadge>
                   </TableCell>

diff --git a/client/src/components/admin/AdminRound/AdminResultsTable.jsx b/client/src/components/admin/AdminRound/AdminResultsTable.jsx
@@ -167,6 +167,7 @@ const AdminResultsTable = memo(
                       field={field}
                       eventId={eventId}
                       format={format}
+                      forecastView={false}
                     />
                   </RecordTagBadge>
                 </TableCell>