mirror of https://github.com/coder/coder.git
73 lines
1.9 KiB
TypeScript
73 lines
1.9 KiB
TypeScript
import { makeStyles } from "@material-ui/core/styles"
|
|
import Table from "@material-ui/core/Table"
|
|
import TableBody from "@material-ui/core/TableBody"
|
|
import TableCell from "@material-ui/core/TableCell"
|
|
import TableContainer from "@material-ui/core/TableContainer"
|
|
import TableHead from "@material-ui/core/TableHead"
|
|
import TableRow from "@material-ui/core/TableRow"
|
|
import { DeploymentOption } from "api/types"
|
|
import {
|
|
OptionDescription,
|
|
OptionName,
|
|
OptionValue,
|
|
} from "components/DeploySettingsLayout/Option"
|
|
import { FC } from "react"
|
|
import { DisabledBadge } from "./Badges"
|
|
|
|
const OptionsTable: FC<{
|
|
options: DeploymentOption[]
|
|
}> = ({ options }) => {
|
|
const styles = useStyles()
|
|
|
|
if (options.length === 0) {
|
|
return <DisabledBadge></DisabledBadge>
|
|
}
|
|
|
|
return (
|
|
<TableContainer>
|
|
<Table className={styles.table}>
|
|
<TableHead>
|
|
<TableRow>
|
|
<TableCell width="50%">Option</TableCell>
|
|
<TableCell width="50%">Value</TableCell>
|
|
</TableRow>
|
|
</TableHead>
|
|
<TableBody>
|
|
{Object.values(options).map((option) => {
|
|
if (option.value === null || option.value === "") {
|
|
return null
|
|
}
|
|
return (
|
|
<TableRow key={option.flag}>
|
|
<TableCell>
|
|
<OptionName>{option.name}</OptionName>
|
|
<OptionDescription>{option.description}</OptionDescription>
|
|
</TableCell>
|
|
|
|
<TableCell>
|
|
<OptionValue>{option.value}</OptionValue>
|
|
</TableCell>
|
|
</TableRow>
|
|
)
|
|
})}
|
|
</TableBody>
|
|
</Table>
|
|
</TableContainer>
|
|
)
|
|
}
|
|
|
|
const useStyles = makeStyles((theme) => ({
|
|
table: {
|
|
"& td": {
|
|
paddingTop: theme.spacing(3),
|
|
paddingBottom: theme.spacing(3),
|
|
},
|
|
|
|
"& td:last-child, & th:last-child": {
|
|
paddingLeft: theme.spacing(4),
|
|
},
|
|
},
|
|
}))
|
|
|
|
export default OptionsTable
|