Skip to content

fix: redesign schedule bumper to handle multiple hours of change at once #4535

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 15 commits into from
Oct 14, 2022
Prev Previous commit
Next Next commit
Set hours field width
  • Loading branch information
presleyp committed Oct 11, 2022
commit 2983a19a6d8821241957930544e8d87850ec32ab
10 changes: 10 additions & 0 deletions site/src/components/WorkspaceScheduleButton/EditHours.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import Button from "@material-ui/core/Button"
import { makeStyles } from "@material-ui/core/styles"
import TextField from "@material-ui/core/TextField"
import { useState } from "react"
import { useTranslation } from "react-i18next"
Expand All @@ -10,9 +11,12 @@ interface EditHoursProps {
export const EditHours = ({ handleSubmit }: EditHoursProps): JSX.Element => {
const { t } = useTranslation("workspacePage")
const [hours, setHours] = useState(0)
const styles = useStyles()

return (
<form onSubmit={() => handleSubmit(hours)}>
<TextField
className={styles.inputField}
inputProps={{ min: 0, step: 1 }}
label={t("workspaceScheduleButton.hours")}
value={hours}
Expand All @@ -25,3 +29,9 @@ export const EditHours = ({ handleSubmit }: EditHoursProps): JSX.Element => {
</form>
)
}

const useStyles = makeStyles(() => ({
inputField: {
width: '70px'
}
}))