fix: more dashboards fixing & ts changes

src/backend/platforms/index.ts

@@ -124,3 +124,29 @@ export const processPlatform = async (platform: Platform) => {
     console.log(`Platform ${platform.name} didn't return any results`);
   }
 };
+
+export interface PlatformConfig {
+  name: string;
+  label: string;
+  color: string;
+}
+
+// get frontend-safe version of platforms data
+export const getPlatformsConfig = (options: {
+  withGuesstimate: boolean;
+}): PlatformConfig[] => {
+  const platformsConfig = platforms.map((platform) => ({
+    name: platform.name,
+    label: platform.label,
+    color: platform.color,
+  }));
+  if (options.withGuesstimate) {
+    platformsConfig.push({
+      name: "guesstimate",
+      label: "Guesstimate",
+      color: "223900",
+    });
+  }
+
+  return platformsConfig;
+};

src/pages/dashboards.tsx

@@ -5,6 +5,7 @@ import { useRouter } from "next/router"; // https://nextjs.org/docs/api-referenc
 import { useState } from "react";
 
 import { DashboardItem } from "../backend/dashboards";
+import { getPlatformsConfig, PlatformConfig } from "../backend/platforms";
 import { DashboardCreator } from "../web/display/dashboardCreator";
 import displayForecasts from "../web/display/displayForecasts";
 import Layout from "../web/display/layout";
