From 8f25a77653ce85282b55f7831ad2415f5923913c Mon Sep 17 00:00:00 2001
From: anuveyatsu <anuar.ustayev@gmail.com>
Date: Fri, 12 Jun 2020 15:18:20 +0600
Subject: [PATCH] [dataset][l]: functional dataset page.

Mocked page is here: `/@world-bank/gdp`
---
 components/dataset/About.tsx     | 37 ++++++++++++++++++++++++++++++++
 components/dataset/Org.tsx       |  9 ++++++++
 components/dataset/Resources.tsx | 16 ++++++++++++++
 pages/[org]/[dataset]/index.tsx  | 26 ++++++++++++++++++++--
 pages/search.tsx                 |  1 -
 5 files changed, 86 insertions(+), 3 deletions(-)
 create mode 100644 components/dataset/About.tsx
 create mode 100644 components/dataset/Org.tsx
 create mode 100644 components/dataset/Resources.tsx

diff --git a/components/dataset/About.tsx b/components/dataset/About.tsx
new file mode 100644
index 00000000..2f9fd992
--- /dev/null
+++ b/components/dataset/About.tsx
@@ -0,0 +1,37 @@
+export default function About({ datapackage }) {
+  return (
+    <>
+      <h1 className="text-4xl font-semibold text-primary">{ datapackage.title || datapackage.name }</h1>
+      <table className="table info no-left-padding">
+        <thead>
+          <tr>
+            <th>Files</th>
+            <th>Size</th>
+            <th>Format</th>
+            <th>Created</th>
+            <th>Updated</th>
+            <th>License</th>
+            <th>Source</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td className="col-xs-1">{ datapackage.resources.length }</td>
+            <td className="col-xs-1">{ datapackage.size || 'N\A' }</td>
+            <td className="col-xs-2 format-list">
+            
+            </td>
+            <td className="col-xs-2">{ datapackage.created }</td>
+            <td className="col-xs-2">{ datapackage.modified }</td>
+            <td className="col-xs-2">
+
+            </td>
+            <td className="col-xs-2">
+
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </>
+  )
+}
diff --git a/components/dataset/Org.tsx b/components/dataset/Org.tsx
new file mode 100644
index 00000000..206d3b00
--- /dev/null
+++ b/components/dataset/Org.tsx
@@ -0,0 +1,9 @@
+import Link from 'next/link'
+
+export default function Org({ org }) {
+  return (
+    <Link href={`/@${org.name}`}>
+      <a className="text-2xl font-semibold text-primary">{ org.title || org.name }</a>
+    </Link>
+  )
+}
diff --git a/components/dataset/Resources.tsx b/components/dataset/Resources.tsx
new file mode 100644
index 00000000..e3889168
--- /dev/null
+++ b/components/dataset/Resources.tsx
@@ -0,0 +1,16 @@
+import Link from 'next/link'
+
+export default function Resources({ resources }) {
+  return (
+    <ul>
+      {resources.map((resource, index) => (
+          <li key={index}>
+            <Link href={`r/${resource.name}`}>
+              <a className="text-xl font-semibold text-primary">{ resource.title || resource.name }</a>
+            </Link>
+          </li>
+        )
+      )}
+    </ul>
+  )
+}
diff --git a/pages/[org]/[dataset]/index.tsx b/pages/[org]/[dataset]/index.tsx
index a2582208..c89eedd2 100644
--- a/pages/[org]/[dataset]/index.tsx
+++ b/pages/[org]/[dataset]/index.tsx
@@ -1,3 +1,25 @@
-export default function Dataset() {
-  return <h1>Dataset page</h1>
+import { GetServerSideProps } from 'next'
+import config from '../../../config'
+import utils from '../../../utils'
+import About from '../../../components/dataset/About'
+import Org from '../../../components/dataset/Org'
+import Resources from '../../../components/dataset/Resources'
+
+function Dataset({ datapackage }) {
+  return (
+    <>
+      <About datapackage={datapackage} />
+      <Org org={datapackage.organization} />
+      <Resources resources={datapackage.resources} />
+    </>
+  )
 }
+
+export const getServerSideProps: GetServerSideProps = async (context) => {
+  const res = await fetch(`${config.get('DMS')}/api/3/action/package_show?id=${context.query.dataset}`)
+  const ckanResult = (await res.json()).result
+  const datapackage = utils.ckanToDataPackage(ckanResult)
+  return { props: { datapackage } }
+}
+
+export default Dataset
diff --git a/pages/search.tsx b/pages/search.tsx
index d57b8397..f43c67d1 100644
--- a/pages/search.tsx
+++ b/pages/search.tsx
@@ -23,7 +23,6 @@ export const getServerSideProps: GetServerSideProps = async (context) => {
   const ckanQuery = querystring.stringify(
     utils.convertToCkanSearchQuery(query)
   )
-  console.log(ckanQuery)
   const res = await fetch(`${config.get('DMS')}/api/3/action/package_search?${ckanQuery}`)
   const ckanResult = (await res.json()).result
   const datapackages = ckanResult.results.map(item => utils.ckanToDataPackage(item))