Skip to content

Commit e1e57fc

Browse files
Deepthi-ChandDeepthi-Chand
authored
Merge pull request #206 from CivicDataLab/205-update-queries-mutations
Update queries & mutations
2 parents 62c176f + 8a9ac35 commit e1e57fc

File tree

15 files changed

+199
-219
lines changed

15 files changed

+199
-219
lines changed

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

Lines changed: 76 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -93,20 +93,16 @@ const generateTableData = (resources: any[]) => {
9393
}));
9494
};
9595

96-
const accessModelResourcesQuery = graphql(`
96+
const accessModelResourcesQuery: any = graphql(`
9797
query accessModelResource($datasetId: UUID!) {
9898
accessModelResources(datasetId: $datasetId) {
99-
modelResources {
99+
resourceFields {
100100
resource {
101101
name
102102
description
103103
id
104104
}
105-
fields {
106-
fieldName
107-
format
108-
id
109-
}
105+
fields
110106
}
111107
id
112108
name
@@ -121,87 +117,91 @@ const accessModelResourcesQuery = graphql(`
121117
const AccessModels = () => {
122118
const params = useParams();
123119

124-
const { data, error, isLoading } = useQuery(
125-
[`accessmodel_${params.datasetIdentifier}`],
126-
() =>
127-
GraphQL(
128-
accessModelResourcesQuery,
129-
{
130-
// Entity Headers if present
131-
},
132-
{
133-
datasetId: params.datasetIdentifier,
134-
}
135-
)
120+
const getAccessModeldetails: {
121+
data: any;
122+
isError: boolean;
123+
isLoading: boolean;
124+
} = useQuery([`accessmodel_${params.datasetIdentifier}`], () =>
125+
GraphQL(
126+
accessModelResourcesQuery,
127+
{
128+
// Entity Headers if present
129+
},
130+
{
131+
datasetId: params.datasetIdentifier,
132+
}
133+
)
136134
);
137135

138136
return (
139137
<>
140-
{isLoading ? (
138+
{getAccessModeldetails.isLoading ? (
141139
<div className=" mt-8 flex justify-center">
142140
<Spinner />
143141
</div>
144142
) : (
145-
data?.accessModelResources.map((item: any, index: any) => (
146-
<div
147-
key={index}
148-
className="my-4 flex flex-col gap-4 rounded-2 p-6 shadow-basicDeep"
149-
>
150-
<div className="mb-1 flex flex-wrap justify-between gap-1 lg:gap-0">
151-
<div className="p2-4 lg:w-2/5">
152-
<Text variant="headingMd">{item.name}</Text>
143+
getAccessModeldetails.data?.accessModelResources.map(
144+
(item: any, index: any) => (
145+
<div
146+
key={index}
147+
className="my-4 flex flex-col gap-4 rounded-2 p-6 shadow-basicDeep"
148+
>
149+
<div className="mb-1 flex flex-wrap justify-between gap-1 lg:gap-0">
150+
<div className="p2-4 lg:w-2/5">
151+
<Text variant="headingMd">{item.name}</Text>
152+
</div>
153+
<div className="lg:w-3/5 lg:pl-4">
154+
<Text>{item.description}</Text>
155+
</div>
153156
</div>
154-
<div className="lg:w-3/5 lg:pl-4">
155-
<Text>{item.description}</Text>
157+
<div className="align-center flex flex-col justify-between gap-4 sm:flex-row lg:items-center">
158+
<CustomTags type={item.type.split('.').pop().toLowerCase()} />
156159
</div>
157-
</div>
158-
<div className="align-center flex flex-col justify-between gap-4 sm:flex-row lg:items-center">
159-
<CustomTags type={item.type.split('.').pop().toLowerCase()} />
160-
</div>
161-
{item?.modelResources?.length > 0 && (
162-
<div className="flex">
163-
<Accordion type="single" collapsible className="w-full">
164-
<AccordionItem value="item-1" className=" border-none">
165-
<div className="flex flex-wrap items-center justify-between">
166-
<AccordionTrigger className="flex w-full flex-wrap items-center gap-2 hover:no-underline">
167-
<div className=" text-baseBlueSolid8 ">
168-
See Resources
169-
</div>
170-
</AccordionTrigger>
171-
<Button
172-
className="h-fit w-fit"
173-
kind="secondary"
174-
onClick={() => {
175-
item.modelResources.forEach((resource: any) => {
176-
// Construct the download URL for each resource
177-
const downloadUrl = `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/download/resource/${resource.resource.id}`;
178-
// Open the URL in a new tab
179-
window.open(downloadUrl, '_blank');
180-
});
160+
{item?.modelResources?.length > 0 && (
161+
<div className="flex">
162+
<Accordion type="single" collapsible className="w-full">
163+
<AccordionItem value="item-1" className=" border-none">
164+
<div className="flex flex-wrap items-center justify-between">
165+
<AccordionTrigger className="flex w-full flex-wrap items-center gap-2 hover:no-underline">
166+
<div className=" text-baseBlueSolid8 ">
167+
See Resources
168+
</div>
169+
</AccordionTrigger>
170+
<Button
171+
className="h-fit w-fit"
172+
kind="secondary"
173+
onClick={() => {
174+
item.modelResources.forEach((resource: any) => {
175+
// Construct the download URL for each resource
176+
const downloadUrl = `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/download/resource/${resource.resource.id}`;
177+
// Open the URL in a new tab
178+
window.open(downloadUrl, '_blank');
179+
});
180+
}}
181+
>
182+
Download All Resources
183+
</Button>
184+
</div>
185+
<AccordionContent
186+
className="flex w-full flex-col p-5"
187+
style={{
188+
backgroundColor: 'var( --base-pure-white)',
189+
outline: '1px solid var( --base-pure-white)',
181190
}}
182191
>
183-
Download All Resources
184-
</Button>
185-
</div>
186-
<AccordionContent
187-
className="flex w-full flex-col p-5"
188-
style={{
189-
backgroundColor: 'var( --base-pure-white)',
190-
outline: '1px solid var( --base-pure-white)',
191-
}}
192-
>
193-
<Table
194-
columns={generateColumnData()}
195-
rows={generateTableData(item.modelResources)}
196-
hideFooter
197-
/>
198-
</AccordionContent>
199-
</AccordionItem>
200-
</Accordion>
201-
</div>
202-
)}
203-
</div>
204-
))
192+
<Table
193+
columns={generateColumnData()}
194+
rows={generateTableData(item.modelResources)}
195+
hideFooter
196+
/>
197+
</AccordionContent>
198+
</AccordionItem>
199+
</Accordion>
200+
</div>
201+
)}
202+
</div>
203+
)
204+
)
205205
)}
206206
</>
207207
);

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

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,9 @@ const DetailsQuery: any = graphql(`
3131
description
3232
id
3333
name
34-
chart
34+
chart {
35+
options
36+
}
3537
}
3638
... on TypeResourceChartImage {
3739
name
@@ -65,7 +67,7 @@ const Details = () => {
6567
);
6668
}
6769

68-
return <ReactECharts option={item.chart} ref={chartRef} />;
70+
return <ReactECharts option={item.chart.options} ref={chartRef} />;
6971
};
7072

7173
return (

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

Lines changed: 49 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { Button, Spinner, Tag, Text } from 'opub-ui';
1010
import { GraphQL } from '@/lib/api';
1111
import { formatDate } from '@/lib/utils';
1212

13-
const datasetResourceQuery = graphql(`
13+
const datasetResourceQuery: any = graphql(`
1414
query datasetResources($datasetId: UUID!) {
1515
datasetResources(datasetId: $datasetId) {
1616
id
@@ -19,18 +19,7 @@ const datasetResourceQuery = graphql(`
1919
type
2020
name
2121
description
22-
accessModels {
23-
name
24-
description
25-
type
26-
modelResources {
27-
fields {
28-
format
29-
fieldName
30-
description
31-
}
32-
}
33-
}
22+
3423
schema {
3524
fieldName
3625
id
@@ -47,7 +36,7 @@ const datasetResourceQuery = graphql(`
4736
const Resources = () => {
4837
const params = useParams();
4938

50-
const { data, isLoading } = useQuery(
39+
const getResourceDetails: { data: any; isLoading: boolean } = useQuery(
5140
[`resources_${params.datasetIdentifier}`],
5241
() =>
5342
GraphQL(
@@ -87,62 +76,68 @@ const Resources = () => {
8776
}));
8877
}
8978
});
90-
}, [data]);
79+
}, [getResourceDetails.data]);
9180

9281
return (
9382
<div className="w-full">
94-
{isLoading ? (
83+
{getResourceDetails.isLoading ? (
9584
<div className="mt-8 flex justify-center">
9685
<Spinner />
9786
</div>
98-
) : data && data?.datasetResources?.length > 0 ? (
87+
) : getResourceDetails.data &&
88+
getResourceDetails.data?.datasetResources?.length > 0 ? (
9989
<>
10090
<Text variant="bodyLg" className="mx-6 lg:mx-0">
10191
Downloadable Resources
10292
</Text>
10393
<div className="mx-6 mt-5 flex flex-col gap-8 bg-surfaceDefault p-6 lg:mx-0">
104-
{data?.datasetResources.map((item: any, index: number) => (
105-
<div key={index} className="flex flex-wrap justify-between gap-4">
106-
<div className="gap flex flex-col lg:w-4/5">
107-
<div className="item flex items-center gap-2">
108-
<Text variant="headingMd">{item.name}</Text>
109-
<Tag>{item.fileDetails.format}</Tag>
94+
{getResourceDetails.data?.datasetResources.map(
95+
(item: any, index: number) => (
96+
<div
97+
key={index}
98+
className="flex flex-wrap justify-between gap-4"
99+
>
100+
<div className="gap flex flex-col lg:w-4/5">
101+
<div className="item flex items-center gap-2">
102+
<Text variant="headingMd">{item.name}</Text>
103+
<Tag>{item.fileDetails.format}</Tag>
104+
</div>
105+
<div>
106+
<Text>Updated:</Text>
107+
<Text>{formatDate(item.modified)}</Text>
108+
</div>
109+
<div className="flex flex-col">
110+
<div
111+
ref={(el) => (descriptionRefs.current[index] = el)}
112+
className={!showMore[index] ? 'line-clamp-2' : ''}
113+
>
114+
<Text>{item.description}</Text>
115+
</div>
116+
{isDescriptionLong[index] && (
117+
<Button
118+
className="self-start p-2"
119+
onClick={() => toggleShowMore(index)}
120+
variant="interactive"
121+
size="slim"
122+
kind="tertiary"
123+
>
124+
{showMore[index] ? 'Show less' : 'Show more'}
125+
</Button>
126+
)}
127+
</div>
110128
</div>
111129
<div>
112-
<Text>Updated:</Text>
113-
<Text>{formatDate(item.modified)}</Text>
114-
</div>
115-
<div className="flex flex-col">
116-
<div
117-
ref={(el) => (descriptionRefs.current[index] = el)}
118-
className={!showMore[index] ? 'line-clamp-2' : ''}
130+
<Link
131+
href={`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/download/resource/${item.id}`}
132+
target="_blank"
133+
className="flex justify-center"
119134
>
120-
<Text>{item.description}</Text>
121-
</div>
122-
{isDescriptionLong[index] && (
123-
<Button
124-
className="self-start p-2"
125-
onClick={() => toggleShowMore(index)}
126-
variant="interactive"
127-
size="slim"
128-
kind="tertiary"
129-
>
130-
{showMore[index] ? 'Show less' : 'Show more'}
131-
</Button>
132-
)}
135+
<Button>Download</Button>
136+
</Link>
133137
</div>
134138
</div>
135-
<div>
136-
<Link
137-
href={`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/download/resource/${item.id}`}
138-
target="_blank"
139-
className="flex justify-center"
140-
>
141-
<Button>Download</Button>
142-
</Link>
143-
</div>
144-
</div>
145-
))}
139+
)
140+
)}
146141
</div>
147142
</>
148143
) : (

‎app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/charts/components/ChartsImage.tsx‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ const getResourceChartImageDetails: any = graphql(`
4040
}
4141
`);
4242

43-
4443
const getDatasetResourceChartImageDetails: any = graphql(`
4544
query resourceChartImages($datasetId: UUID!) {
4645
datasetResourceCharts(datasetId: $datasetId) {
@@ -55,9 +54,6 @@ const getDatasetResourceChartImageDetails: any = graphql(`
5554
}
5655
`);
5756

58-
59-
60-
6157
const AddResourceChartimage: any = graphql(`
6258
mutation GenerateResourceChartimage($dataset: UUID!) {
6359
addResourceChartImage(dataset: $dataset) {
@@ -71,16 +67,18 @@ const AddResourceChartimage: any = graphql(`
7167
`);
7268

7369
const UpdateChartImageMutation: any = graphql(`
74-
mutation updateChartImage($data: ResourceChartImageInputPartial!) {
75-
updateResourceChartImage(data: $data) {
70+
mutation updateChartImage($input: ResourceChartImageInputPartial!) {
71+
updateResourceChartImage(input: $input) {
7672
__typename
73+
... on TypeResourceChartImage {{}
7774
id
7875
name
7976
description
8077
image {
8178
name
8279
path
8380
}
81+
}
8482
}
8583
}
8684
`);
@@ -126,7 +124,7 @@ const ChartsImage: React.FC<ImageProps> = ({
126124
[params.entityType]: params.entitySlug,
127125
},
128126
{
129-
datasetId: params.id
127+
datasetId: params.id,
130128
}
131129
),
132130
{}

0 commit comments

Comments
 (0)