From 1c3928e59c51fe399b48a07f85da42d1d75633e7 Mon Sep 17 00:00:00 2001 From: Marcel Gerber Date: Wed, 7 Aug 2024 18:05:20 +0100 Subject: [PATCH] feat(admin): add test page for color schemes --- adminSiteClient/TestIndexPage.tsx | 10 +++ adminSiteServer/testPageRouter.tsx | 108 +++++++++++++++++++++++++++++ 2 files changed, 118 insertions(+) diff --git a/adminSiteClient/TestIndexPage.tsx b/adminSiteClient/TestIndexPage.tsx index f8a2ccf4864..69753bd433d 100644 --- a/adminSiteClient/TestIndexPage.tsx +++ b/adminSiteClient/TestIndexPage.tsx @@ -171,6 +171,16 @@ export class TestIndexPage extends React.Component { Embed Variants + +
  • + + Color Schemes + +

    • Test Explorer Embeds

    diff --git a/adminSiteServer/testPageRouter.tsx b/adminSiteServer/testPageRouter.tsx index 5163d3cf385..55b1c17edcf 100644 --- a/adminSiteServer/testPageRouter.tsx +++ b/adminSiteServer/testPageRouter.tsx @@ -5,6 +5,7 @@ import React from "react" import { renderToHtmlPage, expectInt } from "../serverUtils/serverUtil.js" import { + getChartConfigById, getChartConfigBySlug, getChartVariableData, } from "../db/model/Chart.js" @@ -25,6 +26,7 @@ import { grapherToSVG } from "../baker/GrapherImageBaker.js" import { ChartTypeName, ChartsTableName, + ColorSchemeName, DbRawChart, EntitySelectionMode, GrapherTabOption, @@ -35,6 +37,11 @@ import { ExplorerAdminServer } from "../explorerAdminServer/ExplorerAdminServer. import { GIT_CMS_DIR } from "../gitCms/GitCmsConstants.js" import { ExplorerChartCreationMode } from "../explorer/ExplorerConstants.js" import { getPlainRouteWithROTransaction } from "./plainRouterHelpers.js" +import { + ColorScheme, + ColorSchemes, + GrapherProgrammaticInterface, +} from "@ourworldindata/grapher" const IS_LIVE = ADMIN_BASE_URL === "https://owid.cloud" const DEFAULT_COMPARISON_URL = "https://ourworldindata.org" @@ -108,6 +115,7 @@ interface EmbedTestPageQueryParams { readonly datasetIds?: string readonly namespace?: string readonly namespaces?: string + readonly allColorSchemes?: string } interface ExplorerTestPageQueryParams { @@ -635,6 +643,88 @@ function EmbedVariantsTestPage( ) } +function ColorSchemesTestPage(props: { + slug: string + tab: GrapherTabOption | undefined +}) { + const style = ` + html, body { + height: 100%; + margin: 0; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + } + + figure, iframe { + border: 0; + flex: 1; + height: 550px; + margin: 10px; + } + + .row { + padding: 10px; + margin: 0; + border-bottom: 1px solid #ddd; + } + + .side-by-side { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + } + + h3 { + margin: 0; + } + ` + return ( + + + + Test Color schemes +