Skip to content

Commit a00ba7f

Browse files
Merge pull request #332 from CivicDataLab/dev
Add geography filtering and collaborative fixed
2 parents 25007be + dbffc92 commit a00ba7f

File tree

28 files changed

+847
-153
lines changed

28 files changed

+847
-153
lines changed

app/[locale]/(user)/collaboratives/CollaborativesListingClient.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -218,7 +218,7 @@ const CollaborativesListingClient = () => {
218218
</div>
219219
<div className="flex w-full items-center justify-center lg:w-1/2">
220220
<Image
221-
src={'/collaborative.png'}
221+
src={'/collaborative.svg'}
222222
alt={'collaborative'}
223223
width={1700}
224224
height={800}

app/[locale]/(user)/collaboratives/[collaborativeSlug]/CollaborativeDetailsClient.tsx

Lines changed: 21 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,12 @@ const CollaborativeDetails = graphql(`
121121
sectors {
122122
name
123123
}
124+
geographies {
125+
id
126+
name
127+
code
128+
type
129+
}
124130
modified
125131
}
126132
useCases {
@@ -154,6 +160,12 @@ const CollaborativeDetails = graphql(`
154160
sectors {
155161
name
156162
}
163+
geographies {
164+
id
165+
name
166+
code
167+
type
168+
}
157169
tags {
158170
id
159171
value
@@ -248,9 +260,7 @@ const CollaborativeDetailClient = () => {
248260
const hasPartnerOrganizations =
249261
CollaborativeDetailsData?.collaborativeBySlug?.partnerOrganizations &&
250262
CollaborativeDetailsData?.collaborativeBySlug?.partnerOrganizations?.length > 0;
251-
const hasContributors =
252-
CollaborativeDetailsData?.collaborativeBySlug?.contributors &&
253-
CollaborativeDetailsData?.collaborativeBySlug?.contributors?.length > 0;
263+
254264

255265
const jsonLd = generateJsonLd({
256266
'@context': 'https://schema.org',
@@ -321,7 +331,7 @@ const CollaborativeDetailClient = () => {
321331
{hasSupportingOrganizations && (
322332
<div className="w-full lg:w-2/4">
323333
<Text variant="headingXl" color="onBgDefault">
324-
Supported by
334+
Supporters
325335
</Text>
326336
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
327337
{CollaborativeDetailsData?.collaborativeBySlug?.supportingOrganizations?.map(
@@ -348,7 +358,7 @@ const CollaborativeDetailClient = () => {
348358
{hasPartnerOrganizations && (
349359
<div className="w-full lg:w-2/4">
350360
<Text variant="headingXl" color="onBgDefault">
351-
Partnered by
361+
Partners
352362
</Text>
353363
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
354364
{CollaborativeDetailsData?.collaborativeBySlug?.partnerOrganizations?.map(
@@ -396,9 +406,9 @@ const CollaborativeDetailClient = () => {
396406
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${useCase.organization.logo.url}`
397407
: '/org.png';
398408

399-
const Geography = useCase.metadata?.find(
400-
(meta: any) => meta.metadataItem?.label === 'Geography'
401-
)?.value;
409+
const Geography = useCase.geographies && useCase.geographies.length > 0
410+
? useCase.geographies.map((geo: any) => geo.name).join(', ')
411+
: null;
402412

403413
const MetadataContent = [
404414
{
@@ -492,10 +502,9 @@ const CollaborativeDetailClient = () => {
492502
icon: Icons.globe,
493503
label: 'Geography',
494504
value:
495-
dataset.metadata?.find(
496-
(meta: any) =>
497-
meta.metadataItem?.label === 'Geography'
498-
)?.value || '',
505+
dataset.geographies && dataset.geographies.length > 0
506+
? dataset.geographies.map((geo: any) => geo.name).join(', ')
507+
: '',
499508
},
500509
]}
501510
href={`/datasets/${dataset.id}`}

app/[locale]/(user)/collaboratives/components/Details.tsx

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
'use client';
22

3-
import React, { useState } from 'react';
43
import Image from 'next/image';
54
import { Button, Icon, Spinner, Tag, Text, Tray } from 'opub-ui';
5+
import { useState } from 'react';
66
import ReactMarkdown from 'react-markdown';
77
import rehypeRaw from 'rehype-raw';
88
import remarkGfm from 'remark-gfm';
@@ -142,9 +142,6 @@ const PrimaryDetails = ({ data, isLoading }: { data: any; isLoading: any }) => {
142142
</div>
143143
)}
144144
<div className="mt-6 lg:mt-10">
145-
<Text variant="headingXl" color="onBgDefault">
146-
Summary
147-
</Text>
148145
<div className="prose-h1:text-3xl prose-h2:text-2xl prose-h3:text-xl prose-p:leading-relaxed prose-a:text-blue-400 hover:prose-a:text-blue-300 prose-code:bg-gray-800 prose-code:rounded prose-pre:bg-gray-900 prose-pre:border prose-pre:border-gray-700 prose-blockquote:border-l-blue-500 prose-th:bg-gray-800 prose-img:rounded-lg prose prose-lg prose-invert mt-4 max-w-none prose-headings:text-white prose-p:text-white prose-a:underline prose-blockquote:text-white prose-strong:text-white prose-em:text-white prose-code:px-1 prose-code:py-0.5 prose-code:text-white prose-code:before:content-none prose-code:after:content-none prose-pre:text-white prose-ol:text-white prose-ul:text-white prose-li:text-white prose-li:marker:text-white prose-table:text-white prose-thead:border-white prose-tr:border-white prose-th:border-white prose-th:text-white prose-td:border-white prose-td:text-white prose-hr:border-white">
149146
<ReactMarkdown
150147
remarkPlugins={[remarkGfm]}

app/[locale]/(user)/components/Datasets.tsx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,11 @@ const Datasets = () => {
102102
{
103103
icon: Icons.calendar,
104104
label: 'Date',
105-
value: '19 July 2024',
105+
value: new Date(item.modified).toLocaleDateString('en-US', {
106+
day: 'numeric',
107+
month: 'long',
108+
year: 'numeric',
109+
}),
106110
},
107111
{
108112
icon: Icons.download,
@@ -112,7 +116,9 @@ const Datasets = () => {
112116
{
113117
icon: Icons.globe,
114118
label: 'Geography',
115-
value: 'India',
119+
value: item.geographies?.length > 0
120+
? item.geographies.join(', ')
121+
: 'Not specified',
116122
},
117123
]}
118124
tag={item.tags}

app/[locale]/(user)/components/ListingComponent.tsx

Lines changed: 26 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -528,9 +528,14 @@ const ListingComponent: React.FC<ListingProps> = ({
528528
: item?.organization?.logo
529529
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.organization.logo}`
530530
: '/org.png';
531-
const Geography = item.metadata.filter(
532-
(item: any) => item.metadata_item.label === 'Geography'
533-
)[0]?.value;
531+
532+
const geographies = item.geographies && item.geographies.length > 0
533+
? item.geographies
534+
: null;
535+
536+
const sdgs = item.sdgs && item.sdgs.length > 0
537+
? item.sdgs
538+
: null;
534539

535540
const MetadataContent = [
536541
{
@@ -550,12 +555,27 @@ const ListingComponent: React.FC<ListingProps> = ({
550555
});
551556
}
552557

553-
if (Geography) {
558+
if (geographies && geographies.length > 0) {
559+
// Format geographies hierarchically for display
560+
const geoDisplay = geographies.join(', ');
561+
554562
MetadataContent.push({
555563
icon: Icons.globe,
556564
label: 'Geography',
557-
value: Geography,
558-
tooltip: 'Geography',
565+
value: geoDisplay,
566+
tooltip: geoDisplay,
567+
});
568+
}
569+
570+
if (sdgs && sdgs.length > 0) {
571+
// Format SDGs for display
572+
const sdgDisplay = sdgs.map((sdg: any) => `${sdg.code} - ${sdg.name}`).join(', ');
573+
574+
MetadataContent.push({
575+
icon: Icons.target,
576+
label: 'SDG Goals',
577+
value: sdgDisplay,
578+
tooltip: sdgDisplay,
559579
});
560580
}
561581

app/[locale]/(user)/components/UseCases.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,11 @@ const useCasesListDoc: any = graphql(`
4747
logo {
4848
path
4949
}
50+
geographies {
51+
id
52+
name
53+
code
54+
}
5055
metadata {
5156
metadataItem {
5257
id
@@ -150,10 +155,9 @@ const UseCasesListingPage = () => {
150155
{
151156
icon: Icons.globe,
152157
label: 'Geography',
153-
value: item.metadata?.find(
154-
(meta: any) =>
155-
meta.metadataItem?.label === 'Geography'
156-
)?.value,
158+
value: item.geographies?.length > 0
159+
? item.geographies.map((geo: any) => geo.name).join(', ')
160+
: 'Not specified',
157161
},
158162
]}
159163
footerContent={[

app/[locale]/(user)/datasets/[datasetIdentifier]/DatasetDetailsPage.tsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
'use client';
22

3-
import { useEffect, useState } from 'react';
43
import { graphql } from '@/gql';
54
import { useQuery } from '@tanstack/react-query';
65
import { Spinner } from 'opub-ui';
76

8-
import { GraphQL } from '@/lib/api';
9-
import { generateJsonLd } from '@/lib/utils';
107
import BreadCrumbs from '@/components/BreadCrumbs';
118
import JsonLd from '@/components/JsonLd';
9+
import { GraphQL } from '@/lib/api';
10+
import { generateJsonLd } from '@/lib/utils';
1211
import Details from './components/Details';
1312
import Metadata from './components/Metadata';
1413
import PrimaryData from './components/PrimaryData';
@@ -64,6 +63,17 @@ const datasetQuery: any = graphql(`
6463
sectors {
6564
name
6665
}
66+
geographies {
67+
id
68+
name
69+
code
70+
type
71+
parentId {
72+
id
73+
name
74+
type
75+
}
76+
}
6777
formats
6878
}
6979
}

app/[locale]/(user)/datasets/[datasetIdentifier]/components/Metadata/index.tsx

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import React, { useEffect, useState } from 'react';
21
import Image from 'next/image';
32
import Link from 'next/link';
43
import { Button, Divider, Icon, Tag, Text, Tooltip } from 'opub-ui';
4+
import React, { useEffect, useState } from 'react';
55

6-
import { cn, formatDate, getWebsiteTitle } from '@/lib/utils';
76
import { Icons } from '@/components/icons';
7+
import { cn, formatDate, getWebsiteTitle } from '@/lib/utils';
88
import Styles from '../../../dataset.module.scss';
99

1010
interface MetadataProps {
@@ -13,14 +13,14 @@ interface MetadataProps {
1313
}
1414

1515
const MetadataComponent: React.FC<MetadataProps> = ({ data, setOpen }) => {
16-
const Metadata = data.metadata.map((item: any) => ({
16+
const Metadata = (data.metadata || []).map((item: any) => ({
1717
label: item.metadataItem.label,
1818
value: item.value,
1919
type: item.metadataItem.dataType,
2020
}));
2121

22-
const [isexpanded, setIsexpanded] = useState(false);
23-
const toggleDescription = () => setIsexpanded(!isexpanded);
22+
// const [isexpanded, setIsexpanded] = useState(false);
23+
// const toggleDescription = () => setIsexpanded(!isexpanded);
2424

2525
const licenseOptions = [
2626
{
@@ -55,7 +55,7 @@ const MetadataComponent: React.FC<MetadataProps> = ({ data, setOpen }) => {
5555
useEffect(() => {
5656
const fetchTitle = async () => {
5757
try {
58-
const urlItem = data.metadata.find(
58+
const urlItem = (data.metadata || []).find(
5959
(item: any) => item.metadataItem?.dataType === 'URL'
6060
);
6161

@@ -177,6 +177,25 @@ const MetadataComponent: React.FC<MetadataProps> = ({ data, setOpen }) => {
177177
)}
178178
</div>
179179
</div>
180+
{data.geographies && data.geographies.length > 0 && (
181+
<div className="flex items-center gap-2 ">
182+
<Text className="min-w-[120px] basis-1/4 uppercase" variant="bodyMd">
183+
Geography
184+
</Text>
185+
<div className="flex flex-wrap gap-2">
186+
{data.geographies.map((geo: any, index: number) => (
187+
<Tag
188+
key={index}
189+
fillColor="var(--orange-secondary-color)"
190+
borderColor="var(--orange-secondary-text)"
191+
textColor="black"
192+
>
193+
{geo.name}
194+
</Tag>
195+
))}
196+
</div>
197+
</div>
198+
)}
180199
{Metadata.map((item: any, index: any) => (
181200
<div className="flex gap-2 " key={index}>
182201
<Text

app/[locale]/(user)/datasets/[datasetIdentifier]/components/SimilarDatasets/index.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,9 @@ const similarDatasetQuery: any = graphql(`
4949
}
5050
value
5151
}
52+
geographies {
53+
name
54+
}
5255
license
5356
resources {
5457
id
@@ -135,7 +138,7 @@ const SimilarDatasets: React.FC = () => {
135138
{
136139
icon: Icons.globe,
137140
label: 'Geography',
138-
value: 'India',
141+
value: item.geographies.join(', '),
139142
},
140143
]}
141144
tag={item.tags}

0 commit comments

Comments
 (0)