add test data and table styles
This commit is contained in:
parent
5153ea7f07
commit
ac622c103d
@ -5,20 +5,39 @@ import {
|
||||
Th,
|
||||
TableContainer,
|
||||
Text,
|
||||
Tbody,
|
||||
Td,
|
||||
} from '@chakra-ui/react';
|
||||
import { FC } from 'react';
|
||||
|
||||
interface Props {
|
||||
columnHeaders: string[]
|
||||
data: any
|
||||
}
|
||||
|
||||
export const DataTable: FC<Props> = ({
|
||||
columnHeaders
|
||||
columnHeaders,
|
||||
data,
|
||||
}) => {
|
||||
return (
|
||||
<TableContainer>
|
||||
<Table variant='unstyled'>
|
||||
<Thead>
|
||||
<TableContainer
|
||||
css={{
|
||||
"&::-webkit-scrollbar": {
|
||||
background: "#d7f5ef",
|
||||
borderTop: '2px solid #11866f',
|
||||
height: 18
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb": {
|
||||
background: "#11866f",
|
||||
},
|
||||
}}
|
||||
p={4}
|
||||
>
|
||||
<Table
|
||||
variant='unstyled'
|
||||
>
|
||||
<Thead
|
||||
>
|
||||
<Tr>
|
||||
{
|
||||
columnHeaders.map((columnHeader, idx) => {
|
||||
@ -43,6 +62,30 @@ export const DataTable: FC<Props> = ({
|
||||
}
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{
|
||||
data.map((item: any, idx: number) => {
|
||||
return (
|
||||
<Tr
|
||||
key={idx}
|
||||
>
|
||||
{
|
||||
columnHeaders.map((columnHeader, idx) => {
|
||||
return (
|
||||
<Td
|
||||
key={idx}
|
||||
px={0}
|
||||
>
|
||||
{item[columnHeader.toLowerCase()]}
|
||||
</Td>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Tr>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Tbody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
)
|
||||
|
@ -10,6 +10,8 @@ import {
|
||||
|
||||
import { DataTable } from '../DataTable'
|
||||
|
||||
import { testDownloadData } from '../../../data/test/download-testdata'
|
||||
|
||||
export const DownloadsTable = () => {
|
||||
return (
|
||||
<Stack sx={{ mt: '0 !important' }} borderBottom='2px solid #11866f'>
|
||||
@ -120,59 +122,69 @@ export const DownloadsTable = () => {
|
||||
</Tab>
|
||||
</TabList>
|
||||
<TabPanels>
|
||||
<TabPanel>
|
||||
<TabPanel p={0}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Release',
|
||||
'Commit',
|
||||
'Kind',
|
||||
'Arch',
|
||||
'Size'
|
||||
'Size',
|
||||
'Published'
|
||||
]}
|
||||
data={testDownloadData}
|
||||
/>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<TabPanel p={0}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Release',
|
||||
'Commit',
|
||||
'Kind',
|
||||
'Arch',
|
||||
'Size'
|
||||
'Size',
|
||||
'Published'
|
||||
]}
|
||||
data={testDownloadData}
|
||||
/>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<TabPanel p={0}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Release',
|
||||
'Commit',
|
||||
'Kind',
|
||||
'Arch',
|
||||
'Size'
|
||||
'Size',
|
||||
'Published'
|
||||
]}
|
||||
data={testDownloadData}
|
||||
/>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<TabPanel p={0}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Release',
|
||||
'Commit',
|
||||
'Kind',
|
||||
'Arch',
|
||||
'Size'
|
||||
'Size',
|
||||
'Published'
|
||||
]}
|
||||
data={testDownloadData}
|
||||
/>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<TabPanel p={0}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Release',
|
||||
'Commit',
|
||||
'Kind',
|
||||
'Arch',
|
||||
'Size'
|
||||
'Size',
|
||||
'Published'
|
||||
]}
|
||||
data={testDownloadData}
|
||||
/>
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
|
98
src/data/test/download-testdata.ts
Normal file
98
src/data/test/download-testdata.ts
Normal file
@ -0,0 +1,98 @@
|
||||
export const testDownloadData = [
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
{
|
||||
release: 'Geth 1.10.23',
|
||||
commit: 'd901d853…',
|
||||
kind: 'archive',
|
||||
arch: '64-bit',
|
||||
size: '11.71 MB',
|
||||
published: 'Last Wednesday at 11:11 AM'
|
||||
},
|
||||
]
|
@ -4,9 +4,6 @@ import {
|
||||
Link,
|
||||
ListItem,
|
||||
Stack,
|
||||
Table,
|
||||
Th,
|
||||
Tr,
|
||||
Text,
|
||||
UnorderedList,
|
||||
} from '@chakra-ui/react';
|
||||
@ -200,7 +197,7 @@ const DownloadsPage: NextPage = ({}) => {
|
||||
</Text>
|
||||
</Stack>
|
||||
|
||||
<Stack p={4}>
|
||||
{/* <Stack p={4}>
|
||||
<DataTable
|
||||
columnHeaders={[
|
||||
'Build Server',
|
||||
@ -209,7 +206,7 @@ const DownloadsPage: NextPage = ({}) => {
|
||||
'Fingerprint'
|
||||
]}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack> */}
|
||||
</DownloadsSection>
|
||||
|
||||
<DownloadsSection sectionTitle='Importing keys and verifying builds'>
|
||||
|
Loading…
Reference in New Issue
Block a user