forks/go-ethereum
1
0
Fork 1
mirror of https://github.com/ethereum/go-ethereum.git synced 2026-04-29 04:42:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

add DataTable component

Browse source
This commit is contained in:
Corwin Smith 2022-10-07 14:37:13 -06:00
parent 8830faa9ca
commit 5153ea7f07
3 changed files with 113 additions and 109 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
src/components/UI/DataTable.tsx Normal file
View file

@ -0,0 +1,49 @@
import {
Table,
Thead,
Tr,
Th,
TableContainer,
Text,
} from '@chakra-ui/react';
import { FC } from 'react';
interface Props {
columnHeaders: string[]
}
export const DataTable: FC<Props> = ({
columnHeaders
}) => {
return (
<TableContainer>
<Table variant='unstyled'>
<Thead>
<Tr>
{
columnHeaders.map((columnHeader, idx) => {
return (
<Th
key={idx}
textTransform='none'
p={0}
minW={'130.5px'}
>
<Text
fontFamily='"JetBrains Mono", monospace'
fontWeight={700}
fontSize='md'
color='#868b87'
>
{columnHeader}
</Text>
</Th>
)
})
}
</Tr>
</Thead>
</Table>
</TableContainer>
)
}

140
src/components/UI/downloads/DownloadsTable.tsx
View file

@ -3,18 +3,13 @@ import {
Tabs, Tabs,
TabList, TabList,
Tab, Tab,
Table,
Tbody,
Thead,
Tr,
Th,
Td,
TableContainer,
Text, Text,
TabPanel, TabPanel,
TabPanels, TabPanels,
} from '@chakra-ui/react'; } from '@chakra-ui/react';
import { DataTable } from '../DataTable'
export const DownloadsTable = () => { export const DownloadsTable = () => {
return ( return (
<Stack sx={{ mt: '0 !important' }} borderBottom='2px solid #11866f'> <Stack sx={{ mt: '0 !important' }} borderBottom='2px solid #11866f'>
@ -126,84 +121,59 @@ export const DownloadsTable = () => {
</TabList> </TabList>
<TabPanels> <TabPanels>
<TabPanel> <TabPanel>
<TableContainer> <DataTable
<Table variant='unstyled'> columnHeaders={[
<Thead> 'Release',
<Tr> 'Commit',
<Th 'Kind',
textTransform='none' 'Arch',
p={0} 'Size'
minW={'130.5px'} ]}
> />
<Text </TabPanel>
fontFamily='"JetBrains Mono", monospace' <TabPanel>
fontWeight={700} <DataTable
fontSize='md' columnHeaders={[
color='#868b87' 'Release',
> 'Commit',
Release 'Kind',
</Text> 'Arch',
</Th> 'Size'
<Th ]}
textTransform='none' />
p={0} </TabPanel>
minW={'130.5px'} <TabPanel>
> <DataTable
<Text columnHeaders={[
fontFamily='"JetBrains Mono", monospace' 'Release',
fontWeight={700} 'Commit',
fontSize='md' 'Kind',
color='#868b87' 'Arch',
> 'Size'
Commit ]}
</Text> />
</Th> </TabPanel>
<Th <TabPanel>
textTransform='none' <DataTable
p={0} columnHeaders={[
minW={'130.5px'} 'Release',
> 'Commit',
<Text 'Kind',
fontFamily='"JetBrains Mono", monospace' 'Arch',
fontWeight={700} 'Size'
fontSize='md' ]}
color='#868b87' />
> </TabPanel>
Kind <TabPanel>
</Text> <DataTable
</Th> columnHeaders={[
<Th 'Release',
textTransform='none' 'Commit',
p={0} 'Kind',
minW={'130.5px'} 'Arch',
> 'Size'
<Text ]}
fontFamily='"JetBrains Mono", monospace' />
fontWeight={700}
fontSize='md'
color='#868b87'
>
Arch
</Text>
</Th>
<Th
textTransform='none'
p={0}
minW={'130.5px'}
>
<Text
fontFamily='"JetBrains Mono", monospace'
fontWeight={700}
fontSize='md'
color='#868b87'
>
Size
</Text>
</Th>
</Tr>
</Thead>
</Table>
</TableContainer>
</TabPanel> </TabPanel>
</TabPanels> </TabPanels>
</Tabs> </Tabs>

33
src/pages/downloads.tsx
View file

@ -17,6 +17,7 @@ import {
DownloadsSection, DownloadsSection,
DownloadsTable, DownloadsTable,
} from '../components/UI/downloads'; } from '../components/UI/downloads';
import { DataTable } from '../components/UI/DataTable';
import { import {
GETH_REPO_URL GETH_REPO_URL
@ -200,30 +201,14 @@ const DownloadsPage: NextPage = ({}) => {
</Stack> </Stack>
<Stack p={4}> <Stack p={4}>
<Table> <DataTable
<Tr> columnHeaders={[
<Th> 'Build Server',
<Text fontFamily='"Inter", sans-serif' lineHeight='26px' color="#8F8F8F"> 'UniqueID',
Build Server 'OpenPGP Key',
</Text> 'Fingerprint'
</Th> ]}
<Th> />
<Text fontFamily='"Inter", sans-serif' lineHeight='26px' color="#8F8F8F">
UniqueID
</Text>
</Th>
<Th>
<Text fontFamily='"Inter", sans-serif' lineHeight='26px' color="#8F8F8F">
OpenPGP Key
</Text>
</Th>
<Th>
<Text fontFamily='"Inter", sans-serif' lineHeight='26px' color="#8F8F8F">
Fingerprint
</Text>
</Th>
</Tr>
</Table>
</Stack> </Stack>
</DownloadsSection> </DownloadsSection>