diff --git a/packages/app/src/components/severity-indicator-tile/logic/set-trend-icon.tsx b/packages/app/src/components/severity-indicator-tile/logic/set-trend-icon.tsx deleted file mode 100644 index 7ec38cf891..0000000000 --- a/packages/app/src/components/severity-indicator-tile/logic/set-trend-icon.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import { Down, Up } from '@corona-dashboard/icons'; -import { ICON_DIRECTION_DOWN } from '~/domain/topical/common'; - -/** - * Set the correction icon for specific direction that is beign passed. - * */ - -export const setTrendIcon = (direction: string) => { - if (direction === ICON_DIRECTION_DOWN) return ; - return ; -}; diff --git a/packages/app/src/components/severity-indicator-tile/severity-indicator-tile.tsx b/packages/app/src/components/severity-indicator-tile/severity-indicator-tile.tsx index b714d09055..dd0a9dd9ca 100644 --- a/packages/app/src/components/severity-indicator-tile/severity-indicator-tile.tsx +++ b/packages/app/src/components/severity-indicator-tile/severity-indicator-tile.tsx @@ -1,18 +1,14 @@ import { colors } from '@corona-dashboard/common'; import css from '@styled-system/css'; -import styled from 'styled-components'; -import { space } from '~/style/theme'; import { Box } from '~/components/base'; import { Markdown } from '~/components/markdown'; import { InlineText } from '~/components/typography'; -import { TrendIcon, TrendIconColor } from '~/domain/topical/types'; -import { SeverityIndicatorLabel } from './components/severity-indicator-label'; +import { space } from '~/style/theme'; import { SeverityIndicator } from './components/severity-indicator'; +import { SeverityIndicatorLabel } from './components/severity-indicator-label'; import { SEVERITY_INDICATOR_TILE_COLUMN_MIN_WIDTH } from './constants'; import { getSeverityColor } from './logic/get-severity-color'; import { SeverityLevel } from './types'; -import { mapStringToColors } from './logic/map-string-to-colors'; -import { setTrendIcon } from '~/components/severity-indicator-tile/logic/set-trend-icon'; interface SeverityIndicatorTileProps { description: string; @@ -22,13 +18,9 @@ interface SeverityIndicatorTileProps { sourceLabel: string; datesLabel: string; levelDescription: string; - trendIcon: TrendIcon; } -export const SeverityIndicatorTile = ({ description, label, level, title, datesLabel, sourceLabel, levelDescription, trendIcon }: SeverityIndicatorTileProps) => { - const hasIconProps = trendIcon?.direction && trendIcon?.color; - const iconColor = trendIcon?.color?.toUpperCase() as TrendIconColor; - +export const SeverityIndicatorTile = ({ description, label, level, title, datesLabel, sourceLabel, levelDescription }: SeverityIndicatorTileProps) => { return ( {description && } - - {trendIcon?.direction && iconColor && hasIconProps && {setTrendIcon(trendIcon.direction)}} + {levelDescription && } @@ -65,9 +56,3 @@ export const SeverityIndicatorTile = ({ description, label, level, title, datesL ); }; - -const TrendIconWrapper = styled.span` - color: ${({ color }) => color}; - flex-shrink: 0; - width: 20px; -`; diff --git a/packages/app/src/domain/topical/components/topical-theme-header.tsx b/packages/app/src/domain/topical/components/topical-theme-header.tsx index cc38858970..95a57271e8 100644 --- a/packages/app/src/domain/topical/components/topical-theme-header.tsx +++ b/packages/app/src/domain/topical/components/topical-theme-header.tsx @@ -1,33 +1,23 @@ -import { Box } from '~/components/base'; -import styled from 'styled-components'; -import { Heading } from '~/components/typography'; -import { RichContent } from '~/components/cms/rich-content'; import { IconName as TopicalIcon } from '@corona-dashboard/icons/src/icon-name2filename'; +import styled from 'styled-components'; +import { Box } from '~/components/base'; import DynamicIcon from '~/components/get-icon-by-name'; +import { Heading } from '~/components/typography'; import theme from '~/style/theme'; -import { PortableTextEntry } from '@sanity/block-content-to-react'; -import { fontSizes } from '~/style/theme'; interface TopicalThemeHeaderProps { title: string; - subtitle?: PortableTextEntry[] | null; icon: TopicalIcon; } -export const TopicalThemeHeader = ({ title, subtitle, icon }: TopicalThemeHeaderProps) => { +export const TopicalThemeHeader = ({ title, icon }: TopicalThemeHeaderProps) => { return ( - - - - - {title} - - {subtitle && ( - - - - )} + + + + + {title} ); }; diff --git a/packages/app/src/pages/index.tsx b/packages/app/src/pages/index.tsx index 0c5deb9ac8..c62ab6256c 100644 --- a/packages/app/src/pages/index.tsx +++ b/packages/app/src/pages/index.tsx @@ -103,7 +103,7 @@ const Home = (props: StaticProps) => { return ( - + {theme.tiles && ( ({ textNl: siteText.pages.corona_thermometer_page.nl, @@ -131,7 +130,6 @@ const CoronaThermometer = (props: StaticProps) => { sourceLabel={thermometer.sourceLabel} datesLabel={thermometer.datesLabel} levelDescription={thermometer.levelDescription} - trendIcon={thermometer.trendIcon as TrendIcon} /> {thermometerEvents && thermometerEvents.length && ( { 'title':title.${locale}, - 'subTitle':subTitle.${locale}, themeIcon, 'linksLabelMobile': labelMobile.${locale}, 'linksLabelDesktop': labelDesktop.${locale}, @@ -62,7 +61,6 @@ export function getTopicalStructureQuery(locale: string) { ][0]{ icon, 'title': title.${locale}, - 'subTitle': subTitle.${locale}, 'tileTitle':tileTitle.${locale}, currentLevel, 'thermometerLevels': thermometerLevels[]->{ @@ -75,10 +73,6 @@ export function getTopicalStructureQuery(locale: string) { 'sourceLabel': sourceLabel.${locale}, 'articleReference': articleReference.${locale}, 'collapsibleTitle': collapsibleTitle.${locale}, - 'trendIcon': { - 'color': trendIcon.color, - 'direction': trendIcon.direction, - }, 'timeline': { 'title': timeline.title.${locale}, 'tooltipLabel': timeline.tooltipCurrentEstimationLabel.${locale}, diff --git a/packages/app/src/queries/query-types.ts b/packages/app/src/queries/query-types.ts index 0d75d2347b..d837e69648 100644 --- a/packages/app/src/queries/query-types.ts +++ b/packages/app/src/queries/query-types.ts @@ -15,7 +15,6 @@ export interface TopicalSanityData { export interface ThermometerConfig { icon: TopicalIcon; title: string; - subTitle: PortableTextEntry[] | null; tileTitle: string | null; currentLevel: SeverityLevel; datesLabel: string; @@ -23,7 +22,6 @@ export interface ThermometerConfig { sourceLabel: string; articleReference: PortableTextEntry[]; collapsibleTitle: string; - trendIcon: TrendIcon; thermometerLevels: ThermometerLevel[]; timeline: ThermometerTimeLine; } @@ -60,7 +58,6 @@ interface KpiThemes { } interface Theme { title: string; - subTitle: PortableTextEntry[] | null; themeIcon: TopicalIcon; } diff --git a/packages/cms/src/schemas/documents/pages/homepage/theme-tile.ts b/packages/cms/src/schemas/documents/pages/homepage/theme-tile.ts index 843775ca16..ae70b71548 100644 --- a/packages/cms/src/schemas/documents/pages/homepage/theme-tile.ts +++ b/packages/cms/src/schemas/documents/pages/homepage/theme-tile.ts @@ -24,6 +24,15 @@ export const themeTile = defineType({ collapsed: true, }, }, + { + title: 'Link configuratie', + name: 'link-configuration', + description: 'Klik op het label om de velden te tonen.', + options: { + collapsible: true, + collapsed: true, + }, + }, ], fields: [ defineField({ @@ -54,7 +63,7 @@ export const themeTile = defineType({ fieldset: 'kpiValue', }), defineField({ - title: 'Verberg trend icoon', + title: 'Toon geen pijlen', name: 'hideTrendIcon', type: 'boolean', description: 'Wanneer aangevinkt, wordt het trend icoon niet getoond bij de KPI waarde.', @@ -92,14 +101,16 @@ export const themeTile = defineType({ fieldset: 'theme-tile-date-config', }), defineField({ - title: 'Trend icon', + title: 'Trend pijlen', name: 'trendIcon', type: 'trendIcon', }), defineField({ title: 'Link', + description: 'Vul hier de link in naar de juiste Landelijk pagina', name: 'cta', type: 'link', + fieldset: 'link-configuration', }), ], preview: { diff --git a/packages/cms/src/schemas/documents/pages/homepage/theme.ts b/packages/cms/src/schemas/documents/pages/homepage/theme.ts index aca4c43d0c..bbfb184316 100644 --- a/packages/cms/src/schemas/documents/pages/homepage/theme.ts +++ b/packages/cms/src/schemas/documents/pages/homepage/theme.ts @@ -9,15 +9,6 @@ export const theme = defineType({ name: 'theme', icon: BsFileEarmark, fieldsets: [ - { - title: 'Ondertitel', - description: 'Klik op het label om de velden te tonen.', - name: 'ondertitel', - options: { - collapsible: true, - collapsed: true, - }, - }, { title: 'Links', description: 'Klik op het label om de velden te tonen.', @@ -35,12 +26,6 @@ export const theme = defineType({ type: 'localeString', validation: localeStringValidation((rule) => rule.required()), }), - defineField({ - title: 'Ondertitel', - name: 'subTitle', - type: 'localeRichContentBlock', - fieldset: 'ondertitel', - }), defineField({ title: 'Thema icoon', name: 'themeIcon', diff --git a/packages/cms/src/schemas/documents/pages/homepage/thermometer-timeline.ts b/packages/cms/src/schemas/documents/pages/homepage/thermometer-timeline.ts index 7911016df9..c5467bb571 100644 --- a/packages/cms/src/schemas/documents/pages/homepage/thermometer-timeline.ts +++ b/packages/cms/src/schemas/documents/pages/homepage/thermometer-timeline.ts @@ -30,7 +30,7 @@ export const thermometerTimeline = defineType({ title: 'Tooltip label', description: 'Extra beschrijving voor in de laatste gebeurtenis in de tijdlijn', name: 'tooltipCurrentEstimationLabel', - type: 'localeText', + type: 'localeString', validation: (rule) => rule.required(), }), defineField({ diff --git a/packages/cms/src/schemas/documents/pages/homepage/thermometer.ts b/packages/cms/src/schemas/documents/pages/homepage/thermometer.ts index b370b594ce..688f45a361 100644 --- a/packages/cms/src/schemas/documents/pages/homepage/thermometer.ts +++ b/packages/cms/src/schemas/documents/pages/homepage/thermometer.ts @@ -8,15 +8,6 @@ export const thermometer = defineType({ title: 'Thermometer', name: 'thermometer', fieldsets: [ - { - title: 'De beschrijving boven de thermometer', - name: 'description', - description: 'Klik op het label om de velden te tonen.', - options: { - collapsible: true, - collapsed: true, - }, - }, { title: 'Artikel referentie', name: 'artikel-referentie', @@ -26,15 +17,6 @@ export const thermometer = defineType({ collapsed: true, }, }, - { - title: 'Titel van standen informatie', - name: 'level-information', - description: 'Klik op het label om de velden te tonen.', - options: { - collapsible: true, - collapsed: true, - }, - }, ], fields: [ defineField({ @@ -52,12 +34,6 @@ export const thermometer = defineType({ type: 'localeString', validation: localeStringValidation((rule) => rule.required()), }), - defineField({ - title: 'De beschrijving boven de thermometer', - name: 'subTitle', - type: 'localeRichContentBlock', - fieldset: 'description', - }), defineField({ title: 'De titel binnen de thermometer tegel', name: 'tileTitle', @@ -110,12 +86,6 @@ export const thermometer = defineType({ type: 'localeString', validation: localeStringValidation((rule) => rule.required()), }), - defineField({ - title: 'Titel van standen informatie', - name: 'trendIcon', - type: 'thermometerTrendIcon', - fieldset: 'level-information', - }), defineField({ title: 'Tijdlijn', name: 'timeline', diff --git a/packages/cms/src/studio/desk-structure/homepage-structure-item.ts b/packages/cms/src/studio/desk-structure/homepage-structure-item.ts index e5ca5181cc..90541d4a38 100644 --- a/packages/cms/src/studio/desk-structure/homepage-structure-item.ts +++ b/packages/cms/src/studio/desk-structure/homepage-structure-item.ts @@ -14,7 +14,7 @@ export const homepageStructureItem = (S: StructureBuilder) => { addStructureItem(S, BsGear, 'Samenvattingspagina configuratie', 'topicalPageConfig'), addStructureItem(S, BsCardList, 'Weeksamenvatting', 'weeklySummary'), addStructureItem(S, BsThermometer, 'Thermometer', 'thermometer'), - addStructureItem(S, BsCardText, "Thema's", 'themeCollection'), + addStructureItem(S, BsCardText, "KPI thema's en tegels", 'themeCollection'), addStructureItem(S, BsCardText, 'Adviezen', 'advice'), ]) );