Skip to content

Commit 446cbd4

Browse files
BrunoQuaresmaBrunoQuaresma
committed
chore: replace MUI icons with Lucide icons - 10
1 parent eb9a651 commit 446cbd4

File tree

7 files changed

+17
-21
lines changed

7 files changed

+17
-21
lines changed

‎site/src/components/Search/Search.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import SearchOutlined from "@mui/icons-material/SearchOutlined";
32
// biome-ignore lint/nursery/noRestrictedImports: use it to have the component prop
43
import Box, { type BoxProps } from "@mui/material/Box";
54
import visuallyHidden from "@mui/utils/visuallyHidden";
5+
import { SearchIcon } from "lucide-react";
66
import type { FC, HTMLAttributes, InputHTMLAttributes, Ref } from "react";
77

88
interface SearchProps extends Omit<BoxProps, "ref"> {
@@ -21,7 +21,7 @@ interface SearchProps extends Omit<BoxProps, "ref"> {
2121
export const Search: FC<SearchProps> = ({ children, $$ref, ...boxProps }) => {
2222
return (
2323
<Box ref={$$ref} {...boxProps} css={SearchStyles.container}>
24-
<SearchOutlined css={SearchStyles.icon} />
24+
<SearchIcon className="size-icon-xs" css={SearchStyles.icon} />
2525
{children}
2626
</Box>
2727
);

‎site/src/components/SearchField/SearchField.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import { useTheme } from "@emotion/react";
2-
import CloseIcon from "@mui/icons-material/CloseOutlined";
3-
import SearchIcon from "@mui/icons-material/SearchOutlined";
42
import IconButton from "@mui/material/IconButton";
53
import InputAdornment from "@mui/material/InputAdornment";
64
import TextField, { type TextFieldProps } from "@mui/material/TextField";
75
import Tooltip from "@mui/material/Tooltip";
86
import visuallyHidden from "@mui/utils/visuallyHidden";
7+
import { SearchIcon, XIcon } from "lucide-react";
98
import { type FC, useEffect, useRef } from "react";
109

1110
export type SearchFieldProps = Omit<TextFieldProps, "onChange"> & {
@@ -41,8 +40,8 @@ export const SearchField: FC<SearchFieldProps> = ({
4140
startAdornment: (
4241
<InputAdornment position="start">
4342
<SearchIcon
43+
className="size-icon-xs"
4444
css={{
45-
fontSize: 16,
4645
color: theme.palette.text.secondary,
4746
}}
4847
/>
@@ -57,7 +56,7 @@ export const SearchField: FC<SearchFieldProps> = ({
5756
onChange("");
5857
}}
5958
>
60-
<CloseIcon css={{ fontSize: 14 }} />
59+
<XIcon className="size-icon-xs" />
6160
<span css={{ ...visuallyHidden }}>Clear search</span>
6261
</IconButton>
6362
</Tooltip>

‎site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
import type { CSSInterpolation } from "@emotion/css/dist/declarations/src/create-instance";
22
import { type Interpolation, type Theme, css, useTheme } from "@emotion/react";
3-
import BuildingIcon from "@mui/icons-material/Build";
43
import DownloadIcon from "@mui/icons-material/CloudDownload";
54
import UploadIcon from "@mui/icons-material/CloudUpload";
65
import CollectedIcon from "@mui/icons-material/Compare";
7-
import RefreshIcon from "@mui/icons-material/Refresh";
86
import LatencyIcon from "@mui/icons-material/SettingsEthernet";
97
import WebTerminalIcon from "@mui/icons-material/WebAsset";
108
import Button from "@mui/material/Button";
@@ -23,6 +21,7 @@ import { VSCodeIcon } from "components/Icons/VSCodeIcon";
2321
import { Stack } from "components/Stack/Stack";
2422
import dayjs from "dayjs";
2523
import { type ClassName, useClassName } from "hooks/useClassName";
24+
import { RotateCwIcon, WrenchIcon } from "lucide-react";
2625
import { CircleAlertIcon } from "lucide-react";
2726
import prettyBytes from "pretty-bytes";
2827
import {
@@ -322,7 +321,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
322321
}}
323322
variant="text"
324323
>
325-
<RefreshIcon />
324+
<RotateCwIcon className="size-icon-xs" />
326325
{timeUntilRefresh}s
327326
</Button>
328327
</Tooltip>
@@ -344,7 +343,7 @@ const WorkspaceBuildValue: FC<WorkspaceBuildValueProps> = ({
344343
let statusText = displayStatus.text;
345344
let icon = displayStatus.icon;
346345
if (status === "starting") {
347-
icon = <BuildingIcon />;
346+
icon = <WrenchIcon className="size-icon-xs" />;
348347
statusText = "Building";
349348
}
350349

‎site/src/pages/DeploymentSettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { type Interpolation, type Theme, useTheme } from "@emotion/react";
22
import AddIcon from "@mui/icons-material/AddOutlined";
3-
import RefreshIcon from "@mui/icons-material/Refresh";
43
import LoadingButton from "@mui/lab/LoadingButton";
54
import Button from "@mui/material/Button";
65
import MuiLink from "@mui/material/Link";
@@ -15,6 +14,7 @@ import {
1514
} from "components/SettingsHeader/SettingsHeader";
1615
import { Stack } from "components/Stack/Stack";
1716
import { useWindowSize } from "hooks/useWindowSize";
17+
import { RotateCwIcon } from "lucide-react";
1818
import type { FC } from "react";
1919
import Confetti from "react-confetti";
2020
import { Link } from "react-router-dom";
@@ -84,7 +84,7 @@ const LicensesSettingsPageView: FC<Props> = ({
8484
loadingPosition="start"
8585
loading={isRefreshing}
8686
onClick={refreshEntitlements}
87-
startIcon={<RefreshIcon />}
87+
startIcon={<RotateCwIcon className="size-icon-xs" />}
8888
>
8989
Refresh
9090
</LoadingButton>

‎site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import type { Interpolation, Theme } from "@emotion/react";
22
import OpenInNewIcon from "@mui/icons-material/OpenInNew";
3-
import RefreshIcon from "@mui/icons-material/Refresh";
43
import Link from "@mui/material/Link";
54
import Tooltip from "@mui/material/Tooltip";
65
import type { ApiErrorResponse } from "api/errors";
@@ -10,6 +9,7 @@ import { Avatar } from "components/Avatar/Avatar";
109
import { GitDeviceAuth } from "components/GitDeviceAuth/GitDeviceAuth";
1110
import { SignInLayout } from "components/SignInLayout/SignInLayout";
1211
import { Welcome } from "components/Welcome/Welcome";
12+
import { RotateCwIcon } from "lucide-react";
1313
import type { FC, ReactNode } from "react";
1414

1515
export interface ExternalAuthPageViewProps {
@@ -132,7 +132,7 @@ const ExternalAuthPageView: FC<ExternalAuthPageViewProps> = ({
132132
onReauthenticate();
133133
}}
134134
>
135-
<RefreshIcon /> Reauthenticate
135+
<RotateCwIcon className="size-icon-xs" /> Reauthenticate
136136
</Link>
137137
</div>
138138
</SignInLayout>

‎site/src/pages/IconsPage/IconsPage.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import { useTheme } from "@emotion/react";
2-
import ClearIcon from "@mui/icons-material/CloseOutlined";
3-
import SearchIcon from "@mui/icons-material/SearchOutlined";
42
import IconButton from "@mui/material/IconButton";
53
import InputAdornment from "@mui/material/InputAdornment";
64
import Link from "@mui/material/Link";
@@ -15,6 +13,7 @@ import {
1513
PageHeaderTitle,
1614
} from "components/PageHeader/PageHeader";
1715
import { Stack } from "components/Stack/Stack";
16+
import { SearchIcon, XIcon } from "lucide-react";
1817
import { type FC, type ReactNode, useMemo, useState } from "react";
1918
import { Helmet } from "react-helmet-async";
2019
import {
@@ -129,8 +128,8 @@ const IconsPage: FC = () => {
129128
startAdornment: (
130129
<InputAdornment position="start">
131130
<SearchIcon
131+
className="size-icon-xs"
132132
css={{
133-
fontSize: 14,
134133
color: theme.palette.text.secondary,
135134
}}
136135
/>
@@ -143,7 +142,7 @@ const IconsPage: FC = () => {
143142
size="small"
144143
onClick={() => setSearchInputText("")}
145144
>
146-
<ClearIcon css={{ fontSize: 14 }} />
145+
<XIcon className="size-icon-xs" />
147146
</IconButton>
148147
</Tooltip>
149148
</InputAdornment>

‎site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { type Interpolation, type Theme, useTheme } from "@emotion/react";
22
import CreateIcon from "@mui/icons-material/AddOutlined";
33
import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined";
4-
import CloseOutlined from "@mui/icons-material/CloseOutlined";
54
import WarningOutlined from "@mui/icons-material/WarningOutlined";
65
import Button from "@mui/material/Button";
76
import IconButton from "@mui/material/IconButton";
@@ -27,7 +26,7 @@ import {
2726
} from "components/FullPageLayout/Topbar";
2827
import { displayError } from "components/GlobalSnackbar/utils";
2928
import { Loader } from "components/Loader/Loader";
30-
import { PlayIcon } from "lucide-react";
29+
import { PlayIcon, XIcon } from "lucide-react";
3130
import { linkToTemplate, useLinks } from "modules/navigation";
3231
import { ProvisionerAlert } from "modules/provisioners/ProvisionerAlert";
3332
import { AlertVariant } from "modules/provisioners/ProvisionerAlert";
@@ -567,7 +566,7 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
567566
borderRadius: 0,
568567
}}
569568
>
570-
<CloseOutlined css={{ width: 16, height: 16 }} />
569+
<XIcon className="size-icon-xs" />
571570
</IconButton>
572571
)}
573572
</div>

0 commit comments

Comments
 (0)