Skip to content

Commit

Permalink
Merge pull request #1020 from basedosdados/staging
Browse files Browse the repository at this point in the history 
Staging
  • Loading branch information
@rdahis
rdahis authored Nov 7, 2024
2 parents 8469f2e + 24e15d3 commit cf7c5a0
Show file tree
Hide file tree
Showing 23 changed files with 518 additions and 170 deletions.
23 changes: 16 additions & 7 deletions next/components/atoms/ObservationLevelTable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,25 @@ export default function ObservationLevel({ resource }) {

const headers = [t('observationLevelTable.entityHeader'), t('observationLevelTable.columnsHeader')];

let array = []
const keys = Object.keys(resource?.observationLevels)
function sortElements(a, b) {
if (a.order < b.order) {
return -1;
}
if (a.order > b.order) {
return 1;
}
return 0;
}

keys.forEach((elm) => {
const value = resource?.observationLevels[elm]
let array = [];
const keys = Object.keys(resource?.observationLevels);
const sortedLevels = Object.values(resource?.observationLevels).sort(sortElements);

sortedLevels.forEach((value) => {
const valueEntity = () => {
if(value.entity[`name${capitalize(locale)}`]) return value.entity[`name${capitalize(locale)}`]
if(value.entity.name) return value.entity.name
return t('observationLevelTable.notProvided')
if(value.entity[`name${capitalize(locale)}`]) return value.entity[`name${capitalize(locale)}`];
if(value.entity.name) return value.entity.name;
return t('observationLevelTable.notProvided');
}

const valueColumns = () => {
Expand Down
11 changes: 6 additions & 5 deletions next/components/molecules/DataInformationQuery.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ import CheckIcon from "../../public/img/icons/checkIcon";
import Link from "../atoms/Link";

export function CodeHighlight({ language, children }) {
const { t } = useTranslation('dataset');
const textRef = useRef(null)
const [isOverflowing, setIsOverflowing] = useState(false)
const [isExpanded, setIsExpanded] = useState(true)
Expand Down Expand Up @@ -117,17 +118,17 @@ export function CodeHighlight({ language, children }) {
color:"#9D9FA3",
}}
>
{hasCopied ? "Copiado" : "Copiar"}
{hasCopied ? t('table.copied') : t('table.copy')}
{hasCopied ?
<CheckIcon
alt="copiado conteúdo"
alt="copied"
width="24px"
height="24px"
marginLeft="5px"
/>
:
<CopySolidIcon
alt="copiar conteúdo"
alt="copy"
width="24px"
height="24px"
marginLeft="5px"
Expand Down Expand Up @@ -155,7 +156,7 @@ export function CodeHighlight({ language, children }) {
}}
>
<ChevronIcon
alt="expandir/recoler código"
alt="expand/collapse"
width="24px"
height="24px"
transform={isExpanded ? "rotate(-90deg)" : "rotate(90deg)"}
Expand All @@ -166,7 +167,7 @@ export function CodeHighlight({ language, children }) {
fontSize="12px"
lineHeight="18px"
>
{isExpanded ? "Recolher" : "Expandir"}
{isExpanded ? t('table.collapse') : t('table.expand')}
</Text>
</Box>
)}
Expand Down
7 changes: 3 additions & 4 deletions next/components/molecules/Footer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,25 +93,24 @@ export default function Footer({ template, ocult = false }) {

if(template === "simple") return (
<VStack
position="relative"
zIndex="10"
width="100%"
spacing={0}
>
<VStack
width="100%"
height={{base: "100%", lg: "96px"}}
justifyContent="center"
height="100%"
backgroundColor="#EEEEEE"
>
<Stack
width="100%"
maxWidth="1440px"
height="100%"
justifyContent="space-between"
direction={{base: "column-reverse", lg: "row"}}
spacing={0}
gridGap={{base: "8px", lg: "40px"}}
padding={{base: "24px", lg: "0"}}
padding="24px"
>
<HStack spacing={4}>
<TextFooterSimple>
Expand Down
4 changes: 2 additions & 2 deletions next/components/molecules/TableColumns.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -668,8 +668,8 @@ export default function TableColumns({
</TableValue>

<TableValue>
{elm?.node?.coverage?.start && elm?.node?.coverage?.end ?
elm.node.coverage.start +" - "+ elm.node.coverage.end
{elm?.node?.temporalCoverage?.start && elm?.node?.temporalCoverage?.end ?
elm.node.temporalCoverage.start +" - "+ elm.node.temporalCoverage.end
:
t('column.notProvided')
}
Expand Down
6 changes: 3 additions & 3 deletions next/components/molecules/ThemeCatalog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import { triggerGAEvent } from "../../utils";

import Carousel from "../atoms/Carousel";
import SectionText from "../atoms/SectionText";
import DatasetCard from "../organisms/DatasetCard";
import DatasetThemeCatalogCard from "../organisms/DatasetThemeCatalogCard";
import RemoveIcon from "../../public/img/icons/removeIcon";
import styles from "../../styles/themeCatalog.module.css";

Expand Down Expand Up @@ -249,11 +249,11 @@ function CardThemes ({ responsive, datasetsCards = [], loading, locale }) {
))
:
datasetsCards.map((elm, i) => (
<DatasetCard
<DatasetThemeCatalogCard
key={i}
name={elm?.name}
themes={elm?.themes}
organization={elm?.organizations?.[0]}
organizations={elm?.organizations}
tags={elm?.tags}
tables={{
id: elm?.first_table_id || elm?.first_closed_table_id,
Expand Down
83 changes: 55 additions & 28 deletions next/components/organisms/DatasetResource.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,12 @@ import ChevronIcon from "../../public/img/icons/chevronIcon";
export default function DatasetResource({
dataset
}) {
const { t } = useTranslation('dataset');
const router = useRouter()
const { query, locale } = router
const [tables, setTables] = useState([])
const [rawDataSources, setRawDataSources] = useState([])
const [informationRequests, setInformationRequests] = useState([])
const { t } = useTranslation('dataset');
const displayScreen = useBreakpointValue({ base: "mobile", lg: "desktop" })

const pushQuery = (key, value) => {
Expand All @@ -55,7 +55,6 @@ export default function DatasetResource({
}

useEffect(() => {

let dataset_tables = dataset?.tables?.edges.map((elm) => elm.node)
.filter((elm) => elm?.status?.slug !== "under_review")
.filter((elm) => elm?.slug !== "dicionario")
Expand Down Expand Up @@ -194,10 +193,24 @@ export default function DatasetResource({
)
}

function SelectResource() {
const [widthScreen, setWidthScreen] = useState(0)
function SelectResource ({ selectedResource }) {
const { t } = useTranslation('dataset');
const [widthScreen, setWidthScreen] = useState(0);
const [value, setValue] = useState("")
const {table, raw_data_source, information_request} = selectedResource;

const findResourceName = (source, id) => {
const resource = source.find(item => item._id === id);
return resource ? resource[`name${capitalize(locale)}`] || resource.name : "";
};

useEffect(() => {
setValue(
table ? findResourceName(tables, table) :
raw_data_source ? findResourceName(rawDataSources, raw_data_source) :
information_request ? findResourceName(informationRequests, information_request) : ""
);

const updateWidthScreen = () => {
setWidthScreen(window.innerWidth - 48)
}
Expand All @@ -209,35 +222,49 @@ export default function DatasetResource({
return () => {
window.removeEventListener('resize', updateWidthScreen)
}
}, [])
}, [table, raw_data_source, information_request]);

return (
<Menu>
<MenuButton
width="100%"
maxWidth="360px"
borderRadius="8px"
padding="14px 20px"
<Text
as="label"
display="flex"
flexDirection="column"
gap="8px"
fontFamily="Roboto"
fontWeight="400"
fontSize="14px"
lineHeight="20px"
backgroundColor="#EEEEEE"
color="#464A51"
textAlign="start"
fontWeight="500"
fontSize="16px"
lineHeight="24px"
color="#252A32"
>
<Text
display="flex"
justifyContent="space-between"
alignItems="center"
{t('selectResource')}

<MenuButton
width="100%"
maxWidth="360px"
borderRadius="8px"
padding="14px 20px"
fontFamily="Roboto"
fontWeight="400"
fontSize="14px"
lineHeight="20px"
backgroundColor="#EEEEEE"
color="#464A51"
textAlign="start"
>
Selecione uma tabela ou fonte original
<ChevronIcon
marginLeft="auto"
transform="rotate(90deg)"
/>
</Text>
</MenuButton>
<Text
display="flex"
justifyContent="space-between"
alignItems="center"
>
{value}
<ChevronIcon
marginLeft="auto"
transform="rotate(90deg)"
/>
</Text>
</MenuButton>
</Text>

<MenuList
minWidth={widthScreen}
Expand Down Expand Up @@ -415,7 +442,7 @@ export default function DatasetResource({
/>
</Stack>
:
<SelectResource />
<SelectResource selectedResource={query}/>
}

<SwitchResource route={query}/>
Expand Down
45 changes: 38 additions & 7 deletions next/components/organisms/Dataset.js → ...components/organisms/DatasetSearchCard.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,20 +15,23 @@ import Link from '../atoms/Link';
import LinkIcon from "../../public/img/icons/linkIcon";
import InfoArrowIcon from "../../public/img/icons/infoArrowIcon";
import { DataBaseSolidIcon } from "../../public/img/icons/databaseIcon";
import axios from "axios";
import { useState, useEffect } from "react";

export default function Dataset({
id,
name,
organizations,
temporalCoverageText,
organization,
spatialCoverage,
tables,
rawDataSources,
informationRequests,
contains,
locale
}) {
const { t } = useTranslation('dataset');
const router = useRouter();
const allowedURLs = ["https://basedosdados.org", "https://staging.basedosdados.org"]

const Tables = () => {
let tablesNumber = tables.number
Expand Down Expand Up @@ -155,8 +158,10 @@ export default function Dataset({
_hover={{ opacity: 0.9 }}
>
<Image
src={organization?.picture.startsWith("https://") ? organization?.picture : `https://basedosdados.org/uploads/group/${organization?.name}`}
alt={organization[`name${capitalize(locale)}`] || organization?.name || t('notProvided')}
src={organizations[0]?.picture?.startsWith("https://")
? organizations[0]?.picture
: `https://basedosdados.org/uploads/group/${organizations[0]?.name}`}
alt={organizations[0]?.[`name${capitalize(locale)}`] || organizations[0]?.name || t('notProvided')}
borderRadius="16px"
minWidth="222px"
minHeight="138px"
Expand Down Expand Up @@ -223,7 +228,7 @@ export default function Dataset({
{t('organization')}:
</Text>
<Link
href={`/search?organization=${organization?.slug}`}
href={`/search?organization=${organizations[0]?.slug}`}
color="#71757A"
fontWeight="400"
_hover={{
Expand All @@ -236,7 +241,7 @@ export default function Dataset({
lineHeight="20px"
textOverflow="ellipsis"
>
{organization[`name${capitalize(locale)}`] || organization?.name}
{organizations[0]?.[`name${capitalize(locale)}`] || organizations[0]?.name}
</Text>
</Link>
</Stack>
Expand All @@ -261,10 +266,36 @@ export default function Dataset({
lineHeight="20px"
color="#71757A"
>
{temporalCoverageText ? temporalCoverageText : t('noCoverage')}
{temporalCoverageText ? temporalCoverageText : t('notProvided')}
</Text>
</Stack>

{!allowedURLs.includes(process.env.NEXT_PUBLIC_BASE_URL_FRONTEND) &&
<Stack
direction={{ base: "column", lg: "row" }}
spacing={1}
>
<Text
fontFamily="Roboto"
fontWeight="400"
fontSize="14px"
lineHeight="20px"
color="#464A51"
>
{t('spatialCoverage')}:
</Text>
<Text
fontFamily="Roboto"
fontWeight="400"
fontSize="14px"
lineHeight="20px"
color="#71757A"
>
{spatialCoverage ? spatialCoverage : t('notProvided')}
</Text>
</Stack>
}

<Stack
direction={{ base: "column", lg: "row" }}
spacing={1}
Expand Down
6 changes: 3 additions & 3 deletions next/components/organisms/DatasetCard.js → ...ents/organisms/DatasetThemeCatalogCard.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { DatasetCardTag } from "../atoms/DatasetCardTag";
export default function DatasetCard({
name,
themes = [],
organization,
organizations,
tags = [],
tables,
rawDataSources,
Expand Down Expand Up @@ -136,7 +136,7 @@ export default function DatasetCard({
{name}
</Text>
</Link>
<Link href={`/search?organization=${organization.slug}`}>
<Link href={`/search?organization=${organizations?.[0]?.slug}`}>
<Text
noOfLines={2}
lineHeight="16px"
Expand All @@ -147,7 +147,7 @@ export default function DatasetCard({
fontWeight="400"
color="#6F6F6F"
>
{organization[`name${capitalize(locale)}`] || organization.name || organization.slug}
{organizations?.[0]?.[`name${capitalize(locale)}`] || organizations?.[0]?.name || organizations?.[0]?.slug}
</Text>
</Link>

Expand Down
Loading

0 comments on commit cf7c5a0

Please sign in to comment.