Fouad
e5f41731ae
* bootstrap next app + add overview page * fix AssetList type * fix up nav stuff * Refactor Nav component and add network components pages * Refactor WorldMap component and update TelegramIcon, GitHubIcon, NymVpnIcon, DiscordIcon, and TwitterIcon components * add service providers page * mixnodes page * delegations page + use material react table for all tables * nodes map page * Refactor StyledLink component and remove unnecessary console.log statements * Refactor ESLint configuration, remove unused dependencies, and update component imports * update deps * Refactor imports and update dependencies * fix dark mode * build single mixnode page * build single gateway page * Refactor handleOnDelegate function to use useCallback in mixnodes page.tsx * Add defaults for constants --------- Co-authored-by: Mark Sinclair <mmsinclair@users.noreply.github.com>
62 lines
1.3 KiB
TypeScript
62 lines
1.3 KiB
TypeScript
'use client'
|
|
|
|
import React from 'react'
|
|
import { Box, SelectChangeEvent } from '@mui/material'
|
|
import { useIsMobile } from '@/app/hooks/useIsMobile'
|
|
import { Filters } from './Filters/Filters'
|
|
|
|
const fieldsHeight = '42.25px'
|
|
|
|
type TableToolBarProps = {
|
|
childrenBefore?: React.ReactNode
|
|
childrenAfter?: React.ReactNode
|
|
}
|
|
|
|
export const TableToolbar: FCWithChildren<TableToolBarProps> = ({
|
|
childrenBefore,
|
|
childrenAfter,
|
|
}) => {
|
|
const isMobile = useIsMobile()
|
|
return (
|
|
<Box
|
|
sx={{
|
|
width: '100%',
|
|
marginBottom: 2,
|
|
display: 'flex',
|
|
flexDirection: isMobile ? 'column' : 'row',
|
|
justifyContent: 'space-between',
|
|
}}
|
|
>
|
|
<Box
|
|
sx={{
|
|
display: 'flex',
|
|
flexDirection: isMobile ? 'column-reverse' : 'row',
|
|
alignItems: 'middle',
|
|
}}
|
|
>
|
|
<Box
|
|
sx={{
|
|
display: 'flex',
|
|
justifyContent: 'space-between',
|
|
height: fieldsHeight,
|
|
}}
|
|
>
|
|
{childrenBefore}
|
|
</Box>
|
|
</Box>
|
|
|
|
<Box
|
|
sx={{
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'end',
|
|
gap: 1,
|
|
marginTop: isMobile ? 2 : 0,
|
|
}}
|
|
>
|
|
{childrenAfter}
|
|
</Box>
|
|
</Box>
|
|
)
|
|
}
|