Run prettier
This commit is contained in:
deme
@@ -37,185 +37,185 @@ export default function ProjectPage({
|
|||||||
@{project.repo.full_name}
|
@{project.repo.full_name}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
{description && (
|
{description && (
|
||||||
<div className="inline-block min-w-full py-2 align-middle mt-5">
|
<div className="inline-block min-w-full py-2 align-middle mt-5">
|
||||||
{description}
|
{description}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="inline-block min-w-full py-2 align-middle">
|
<div className="inline-block min-w-full py-2 align-middle">
|
||||||
<table className="min-w-full divide-y divide-gray-300">
|
<table className="min-w-full divide-y divide-gray-300">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Name
|
Name
|
||||||
</th>
|
</th>
|
||||||
{project.datapackage.countryCode && (
|
{project.datapackage.countryCode && (
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Country
|
Country
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Metadata
|
Metadata
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody className="divide-y divide-gray-200">
|
<tbody className="divide-y divide-gray-200">
|
||||||
<tr>
|
<tr>
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
{project.name}
|
{project.name}
|
||||||
</td>
|
</td>
|
||||||
{project.datapackage.countryCode && (
|
{project.datapackage.countryCode && (
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
{project.datapackage.countryCode}
|
{project.datapackage.countryCode}
|
||||||
</td>
|
</td>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
<Link
|
<Link
|
||||||
// TODO: this link may be incorrect for some datasets
|
// TODO: this link may be incorrect for some datasets
|
||||||
href={`https://github.com/${project.owner.name}/${project.repo.name}/blob/main/datapackage.json`}
|
href={`https://github.com/${project.owner.name}/${project.repo.name}/blob/main/datapackage.json`}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
className="flex items-center hover:text-gray-700"
|
className="flex items-center hover:text-gray-700"
|
||||||
>
|
>
|
||||||
datapackage.json <ExternalLinkIcon className="ml-1" />
|
datapackage.json <ExternalLinkIcon className="ml-1" />
|
||||||
</Link>
|
</Link>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h3 className="mb-1 mt-10">Data files</h3>
|
<h3 className="mb-1 mt-10">Data files</h3>
|
||||||
<p>
|
<p>
|
||||||
This dataset contains {project.files.length} file
|
This dataset contains {project.files.length} file
|
||||||
{project.files.length == 1 ? '' : 's'}
|
{project.files.length == 1 ? '' : 's'}
|
||||||
</p>
|
</p>
|
||||||
<div className="inline-block min-w-full py-2 align-middle">
|
<div className="inline-block min-w-full py-2 align-middle">
|
||||||
<table className="mt-0 min-w-full divide-y divide-gray-300">
|
<table className="mt-0 min-w-full divide-y divide-gray-300">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Name
|
Name
|
||||||
</th>
|
</th>
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Format
|
Format
|
||||||
</th>
|
</th>
|
||||||
<th
|
<th
|
||||||
scope="col"
|
scope="col"
|
||||||
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
|
||||||
>
|
>
|
||||||
Size
|
Size
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody className="divide-y divide-gray-200">
|
<tbody className="divide-y divide-gray-200">
|
||||||
{project.files?.map((file) => {
|
{project.files?.map((file) => {
|
||||||
let size: number | string = file.size;
|
let size: number | string = file.size;
|
||||||
|
|
||||||
if (!size) {
|
if (!size) {
|
||||||
if (file.bytes) {
|
if (file.bytes) {
|
||||||
if (file.bytes > 1000000) {
|
if (file.bytes > 1000000) {
|
||||||
size = (file.bytes / 1000000).toFixed(2) + ' MB';
|
size = (file.bytes / 1000000).toFixed(2) + ' MB';
|
||||||
} else {
|
} else {
|
||||||
size = (file.bytes / 1000).toFixed(2) + ' kB';
|
size = (file.bytes / 1000).toFixed(2) + ' kB';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<tr key={file.name}>
|
<tr key={file.name}>
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
{file.name}
|
{file.name}
|
||||||
</td>
|
</td>
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
{file.format}
|
{file.format}
|
||||||
</td>
|
</td>
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
{size}
|
{size}
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
|
||||||
<Link
|
<Link
|
||||||
target="_blank"
|
target="_blank"
|
||||||
href={
|
href={
|
||||||
file.path.startsWith('http')
|
file.path.startsWith('http')
|
||||||
? file.path
|
? file.path
|
||||||
: `https://raw.githubusercontent.com/${project.owner.name}/${project.repo.name}/main/${file.path}`
|
: `https://raw.githubusercontent.com/${project.owner.name}/${project.repo.name}/main/${file.path}`
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
Download
|
Download
|
||||||
</Link>
|
</Link>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col gap-y-16 ">
|
<div className="flex flex-col gap-y-16 ">
|
||||||
{project.files?.map((file) => {
|
{project.files?.map((file) => {
|
||||||
let size: number | string = file.size;
|
let size: number | string = file.size;
|
||||||
|
|
||||||
if (!size) {
|
if (!size) {
|
||||||
if (file.bytes) {
|
if (file.bytes) {
|
||||||
if (file.bytes > 1000000) {
|
if (file.bytes > 1000000) {
|
||||||
size = (file.bytes / 1000000).toFixed(2) + ' MB';
|
size = (file.bytes / 1000000).toFixed(2) + ' MB';
|
||||||
} else {
|
} else {
|
||||||
size = (file.bytes / 1000).toFixed(2) + ' kB';
|
size = (file.bytes / 1000).toFixed(2) + ' kB';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<div key={file.name} >
|
<div key={file.name}>
|
||||||
{file.path && (
|
{file.path && (
|
||||||
<div className='lg:ml-[calc(50%-37vw)] lg:w-[74vw]'>
|
<div className="lg:ml-[calc(50%-37vw)] lg:w-[74vw]">
|
||||||
<h4>
|
<h4>
|
||||||
{file.name}
|
{file.name}
|
||||||
{file.format ? `.${file.format}` : ''}
|
{file.format ? `.${file.format}` : ''}
|
||||||
</h4>
|
</h4>
|
||||||
{file.bytes >= 5132288 && (
|
{file.bytes >= 5132288 && (
|
||||||
<span>Previewing 5MB out of {size}</span>
|
<span>Previewing 5MB out of {size}</span>
|
||||||
|
)}
|
||||||
|
<div className="mt-5">
|
||||||
|
<FlatUiTable
|
||||||
|
url={
|
||||||
|
file.path.startsWith('http')
|
||||||
|
? file.path
|
||||||
|
: `https://raw.githubusercontent.com/${project.owner.name}/${project.repo.name}/main/${file.path}`
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{readme && (
|
||||||
|
<>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<h2 className="uppercase font-black">Readme</h2>
|
||||||
|
<ReactMarkdown remarkPlugins={[remarkGfm]}>{readme}</ReactMarkdown>
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
<div className='mt-5'>
|
|
||||||
<FlatUiTable
|
|
||||||
url={
|
|
||||||
file.path.startsWith('http')
|
|
||||||
? file.path
|
|
||||||
: `https://raw.githubusercontent.com/${project.owner.name}/${project.repo.name}/main/${file.path}`
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{readme && (
|
|
||||||
<>
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<h2 className="uppercase font-black">Readme</h2>
|
|
||||||
<ReactMarkdown remarkPlugins={[remarkGfm]}>{readme}</ReactMarkdown>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</main>
|
</main>
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user