@@ -15,39 +16,45 @@ interface Props {
   initialDashboardForecasts: FrontendForecast[];
   initialDashboardId?: string;
   initialDashboardItem?: DashboardItem;
+  platformsConfig: PlatformConfig[];
 }
 
 export const getServerSideProps: GetServerSideProps<Props> = async (
   context
 ) => {
-  console.log("getServerSideProps: ");
+  const dashboardIdQ = context.query.dashboardId;
-  let urlQuery = context.query;
+  const dashboardId: string | undefined =
+    typeof dashboardIdQ === "object" ? dashboardIdQ[0] : dashboardIdQ;
 
-  console.log(urlQuery);
+  const platformsConfig = getPlatformsConfig({ withGuesstimate: false });
-  let dashboardId = urlQuery.dashboardId;
-  let props;
 
-  if (!!dashboardId) {
+  if (!dashboardId) {
-    let { dashboardForecasts, dashboardItem } =
+    return {
-      await getDashboardForecastsByDashboardId({
+      props: {
-        dashboardId,
+        platformsConfig,
-      });
+        initialDashboardForecasts: [],
-    dashboardForecasts = addLabelsToForecasts(dashboardForecasts);
+        initialDashboardId: undefined,
-
+        initialDashboardItem: undefined,
-    props = {
+      },
-      initialDashboardForecasts: dashboardForecasts,
-      initialDashboardId: urlQuery.dashboardId,
-      initialDashboardItem: dashboardItem,
-    };
-  } else {
-    props = {
-      initialDashboardForecasts: [],
-      initialDashboardId: urlQuery.dashboardId || undefined,
-      initialDashboardItem: undefined,
     };
   }
+
+  const { dashboardForecasts, dashboardItem } =
+    await getDashboardForecastsByDashboardId({
+      dashboardId,
+    });
+  const frontendDashboardForecasts = addLabelsToForecasts(
+    dashboardForecasts,
+    platformsConfig
+  );
+
   return {
-    props,
+    props: {
+      initialDashboardForecasts: frontendDashboardForecasts,
+      initialDashboardId: dashboardId,
+      initialDashboardItem: dashboardItem,
+      platformsConfig,
+    },
   };
 };
 
@@ -55,6 +62,7 @@ export const getServerSideProps: GetServerSideProps<Props> = async (
 const DashboardsPage: NextPage<Props> = ({
   initialDashboardForecasts,
   initialDashboardItem,
+  platformsConfig,
 }) => {
   const router = useRouter();
   const [dashboardForecasts, setDashboardForecasts] = useState(
@@ -92,8 +100,9 @@ const DashboardsPage: NextPage<Props> = ({
         await getDashboardForecastsByDashboardId({
           dashboardId,
         });
-      console.log("response2", dashboardForecasts);
+      setDashboardForecasts(
-      setDashboardForecasts(dashboardForecasts);
+        addLabelsToForecasts(dashboardForecasts, platformsConfig)
+      );
       setDashboardItem(dashboardItem);
     }
   };

src/pages/secretDashboard.tsx

@@ -4,6 +4,7 @@
 import { useRouter } from "next/router"; // https://nextjs.org/docs/api-reference/next/router
 import { useState } from "react";
 
+import { getPlatformsConfig } from "../backend/platforms";
 import displayForecasts from "../web/display/displayForecasts";
 import { addLabelsToForecasts } from "../web/platforms";
 import { getDashboardForecastsByDashboardId } from "../web/worker/getDashboardForecasts";
@@ -12,10 +13,9 @@ import { getDashboardForecastsByDashboardId } from "../web/worker/getDashboardFo
 
 export async function getServerSideProps(context) {
   console.log("getServerSideProps: ");
-  let urlQuery = context.query; // this is an object, not a string which I have to parse!!
+  let urlQuery = context.query;
-  // so for instance if the url is metaforecasts.org/dashboards?a=b&c=d
-  // this returns ({a: "b", c: "d"}})
   console.log(urlQuery);
+
   let dashboardId = urlQuery.dashboardId;
   let numCols = urlQuery.numCols;
   let props;
@@ -25,7 +25,10 @@ export async function getServerSideProps(context) {
       await getDashboardForecastsByDashboardId({
         dashboardId,
       });
-    dashboardForecasts = addLabelsToForecasts(dashboardForecasts);
+    dashboardForecasts = addLabelsToForecasts(
+      dashboardForecasts,
+      getPlatformsConfig({ withGuesstimate: false })
+    );
     props = {
       initialDashboardForecasts: dashboardForecasts,
       initialDashboardId: urlQuery.dashboardId,

src/web/display/multiSelectPlatforms.tsx

@@ -2,7 +2,7 @@ import chroma from "chroma-js";
 import React from "react";
 import Select from "react-select";
 
-import { PlatformConfig } from "../platforms";
+import { PlatformConfig } from "../../backend/platforms";
 
 const colourStyles = {
   control: (styles) => ({ ...styles, backgroundColor: "white" }),

src/web/platforms.ts

@@ -1,21 +1,17 @@
-import { Forecast, platforms } from "../backend/platforms";
+import { Forecast, PlatformConfig } from "../backend/platforms";
-
-export interface PlatformConfig {
-  name: string;
-  label: string;
-  color: string;
-}
 
 export type FrontendForecast = Forecast & {
   platformLabel: string;
   visualization?: any;
 };
 
+// ok on client side
 export const addLabelsToForecasts = (
-  forecasts: Forecast[]
+  forecasts: Forecast[],
+  platformsConfig: PlatformConfig[]
 ): FrontendForecast[] => {
   const platformNameToLabel = Object.fromEntries(
-    platforms.map((platform) => [platform.name, platform.label])
+    platformsConfig.map((platform) => [platform.name, platform.label])
   );
 
   return forecasts.map((result) => ({

src/web/search/anySearchPage.tsx

@@ -1,8 +1,8 @@
 import { GetServerSideProps } from "next";
 
 import { getFrontpage } from "../../backend/frontpage";
-import { platforms } from "../../backend/platforms";
+import { getPlatformsConfig, PlatformConfig, platforms } from "../../backend/platforms";
-import { addLabelsToForecasts, FrontendForecast, PlatformConfig } from "../platforms";
+import { addLabelsToForecasts, FrontendForecast } from "../platforms";
 import searchAccordingToQueryData from "../worker/searchAccordingToQueryData";
 
 /* Common code for / and /capture */
@@ -29,16 +29,7 @@ export const getServerSideProps: GetServerSideProps<Props> = async (
 ) => {
   const urlQuery = context.query;
 
-  const platformsConfig = platforms.map((platform) => ({
+  const platformsConfig = getPlatformsConfig({ withGuesstimate: true });
-    name: platform.name,
-    label: platform.label,
-    color: platform.color,
-  }));
-  platformsConfig.push({
-    name: "guesstimate",
-    label: "Guesstimate",
-    color: "223900",
-  });
 
   const defaultQueryParameters: QueryParameters = {
     query: "",
@@ -74,7 +65,10 @@ export const getServerSideProps: GetServerSideProps<Props> = async (
   const defaultNumDisplay = 21;
   const initialNumDisplay = Number(urlQuery.numDisplay) || defaultNumDisplay;
 
-  const defaultResults = addLabelsToForecasts(await getFrontpage());
+  const defaultResults = addLabelsToForecasts(
+    await getFrontpage(),
+    platformsConfig
+  );
 
   const initialResults =
     !!initialQueryParameters &&

src/web/worker/getDashboardForecasts.ts

@@ -7,7 +7,7 @@ export async function getDashboardForecastsByDashboardId({
   dashboardId,
 }): Promise<{
   dashboardForecasts: Forecast[];
-  dashboardItem: DashboardItem | string;
+  dashboardItem: DashboardItem;
 }> {
   console.log("getDashboardForecastsByDashboardId: ");
   let dashboardContents: Forecast[] = [];