From 3d0fd6f0d1420a749cd56b85648a0d779bf20f53 Mon Sep 17 00:00:00 2001 From: Patrick Browne Date: Wed, 19 Jan 2022 13:13:18 +0100 Subject: [PATCH 1/3] feat: Add browsing description fix #247 --- .../components/select-dataset-step.tsx | 45 ++++++++++++++----- app/locales/de/messages.po | 6 ++- app/locales/en/messages.po | 6 ++- app/locales/fr/messages.po | 6 ++- app/locales/it/messages.po | 6 ++- 5 files changed, 55 insertions(+), 14 deletions(-) diff --git a/app/configurator/components/select-dataset-step.tsx b/app/configurator/components/select-dataset-step.tsx index 773e3b063..9634a169f 100644 --- a/app/configurator/components/select-dataset-step.tsx +++ b/app/configurator/components/select-dataset-step.tsx @@ -113,16 +113,41 @@ export const SelectDatasetStepContent = () => { }} > - - {dataset ? null : filters.length > 0 ? ( - filters - .filter((f) => f.__typename !== "DataCubeAbout") - .map((f) => (f.__typename !== "DataCubeAbout" ? f.label : null)) - .join(", ") - ) : ( - All datasets - )} - + {dataset ? null : filters.length > 0 ? ( + filters + .filter((f) => f.__typename !== "DataCubeAbout") + .map((f) => (f.__typename !== "DataCubeAbout" ? f.label : null)) + .join(", ") + ) : ( + <> + + All datasets + + + + Explore datasets provided by the LINDAS Linked Data Service by + either filtering by categories or organisations or search + directly for specific keywords. Click on a dataset to see more + detailed information and start creating your own + visualizations. + + + + )} {dataset ? null : ( diff --git a/app/locales/de/messages.po b/app/locales/de/messages.po index 11f8605b1..0a0517316 100644 --- a/app/locales/de/messages.po +++ b/app/locales/de/messages.po @@ -45,10 +45,14 @@ msgstr "Kategorien" msgid "browse.dataset.create-visualization" msgstr "Visualisierung erstellen" -#: app/configurator/components/select-dataset-step.tsx:123 +#: app/configurator/components/select-dataset-step.tsx:129 msgid "browse.datasets.all-datasets" msgstr "Alle Datensätze" +#: app/configurator/components/select-dataset-step.tsx:141 +msgid "browse.datasets.description" +msgstr "Erkunden Sie die vom LINDAS Linked Data Service bereitgestellten Datensätze, indem Sie entweder nach Kategorien oder Organisationen filtern oder direkt nach bestimmten Stichworten suchen. Klicken Sie auf einen Datensatz, um detailliertere Informationen zu erhalten und Ihre eigenen Visualisierungen zu erstellen." + #: app/pages/v/[chartId].tsx:122 msgid "button.copy.visualization" msgstr "Diese Visualisierung kopieren" diff --git a/app/locales/en/messages.po b/app/locales/en/messages.po index 79d0f4ed8..93c1ff935 100644 --- a/app/locales/en/messages.po +++ b/app/locales/en/messages.po @@ -45,10 +45,14 @@ msgstr "Categories" msgid "browse.dataset.create-visualization" msgstr "Create visualization" -#: app/configurator/components/select-dataset-step.tsx:123 +#: app/configurator/components/select-dataset-step.tsx:129 msgid "browse.datasets.all-datasets" msgstr "All Datasets" +#: app/configurator/components/select-dataset-step.tsx:141 +msgid "browse.datasets.description" +msgstr "Explore datasets provided by the LINDAS Linked Data Service by either filtering by categories or organisations or search directly for specific keywords. Click on a dataset to see more detailed information and start creating your own visualizations." + #: app/pages/v/[chartId].tsx:122 msgid "button.copy.visualization" msgstr "Copy This Visualization" diff --git a/app/locales/fr/messages.po b/app/locales/fr/messages.po index 23d4f53f9..533a1dbc1 100644 --- a/app/locales/fr/messages.po +++ b/app/locales/fr/messages.po @@ -45,10 +45,14 @@ msgstr "Catégories" msgid "browse.dataset.create-visualization" msgstr "Créer une visualisation" -#: app/configurator/components/select-dataset-step.tsx:123 +#: app/configurator/components/select-dataset-step.tsx:129 msgid "browse.datasets.all-datasets" msgstr "Tout les jeux de données" +#: app/configurator/components/select-dataset-step.tsx:141 +msgid "browse.datasets.description" +msgstr "Explorez les jeux de données liés fournis par LINDAS, en filtrant par catégories ou organisations, ou en recherchant par mots-clés. Cliquez sur un ensemble de données pour afficher des informations plus détaillées et commencer à créer vos propres visualisations. " + #: app/pages/v/[chartId].tsx:122 msgid "button.copy.visualization" msgstr "Copier cette visualisation" diff --git a/app/locales/it/messages.po b/app/locales/it/messages.po index 3d3ed71dd..a7cbe6cc8 100644 --- a/app/locales/it/messages.po +++ b/app/locales/it/messages.po @@ -45,10 +45,14 @@ msgstr "Categorie" msgid "browse.dataset.create-visualization" msgstr "Crea una visualizzazione" -#: app/configurator/components/select-dataset-step.tsx:123 +#: app/configurator/components/select-dataset-step.tsx:129 msgid "browse.datasets.all-datasets" msgstr "Tutti i set di dati" +#: app/configurator/components/select-dataset-step.tsx:141 +msgid "browse.datasets.description" +msgstr "Esplora i set di dati forniti dal LINDAS Linked Data Service filtrando per categorie o organizzazioni oppure cercando direttamente per parole chiave specifiche. Clicca su un set di dati per vedere informazioni più dettagliate e iniziare a creare le tue visualizzazioni." + #: app/pages/v/[chartId].tsx:122 msgid "button.copy.visualization" msgstr "Copia questa visualizzazione" From 888fc468cf7c6c75f6fcf262c50eb4117ec625bd Mon Sep 17 00:00:00 2001 From: Patrick Browne Date: Thu, 20 Jan 2022 14:21:22 +0100 Subject: [PATCH 2/3] feat: Better button for back to dataset button fix #248 --- app/configurator/components/select-dataset-step.tsx | 8 ++++---- app/themes/federal.ts | 10 +++++++--- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/app/configurator/components/select-dataset-step.tsx b/app/configurator/components/select-dataset-step.tsx index 9634a169f..ba985130d 100644 --- a/app/configurator/components/select-dataset-step.tsx +++ b/app/configurator/components/select-dataset-step.tsx @@ -2,7 +2,7 @@ import { Trans } from "@lingui/macro"; import NextLink from "next/link"; import { Router, useRouter } from "next/router"; import React, { useMemo } from "react"; -import { Box, Link, Text } from "theme-ui"; +import { Box, Button, Text } from "theme-ui"; import { useDebounce } from "use-debounce"; import { DataSetHint } from "../../components/hint"; import { useDataCubesQuery } from "../../graphql/query-hooks"; @@ -86,18 +86,18 @@ export const SelectDatasetStepContent = () => { > {dataset ? ( <> - + diff --git a/app/themes/federal.ts b/app/themes/federal.ts index e3a6d2d12..0a3862bb3 100644 --- a/app/themes/federal.ts +++ b/app/themes/federal.ts @@ -50,6 +50,9 @@ export const theme: Theme = { secondaryActive: "#454545", secondaryDisabled: "#a6a6a6", + secondaryButton: "#d8e8ef", + secondaryButtonHover: "#CCDFE7", + success: "#3c763d", successHover: "#3c763d", successActive: "#3c763d", @@ -311,12 +314,13 @@ export const theme: Theme = { }, secondary: { variant: "buttons.primary", - bg: "secondary", + bg: "secondaryButton", + color: "primary", ":hover": { - bg: "secondaryHover", + bg: "secondaryButtonHover", }, ":active": { - bg: "secondaryHover", + bg: "secondaryButtonHover", }, ":disabled": { cursor: "initial", From c0a7315e6518eeb399af5f0fa986bdaeb4b5f86a Mon Sep 17 00:00:00 2001 From: Patrick Browne Date: Thu, 20 Jan 2022 14:34:31 +0100 Subject: [PATCH 3/3] refactor: Use typeguard inside filter to narrow type --- app/configurator/components/select-dataset-step.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/app/configurator/components/select-dataset-step.tsx b/app/configurator/components/select-dataset-step.tsx index ba985130d..44e0855b8 100644 --- a/app/configurator/components/select-dataset-step.tsx +++ b/app/configurator/components/select-dataset-step.tsx @@ -10,6 +10,7 @@ import { useConfiguratorState, useLocale } from "../../src"; import { BrowseStateProvider, buildURLFromBrowseState, + DataCubeAbout, DatasetResults, SearchDatasetBox, SearchFilters, @@ -115,8 +116,11 @@ export const SelectDatasetStepContent = () => { {dataset ? null : filters.length > 0 ? ( filters - .filter((f) => f.__typename !== "DataCubeAbout") - .map((f) => (f.__typename !== "DataCubeAbout" ? f.label : null)) + .filter( + (f): f is Exclude => + f.__typename !== "DataCubeAbout" + ) + .map((f) => f.label) .join(", ") ) : ( <> @@ -134,7 +138,7 @@ export const SelectDatasetStepContent = () => { sx={{ mb: 4, maxWidth: 800, - fontWeight:"light", + fontWeight: "light", display: "block", }} >