Skip to content

Commit 86da21c

Browse files
BrunoQuaresmaBrunoQuaresma
authored
chore: replace MUI icons with Lucide icons - 10 (#17797)
CloseOutlined -> XIcon SearchOutlined -> SearchIcon Refresh -> RotateCwIcon Build -> WrenchIcon
1 parent eb9a651 commit 86da21c

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)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy