Skip to content

Commit 53361d5

Browse files
committed
update publisher logo in usecase cards
1 parent ef198d2 commit 53361d5

File tree

5 files changed

+184
-92
lines changed

5 files changed

+184
-92
lines changed

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

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,19 @@ const useCasesListDoc: any = graphql(`
3131
summary
3232
slug
3333
datasetCount
34+
isIndividualUsecase
35+
user {
36+
fullName
37+
profilePicture {
38+
url
39+
}
40+
}
41+
organization {
42+
name
43+
logo {
44+
url
45+
}
46+
}
3447
logo {
3548
path
3649
}
@@ -81,7 +94,7 @@ const UseCasesListingPage = () => {
8194

8295
return (
8396
<div className=" container pt-10 md:px-8 lg:pt-20">
84-
<div className="flex flex-col gap-2 md:px-12 px-4 lg:px-12 ">
97+
<div className="flex flex-col gap-2 px-4 md:px-12 lg:px-12 ">
8598
<Text variant="heading3xl">Recent UseCases</Text>
8699
<div className="flex flex-wrap justify-between gap-2 ">
87100
<Text variant="headingLg" fontWeight="medium">
@@ -99,7 +112,7 @@ const UseCasesListingPage = () => {
99112
</Button>
100113
</div>
101114
</div>
102-
<div className='mt-12'>
115+
<div className="mt-12">
103116
<Carousel className="flex w-full justify-between">
104117
<CarouselPrevious />
105118

@@ -143,7 +156,16 @@ const UseCasesListingPage = () => {
143156
icon: `/Sectors/${item?.sectors[0]?.name}.svg`,
144157
label: 'Sectors',
145158
},
146-
{ icon: '/fallback.svg', label: 'Published by' },
159+
{
160+
icon: item.isIndividualUsecase
161+
? item?.user?.profilePicture
162+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.user.profilePicture.url}`
163+
: '/profile.png'
164+
: item?.organization?.logo
165+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.organization.logo.url}`
166+
: '/org.png',
167+
label: 'Published by',
168+
},
147169
]}
148170
imageUrl={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.logo?.path.replace('/code/files/', '')}`}
149171
description={item.summary}

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,6 @@ const SimilarDatasets: React.FC<Props> = ({ showCharts }) => {
9494
)
9595
);
9696

97-
console.log(SimilatDatasetdetails?.data?.getDataset);
9897

9998
return (
10099
<div className="py-4 md:py-10 lg:py-20">

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

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,19 @@ const userPublishedUseCasesDoc: any = graphql(`
1515
title
1616
summary
1717
slug
18+
isIndividualUsecase
19+
user {
20+
fullName
21+
profilePicture {
22+
url
23+
}
24+
}
25+
organization {
26+
name
27+
logo {
28+
url
29+
}
30+
}
1831
metadata {
1932
metadataItem {
2033
id
@@ -100,7 +113,6 @@ const UseCases = ({ type }: { type: 'organization' | 'Publisher' }) => {
100113
? PublishedUseCasesList.data?.organizationPublishedUseCases
101114
: PublishedUseCasesList.data?.userPublishedUseCases;
102115

103-
104116
return (
105117
<div>
106118
<div
@@ -145,7 +157,16 @@ const UseCases = ({ type }: { type: 'organization' | 'Publisher' }) => {
145157
icon: `/Sectors/${item?.sectors[0]?.name}.svg`,
146158
label: 'Sectors',
147159
},
148-
{ icon: '/fallback.svg', label: 'Published by' },
160+
{
161+
icon: item.isIndividualUsecase
162+
? item?.user?.profilePicture
163+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.user.profilePicture.url}`
164+
: '/profile.png'
165+
: item?.organization?.logo
166+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${item.organization.logo.url}`
167+
: '/org.png',
168+
label: 'Published by',
169+
},
149170
]}
150171
description={item.summary}
151172
iconColor="warning"

app/[locale]/(user)/usecases/[useCaseSlug]/page.tsx

Lines changed: 113 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { useParams } from 'next/navigation';
55
import { graphql } from '@/gql';
66
import { TypeDataset, TypeUseCase } from '@/gql/generated/graphql';
77
import { useQuery } from '@tanstack/react-query';
8-
import { Avatar, Card, Spinner, Text } from 'opub-ui';
8+
import { Card, Text } from 'opub-ui';
99

1010
import { GraphQL } from '@/lib/api';
1111
import { formatDate } from '@/lib/utils';
@@ -21,6 +21,21 @@ const UseCasedetails: any = graphql(`
2121
id
2222
title
2323
summary
24+
isIndividualUsecase
25+
user {
26+
fullName
27+
email
28+
profilePicture {
29+
url
30+
}
31+
}
32+
organization {
33+
name
34+
contactEmail
35+
logo {
36+
url
37+
}
38+
}
2439
website
2540
metadata {
2641
metadataItem {
@@ -44,23 +59,30 @@ const UseCasedetails: any = graphql(`
4459
name
4560
contactEmail
4661
logo {
47-
path
62+
url
4863
}
4964
}
5065
logo {
5166
name
5267
path
53-
url
5468
}
5569
datasets {
5670
title
5771
id
72+
isIndividualDataset
73+
user {
74+
fullName
75+
id
76+
profilePicture {
77+
url
78+
}
79+
}
5880
downloadCount
5981
description
6082
organization {
6183
name
6284
logo {
63-
path
85+
url
6486
}
6587
}
6688
metadata {
@@ -138,8 +160,7 @@ const UseCaseDetailPage = () => {
138160
const hasContributors =
139161
UseCaseDetails?.useCase?.contributors &&
140162
UseCaseDetails?.useCase?.contributors?.length > 0;
141-
142-
163+
console.log(UseCaseDetails);
143164

144165
return (
145166
<div>
@@ -159,7 +180,6 @@ const UseCaseDetailPage = () => {
159180
<div className=" bg-onSurfaceDefault">
160181
<div className="container flex flex-row">
161182
<div className="w-full border-solid border-greyExtralight py-8 pr-8 lg:w-3/4 lg:border-r-2 lg:py-10 lg:pr-8">
162-
163183
<PrimaryDetails data={UseCaseDetails} isLoading={isLoading} />
164184
</div>
165185
<div className="hidden lg:block lg:w-1/4">
@@ -208,102 +228,111 @@ const UseCaseDetailPage = () => {
208228
icon: `/Sectors/${dataset.sectors[0].name}.svg`,
209229
label: 'Sectors',
210230
},
211-
{ icon: '/fallback.svg', label: 'Published by' },
231+
{
232+
icon: dataset.isIndividualDataset
233+
? dataset?.user?.profilePicture
234+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${dataset.user.profilePicture.url}`
235+
: '/profile.png'
236+
: dataset?.organization?.logo
237+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${dataset.organization.logo.url}`
238+
: '/org.png',
239+
label: 'Published by',
240+
},
212241
]}
213242
description={dataset.description || ''}
214243
/>
215244
))}
216245
</div>
217246
</div>
218247
</div>
219-
{(hasSupportingOrganizations || hasPartnerOrganizations || hasContributors) && (
248+
{(hasSupportingOrganizations ||
249+
hasPartnerOrganizations ||
250+
hasContributors) && (
220251
<div className=" bg-primaryBlue">
221252
<div className="container flex flex-wrap gap-8 py-10 lg:flex-nowrap ">
222253
{hasSupportingOrganizations && (
223-
<div className="w-full lg:w-2/4">
224-
<Text variant="heading2xl" color="onBgDefault">
225-
Supported by
226-
</Text>
227-
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
228-
{UseCaseDetails?.useCase?.supportingOrganizations?.map(
229-
(org: any) => (
230-
<div
231-
key={org.id}
232-
className=" rounded-4 bg-surfaceDefault p-4"
233-
>
234-
<Image
235-
src={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${org.logo?.url}`}
236-
alt={org.name}
237-
width={140}
238-
height={100}
239-
className=" object-contain"
240-
/>
241-
</div>
242-
)
243-
)}
244-
</div>
254+
<div className="w-full lg:w-2/4">
255+
<Text variant="heading2xl" color="onBgDefault">
256+
Supported by
257+
</Text>
258+
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
259+
{UseCaseDetails?.useCase?.supportingOrganizations?.map(
260+
(org: any) => (
261+
<div
262+
key={org.id}
263+
className=" rounded-4 bg-surfaceDefault p-4"
264+
>
265+
<Image
266+
src={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${org.logo?.url}`}
267+
alt={org.name}
268+
width={140}
269+
height={100}
270+
className=" object-contain"
271+
/>
272+
</div>
273+
)
274+
)}
245275
</div>
246-
)}
276+
</div>
277+
)}
247278
{hasPartnerOrganizations && (
248-
<div className="w-full lg:w-2/4">
249-
<Text variant="heading2xl" color="onBgDefault">
250-
Partnered by
251-
</Text>
252-
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
253-
{UseCaseDetails?.useCase?.partnerOrganizations?.map(
254-
(org: any) => (
255-
<div
256-
key={org.id}
257-
className=" rounded-4 bg-surfaceDefault p-4"
258-
>
259-
<Image
260-
src={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${org.logo?.url}`}
261-
alt={org.name}
262-
width={140}
263-
height={100}
264-
className=" object-contain"
265-
/>
266-
</div>
267-
)
268-
)}
269-
</div>
270-
</div>
271-
)}
272-
</div>
273-
{hasContributors && (
274-
<div className="container py-10">
275-
<div className="flex flex-col">
276-
<Text variant="heading2xl" color="onBgDefault">
277-
Contributors{' '}
278-
</Text>
279-
<Text color="onBgDefault" variant="headingLg">
280-
Publisher and Contributors who have added to the Use
281-
Case
282-
</Text>
283-
</div>
284-
<div className="mt-8 flex flex-wrap items-center justify-start gap-8">
285-
{UseCaseDetails?.useCase?.contributors?.map(
286-
(contributor: any) => (
287-
<Image
288-
alt={contributor.fullName}
289-
width={120}
290-
height={120}
291-
className="rounded-full object-cover"
292-
key={contributor.id}
293-
src={
294-
contributor.profilePicture?.url
295-
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${contributor.profilePicture?.url}`
296-
: '/profile.png'
297-
}
298-
/>
279+
<div className="w-full lg:w-2/4">
280+
<Text variant="heading2xl" color="onBgDefault">
281+
Partnered by
282+
</Text>
283+
<div className="mt-8 flex h-fit w-fit flex-wrap items-center justify-start gap-6 ">
284+
{UseCaseDetails?.useCase?.partnerOrganizations?.map(
285+
(org: any) => (
286+
<div
287+
key={org.id}
288+
className=" rounded-4 bg-surfaceDefault p-4"
289+
>
290+
<Image
291+
src={`${process.env.NEXT_PUBLIC_BACKEND_URL}/${org.logo?.url}`}
292+
alt={org.name}
293+
width={140}
294+
height={100}
295+
className=" object-contain"
296+
/>
297+
</div>
299298
)
300299
)}
301300
</div>
302301
</div>
303302
)}
303+
</div>
304+
{hasContributors && (
305+
<div className="container py-10">
306+
<div className="flex flex-col">
307+
<Text variant="heading2xl" color="onBgDefault">
308+
Contributors{' '}
309+
</Text>
310+
<Text color="onBgDefault" variant="headingLg">
311+
Publisher and Contributors who have added to the Use Case
312+
</Text>
313+
</div>
314+
<div className="mt-8 flex flex-wrap items-center justify-start gap-8">
315+
{UseCaseDetails?.useCase?.contributors?.map(
316+
(contributor: any) => (
317+
<Image
318+
alt={contributor.fullName}
319+
width={120}
320+
height={120}
321+
className="rounded-full object-cover"
322+
key={contributor.id}
323+
src={
324+
contributor.profilePicture?.url
325+
? `${process.env.NEXT_PUBLIC_BACKEND_URL}/${contributor.profilePicture?.url}`
326+
: '/profile.png'
327+
}
328+
/>
329+
)
330+
)}
331+
</div>
332+
</div>
333+
)}
304334
</div>
305335
)}
306-
<div className="mt-10 bg-surfaceDefault"></div>
307336
</>
308337
)}
309338
</div>

0 commit comments

Comments
 (0)