knight/datahub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[resource page][m]: refactored page and components to work with Apollo client wired with CKAN API.

Browse Source
This commit is contained in:
anuveyatsu
2020-06-24 11:37:11 +06:00
parent 2589ecaeeb
commit 4baf72273d
3 changed files with 45 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
components/resource/About.tsx
View File

@@ -4,18 +4,20 @@ import { NetworkStatus } from 'apollo-client';
import { useQuery } from '@apollo/react-hooks';
import gql from 'graphql-tag';
export const QUERY = gql`
query dataset($id: String!) {
dataset(id: $id) {
const QUERY = gql`
query dataset($id: String) {
dataset(id: $id) @rest(type: "Response", path: "package_show?{args}") {
result {
resources {
name
id
url
format
title
description
format
size
created
last_modified
url
}
}
}
@@ -35,7 +37,9 @@ export default function About({ variables }) {
if (loading) return <div>Loading</div>;
const { result } = data.dataset;
const resource = result.resources[0];
const resource = result.resources.find(
(item) => item.name === variables.resource
);
return (
<>
<table className="table-auto w-full text-sm text-left my-6">
@@ -61,11 +65,12 @@ export default function About({ variables }) {
<td className="px-4 py-2">{resource.created}</td>
<td className="px-4 py-2">{resource.last_modified || ''}</td>
<td className="px-4 py-2">
<Link href={resource.url}>
<a className="bg-white hover:bg-gray-200 border text-black font-semibold py-2 px-4 rounded">
{resource.format}
</a>
</Link>
<a
href={resource.url}
className="bg-white hover:bg-gray-200 border text-black font-semibold py-2 px-4 rounded"
>
{resource.format}
</a>
</td>
</tr>
</tbody>

16
components/resource/DataExplorer.tsx
View File

@@ -4,18 +4,20 @@ import { NetworkStatus } from 'apollo-client';
import { useQuery } from '@apollo/react-hooks';
import gql from 'graphql-tag';
export const QUERY = gql`
query dataset($id: String!) {
dataset(id: $id) {
const QUERY = gql`
query dataset($id: String) {
dataset(id: $id) @rest(type: "Response", path: "package_show?{args}") {
result {
resources {
name
id
url
format
title
description
format
size
created
last_modified
url
}
}
}
@@ -35,7 +37,9 @@ export default function DataExplorer({ variables }) {
if (loading) return <div>Loading</div>;
const { result } = data.dataset;
const resource = result.resources[0];
const resource = result.resources.find(
(item) => item.name === variables.resource
);
return <>{JSON.stringify(resource)}</>;
}