Skip to content

Commit b6d72c8

Browse files
BrunoQuaresmaBrunoQuaresma
authored
chore: replace MUI LoadingButton - 4 (#17834)
- ScheduleForm - SecurityForm - HistorySidebar - WorkspacesPageView
1 parent 35a04c7 commit b6d72c8

File tree

4 files changed

+29
-34
lines changed

4 files changed

+29
-34
lines changed

‎site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import LoadingButton from "@mui/lab/LoadingButton";
21
import MenuItem from "@mui/material/MenuItem";
32
import TextField from "@mui/material/TextField";
43
import type {
@@ -7,7 +6,9 @@ import type {
76
} from "api/typesGenerated";
87
import { Alert } from "components/Alert/Alert";
98
import { ErrorAlert } from "components/Alert/ErrorAlert";
9+
import { Button } from "components/Button/Button";
1010
import { Form, FormFields } from "components/Form/Form";
11+
import { Spinner } from "components/Spinner/Spinner";
1112
import { Stack } from "components/Stack/Stack";
1213
import { type FormikContextType, useFormik } from "formik";
1314
import { type FC, useEffect, useState } from "react";
@@ -137,14 +138,13 @@ export const ScheduleForm: FC<ScheduleFormProps> = ({
137138
/>
138139

139140
<div>
140-
<LoadingButton
141-
loading={isLoading}
141+
<Button
142142
disabled={isLoading || !initialValues.user_can_set}
143143
type="submit"
144-
variant="contained"
145144
>
145+
<Spinner loading={isLoading} />
146146
Update schedule
147-
</LoadingButton>
147+
</Button>
148148
</div>
149149
</FormFields>
150150
</Form>

‎site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.tsx

+5-7
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import LoadingButton from "@mui/lab/LoadingButton";
21
import TextField from "@mui/material/TextField";
32
import { Alert } from "components/Alert/Alert";
43
import { ErrorAlert } from "components/Alert/ErrorAlert";
4+
import { Button } from "components/Button/Button";
55
import { Form, FormFields } from "components/Form/Form";
66
import { PasswordField } from "components/PasswordField/PasswordField";
7+
import { Spinner } from "components/Spinner/Spinner";
78
import { type FormikContextType, useFormik } from "formik";
89
import type { FC } from "react";
910
import { getFormHelpers } from "utils/formUtils";
@@ -98,13 +99,10 @@ export const SecurityForm: FC<SecurityFormProps> = ({
9899
/>
99100

100101
<div>
101-
<LoadingButton
102-
loading={isLoading}
103-
type="submit"
104-
variant="contained"
105-
>
102+
<Button disabled={isLoading} type="submit">
103+
<Spinner loading={isLoading} />
106104
{Language.updatePassword}
107-
</LoadingButton>
105+
</Button>
108106
</div>
109107
</FormFields>
110108
</Form>

‎site/src/pages/WorkspacePage/HistorySidebar.tsx

+10-14
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
import ArrowDownwardOutlined from "@mui/icons-material/ArrowDownwardOutlined";
2-
import LoadingButton from "@mui/lab/LoadingButton";
32
import { infiniteWorkspaceBuilds } from "api/queries/workspaceBuilds";
43
import type { Workspace } from "api/typesGenerated";
4+
import { Button } from "components/Button/Button";
55
import {
66
Sidebar,
77
SidebarCaption,
88
SidebarItem,
99
SidebarLink,
1010
} from "components/FullPageLayout/Sidebar";
11+
import { Spinner } from "components/Spinner/Spinner";
1112
import {
1213
WorkspaceBuildData,
1314
WorkspaceBuildDataSkeleton,
@@ -46,22 +47,17 @@ export const HistorySidebar: FC<HistorySidebarProps> = ({ workspace }) => {
4647
))}
4748
{buildsQuery.hasNextPage && (
4849
<div css={{ padding: 16 }}>
49-
<LoadingButton
50-
fullWidth
50+
<Button
5151
onClick={() => buildsQuery.fetchNextPage()}
52-
loading={buildsQuery.isFetchingNextPage}
53-
loadingPosition="start"
54-
variant="outlined"
55-
color="neutral"
56-
startIcon={<ArrowDownwardOutlined />}
57-
css={{
58-
display: "inline-flex",
59-
borderRadius: "9999px",
60-
fontSize: 13,
61-
}}
52+
disabled={buildsQuery.isFetchingNextPage}
53+
variant="outline"
54+
className="w-full"
6255
>
56+
<Spinner loading={buildsQuery.isFetchingNextPage}>
57+
<ArrowDownwardOutlined />
58+
</Spinner>
6359
Show more builds
64-
</LoadingButton>
60+
</Button>
6561
</div>
6662
)}
6763
</Sidebar>

‎site/src/pages/WorkspacesPage/WorkspacesPageView.tsx

+9-8
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import CloudQueue from "@mui/icons-material/CloudQueue";
2-
import LoadingButton from "@mui/lab/LoadingButton";
32
import { hasError, isApiValidationError } from "api/errors";
43
import type { Template, Workspace } from "api/typesGenerated";
54
import { ErrorAlert } from "components/Alert/ErrorAlert";
@@ -16,6 +15,7 @@ import { Margins } from "components/Margins/Margins";
1615
import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader";
1716
import { PaginationHeader } from "components/PaginationWidget/PaginationHeader";
1817
import { PaginationWidgetBase } from "components/PaginationWidget/PaginationWidgetBase";
18+
import { Spinner } from "components/Spinner/Spinner";
1919
import { Stack } from "components/Stack/Stack";
2020
import { TableToolbar } from "components/TableToolbar/TableToolbar";
2121
import { ChevronDownIcon, PlayIcon, SquareIcon, TrashIcon } from "lucide-react";
@@ -135,16 +135,17 @@ export const WorkspacesPageView: FC<WorkspacesPageViewProps> = ({
135135

136136
<DropdownMenu>
137137
<DropdownMenuTrigger asChild>
138-
<LoadingButton
139-
loading={isRunningBatchAction}
140-
loadingPosition="end"
141-
variant="text"
142-
size="small"
138+
<Button
139+
disabled={isRunningBatchAction}
140+
variant="outline"
141+
size="sm"
143142
css={{ borderRadius: 9999, marginLeft: "auto" }}
144-
endIcon={<ChevronDownIcon className="size-4" />}
145143
>
146144
Bulk actions
147-
</LoadingButton>
145+
<Spinner loading={isRunningBatchAction}>
146+
<ChevronDownIcon className="size-4" />
147+
</Spinner>
148+
</Button>
148149
</DropdownMenuTrigger>
149150
<DropdownMenuContent align="end">
150151
<DropdownMenuItem

0 commit comments

Comments
 (0)