[home][s] - add mock data for recent datasets

components/home/Recent.tsx

@@ -1,49 +1,16 @@
 import Link from 'next/link';
 
-export default function Recent() {
+function Recent() {
   return (
     <section className="my-10 mx-4 lg:my-20">
       <h1 className="text-2xl font-thin mb-4">Recent Datasets</h1>
-      <div className="flex flex-col lg:flex-row">
+      <div>
         <div className="border px-4 mb-4 mr-3 border-gray-100 w-5/6 shadow-sm">
-          <h1 className="text-2xl font-thin">Our World in Data - COVID 19</h1>
+          <h1 className="text-2xl font-thin">Title</h1>
-          <p className="text-gray-500">Dataset</p>
+          <p className="text-gray-500">Description</p>
-          <p>
-            data collected and managed by Our World in Data - COVID 19 pulled
-            from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
-          </p>
           <Link href="/">
             <a className="pt-3 flex justify-end text-orange-500">
-              {' '}
+              View Dataset
-              View Dataset{' '}
-            </a>
-          </Link>
-        </div>
-        <div className="border px-4 mb-4 mr-3 border-gray-100 w-5/6  shadow-sm">
-          <h1 className="text-2xl font-thin">Our World in Data - COVID 19</h1>
-          <p className="text-gray-500">Dataset</p>
-          <p>
-            data collected and managed by Our World in Data - COVID 19 pulled
-            from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
-          </p>
-          <Link href="/">
-            <a className="pt-3 flex justify-end  text-orange-500">
-              {' '}
-              View Dataset{' '}
-            </a>
-          </Link>
-        </div>
-        <div className="border px-4 mb-4 border-gray-100 w-5/6 shadow-sm">
-          <h1 className="text-2xl font-thin">Our World in Data - COVID 19</h1>
-          <p className="text-gray-500 mb-2">Dataset</p>
-          <p>
-            data collected and managed by Our World in Data - COVID 19 pulled
-            from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
-          </p>
-          <Link href="/">
-            <a className="pt-3 flex justify-end  text-orange-500">
-              {' '}
-              View Dataset{' '}
             </a>
           </Link>
         </div>
@@ -51,3 +18,5 @@ export default function Recent() {
     </section>
   );
 }
+
+export default Recent;

mocks/index.js

@@ -58,6 +58,64 @@ const population = {
   },
 };
 
+const recentDataset = {
+  license_title: 'Creative Commons Attribution',
+  maintainer: '',
+  relationships_as_object: [],
+  private: false,
+  maintainer_email: '',
+  num_tags: 0,
+  id: '9b960530-728c-4a07-8f96-c5f89b545d05',
+  metadata_created: '2020-06-19T07:30:03.796668',
+  metadata_modified: '2020-06-19T07:30:11.392832',
+  author: '',
+  author_email: '',
+  state: 'active',
+  version: '',
+  creator_user_id: '0d23e029-ddd5-4909-a2cd-5af7fe8d6e9c',
+  type: 'dataset',
+  resources: [
+    {
+      mimetype: null,
+      cache_url: null,
+      hash: '',
+      description: '',
+      name: 'gettyimages-954867550.jpg',
+      format: 'JPEG',
+      url:
+        'https://demo.ckan.org/pl/dataset/9b960530-728c-4a07-8f96-c5f89b545d05/resource/ac28179c-023e-4c17-af3c-00cbb81f5dcb/download/gettyimages-954867550.jpg',
+      datastore_active: false,
+      cache_last_updated: null,
+      package_id: '9b960530-728c-4a07-8f96-c5f89b545d05',
+      created: '2020-06-19T07:30:10.786597',
+      state: 'active',
+      mimetype_inner: null,
+      last_modified: null,
+      position: 0,
+      revision_id: 'a810e134-79ba-4ab7-a7c4-f60e2fb21d40',
+      url_type: 'upload',
+      id: 'ac28179c-023e-4c17-af3c-00cbb81f5dcb',
+      resource_type: null,
+      size: null,
+    },
+  ],
+  num_resources: 1,
+  tags: [],
+  groups: [],
+  license_id: 'cc-by',
+  relationships_as_subject: [],
+  organization: null,
+  name: 'sdfasdasda',
+  isopen: true,
+  url: '',
+  notes: 'sdf',
+  owner_org: null,
+  extras: [],
+  license_url: 'http://www.opendefinition.org/licenses/cc-by',
+  title: 'sdf',
+  revision_id: 'a810e134-79ba-4ab7-a7c4-f60e2fb21d40',
+};
+
 module.exports.initMocks = function () {
   // Uncomment this line if you want to record API calls
   // nock.recorder.rec()
@@ -108,6 +166,24 @@ module.exports.initMocks = function () {
       result: population,
     });
 
+  // recent datapackages
+  nock('http://mock.ckan/api/3/action', { encodedQueryParams: true })
+    .persist()
+    .get('/package_search?sort=metadata_created%20desc')
+    .reply(200, {
+      success: true,
+      result: {
+        success: true,
+        result: {
+          count: 1923,
+          sort: 'metadata_created desc',
+          facets: {},
+          results: [recentDataset],
+          search_facets: {},
+        },
+      },
+    });
+
   // "datastore_search" mocks
   nock('http://mock.ckan/api/3/action', { encodedQueryParams: true })
     .persist()

pages/index.tsx

@@ -1,9 +1,13 @@
 import Head from 'next/head';
+import { GetServerSideProps } from 'next';
 import Nav from '../components/home/Nav';
 import Recent from '../components/home/Recent';
 import Input from '../components/search/Input';
+import config from '../config/';
+import utils from '../utils';
+import { util } from 'prettier';
 
-export default function Home() {
+function Home() {
   return (
     <div className="container mx-auto">
       <Head>
@@ -32,3 +36,21 @@ export default function Home() {
     </div>
   );
 }
+
+export const getServerSideProps: GetServerSideProps = async (context) => {
+  const res = await fetch(
+    `${config.get(
+      'DMS'
+    )}/api/3/action/package_search?sort=metadata_created%20desc`
+  );
+  const ckanResult = (await res.json()).result;
+  const datapackages = ckanResult;
+  console.log(datapackages);
+  return {
+    props: {
+      datapackages,
+    },
+  };
+};
+
+export default Home;