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

Update frictionless example display

Browse Source
This commit is contained in:
Rising Odegua 2022-02-03 11:37:53 +01:00
parent f2fe319e51
commit ebfc2d5449
1 changed files with 28 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
examples/dataset-frictionless/pages/index.js
View File

@ -1,5 +1,4 @@
import { import {
ResourceInfo,
KeyInfo, KeyInfo,
PlotlyChart, PlotlyChart,
Table, Table,
@ -36,7 +35,11 @@ export default function Home({ dataset, specs }) {
const resources = dataset['resources'] const resources = dataset['resources']
const columns = resources[0].schema.fields.map((field) => { const columns = resources[0].schema.fields.map((field) => {
return { field: field.name, headerName: field.name } return {
field: field.name,
headerName: field.name,
flex: 1
}
}) })
const tableSample = resources[0].sample const tableSample = resources[0].sample
@ -51,11 +54,7 @@ export default function Home({ dataset, specs }) {
<section name="key-info"> <section name="key-info">
<KeyInfo descriptor={descriptor} resources={resources} /> <h1 className="text-3xl font-bold m-8">{descriptor.title}</h1>
</section>
<section name="file-list">
<ResourceInfo resources={resources} />
</section> </section>
<section className="m-8" name="graph"> <section className="m-8" name="graph">
@ -79,28 +78,30 @@ export default function Home({ dataset, specs }) {
<section className="m-8" name="sample-table" > <section className="m-8" name="sample-table" >
<h1 className="text-2xl font-bold mb-4">Data Preview</h1> <h1 className="text-2xl font-bold mb-4">Data Preview</h1>
<h2 className="text-1xl">{descriptor.title}</h2> <div className='ml-3'>
{resources[0].sample ? ( <h2 className="text-1xl">{descriptor.title}</h2>
<div > {resources[0].sample ? (
<Table columns={columns} data={tableSample} /> <div >
</div> <Table columns={columns} data={tableSample} />
) : ( </div>
'No preview is available for this dataset' ) : (
)} 'No preview is available for this dataset'
)}
</div>
</section> </section>
{ <section name="sample-table">
dataset.readmeHtml != "" ? ( {
<section className="m-8" name="sample-table"> dataset.readmeHtml != "" ? (
<div>
<h1 className="text-2xl font-bold mb-4">README</h1> <h1 className="text-2xl font-bold ml-8">README</h1>
<ReadMe readme={dataset.readmeHtml} /> <ReadMe readme={dataset.readmeHtml} />
</section> </div>
) : ( ) : (
"" ""
) )
} }
</section>
</div> </div>
) )