From 446cbd4e6b18b4d3ab0f1d8caa075cc7fa88c888 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Tue, 13 May 2025 14:27:52 +0000 Subject: [PATCH] chore: replace MUI icons with Lucide icons - 10 --- site/src/components/Search/Search.tsx | 4 ++-- site/src/components/SearchField/SearchField.tsx | 7 +++---- .../dashboard/DeploymentBanner/DeploymentBannerView.tsx | 7 +++---- .../LicensesSettingsPage/LicensesSettingsPageView.tsx | 4 ++-- site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx | 4 ++-- site/src/pages/IconsPage/IconsPage.tsx | 7 +++---- .../TemplateVersionEditorPage/TemplateVersionEditor.tsx | 5 ++--- 7 files changed, 17 insertions(+), 21 deletions(-) diff --git a/site/src/components/Search/Search.tsx b/site/src/components/Search/Search.tsx index fa258537cff2e..41b2655638c39 100644 --- a/site/src/components/Search/Search.tsx +++ b/site/src/components/Search/Search.tsx @@ -1,8 +1,8 @@ import type { Interpolation, Theme } from "@emotion/react"; -import SearchOutlined from "@mui/icons-material/SearchOutlined"; // biome-ignore lint/nursery/noRestrictedImports: use it to have the component prop import Box, { type BoxProps } from "@mui/material/Box"; import visuallyHidden from "@mui/utils/visuallyHidden"; +import { SearchIcon } from "lucide-react"; import type { FC, HTMLAttributes, InputHTMLAttributes, Ref } from "react"; interface SearchProps extends Omit { @@ -21,7 +21,7 @@ interface SearchProps extends Omit { export const Search: FC = ({ children, $$ref, ...boxProps }) => { return ( - + {children} ); diff --git a/site/src/components/SearchField/SearchField.tsx b/site/src/components/SearchField/SearchField.tsx index 2ce66d9b3ca78..c47b35f6fcc28 100644 --- a/site/src/components/SearchField/SearchField.tsx +++ b/site/src/components/SearchField/SearchField.tsx @@ -1,11 +1,10 @@ import { useTheme } from "@emotion/react"; -import CloseIcon from "@mui/icons-material/CloseOutlined"; -import SearchIcon from "@mui/icons-material/SearchOutlined"; import IconButton from "@mui/material/IconButton"; import InputAdornment from "@mui/material/InputAdornment"; import TextField, { type TextFieldProps } from "@mui/material/TextField"; import Tooltip from "@mui/material/Tooltip"; import visuallyHidden from "@mui/utils/visuallyHidden"; +import { SearchIcon, XIcon } from "lucide-react"; import { type FC, useEffect, useRef } from "react"; export type SearchFieldProps = Omit & { @@ -41,8 +40,8 @@ export const SearchField: FC = ({ startAdornment: ( @@ -57,7 +56,7 @@ export const SearchField: FC = ({ onChange(""); }} > - + Clear search diff --git a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx index c4e313d103f02..13bdaafef4a70 100644 --- a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx +++ b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx @@ -1,10 +1,8 @@ import type { CSSInterpolation } from "@emotion/css/dist/declarations/src/create-instance"; import { type Interpolation, type Theme, css, useTheme } from "@emotion/react"; -import BuildingIcon from "@mui/icons-material/Build"; import DownloadIcon from "@mui/icons-material/CloudDownload"; import UploadIcon from "@mui/icons-material/CloudUpload"; import CollectedIcon from "@mui/icons-material/Compare"; -import RefreshIcon from "@mui/icons-material/Refresh"; import LatencyIcon from "@mui/icons-material/SettingsEthernet"; import WebTerminalIcon from "@mui/icons-material/WebAsset"; import Button from "@mui/material/Button"; @@ -23,6 +21,7 @@ import { VSCodeIcon } from "components/Icons/VSCodeIcon"; import { Stack } from "components/Stack/Stack"; import dayjs from "dayjs"; import { type ClassName, useClassName } from "hooks/useClassName"; +import { RotateCwIcon, WrenchIcon } from "lucide-react"; import { CircleAlertIcon } from "lucide-react"; import prettyBytes from "pretty-bytes"; import { @@ -322,7 +321,7 @@ export const DeploymentBannerView: FC = ({ }} variant="text" > - + {timeUntilRefresh}s @@ -344,7 +343,7 @@ const WorkspaceBuildValue: FC = ({ let statusText = displayStatus.text; let icon = displayStatus.icon; if (status === "starting") { - icon = ; + icon = ; statusText = "Building"; } diff --git a/site/src/pages/DeploymentSettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx b/site/src/pages/DeploymentSettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx index c4152c7b8f565..a7d39d8536c62 100644 --- a/site/src/pages/DeploymentSettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx +++ b/site/src/pages/DeploymentSettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx @@ -1,6 +1,5 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import AddIcon from "@mui/icons-material/AddOutlined"; -import RefreshIcon from "@mui/icons-material/Refresh"; import LoadingButton from "@mui/lab/LoadingButton"; import Button from "@mui/material/Button"; import MuiLink from "@mui/material/Link"; @@ -15,6 +14,7 @@ import { } from "components/SettingsHeader/SettingsHeader"; import { Stack } from "components/Stack/Stack"; import { useWindowSize } from "hooks/useWindowSize"; +import { RotateCwIcon } from "lucide-react"; import type { FC } from "react"; import Confetti from "react-confetti"; import { Link } from "react-router-dom"; @@ -84,7 +84,7 @@ const LicensesSettingsPageView: FC = ({ loadingPosition="start" loading={isRefreshing} onClick={refreshEntitlements} - startIcon={} + startIcon={} > Refresh diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx index fd379bf0121fa..32809fb08cc7b 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx @@ -1,6 +1,5 @@ import type { Interpolation, Theme } from "@emotion/react"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; -import RefreshIcon from "@mui/icons-material/Refresh"; import Link from "@mui/material/Link"; import Tooltip from "@mui/material/Tooltip"; import type { ApiErrorResponse } from "api/errors"; @@ -10,6 +9,7 @@ import { Avatar } from "components/Avatar/Avatar"; import { GitDeviceAuth } from "components/GitDeviceAuth/GitDeviceAuth"; import { SignInLayout } from "components/SignInLayout/SignInLayout"; import { Welcome } from "components/Welcome/Welcome"; +import { RotateCwIcon } from "lucide-react"; import type { FC, ReactNode } from "react"; export interface ExternalAuthPageViewProps { @@ -132,7 +132,7 @@ const ExternalAuthPageView: FC = ({ onReauthenticate(); }} > - Reauthenticate + Reauthenticate diff --git a/site/src/pages/IconsPage/IconsPage.tsx b/site/src/pages/IconsPage/IconsPage.tsx index 96c6dd4c459e3..d9dc19c784b57 100644 --- a/site/src/pages/IconsPage/IconsPage.tsx +++ b/site/src/pages/IconsPage/IconsPage.tsx @@ -1,6 +1,4 @@ import { useTheme } from "@emotion/react"; -import ClearIcon from "@mui/icons-material/CloseOutlined"; -import SearchIcon from "@mui/icons-material/SearchOutlined"; import IconButton from "@mui/material/IconButton"; import InputAdornment from "@mui/material/InputAdornment"; import Link from "@mui/material/Link"; @@ -15,6 +13,7 @@ import { PageHeaderTitle, } from "components/PageHeader/PageHeader"; import { Stack } from "components/Stack/Stack"; +import { SearchIcon, XIcon } from "lucide-react"; import { type FC, type ReactNode, useMemo, useState } from "react"; import { Helmet } from "react-helmet-async"; import { @@ -129,8 +128,8 @@ const IconsPage: FC = () => { startAdornment: ( @@ -143,7 +142,7 @@ const IconsPage: FC = () => { size="small" onClick={() => setSearchInputText("")} > - + diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx index 00fcc5f29e6c8..2040fab3878d9 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx @@ -1,7 +1,6 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import CreateIcon from "@mui/icons-material/AddOutlined"; import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; -import CloseOutlined from "@mui/icons-material/CloseOutlined"; import WarningOutlined from "@mui/icons-material/WarningOutlined"; import Button from "@mui/material/Button"; import IconButton from "@mui/material/IconButton"; @@ -27,7 +26,7 @@ import { } from "components/FullPageLayout/Topbar"; import { displayError } from "components/GlobalSnackbar/utils"; import { Loader } from "components/Loader/Loader"; -import { PlayIcon } from "lucide-react"; +import { PlayIcon, XIcon } from "lucide-react"; import { linkToTemplate, useLinks } from "modules/navigation"; import { ProvisionerAlert } from "modules/provisioners/ProvisionerAlert"; import { AlertVariant } from "modules/provisioners/ProvisionerAlert"; @@ -567,7 +566,7 @@ export const TemplateVersionEditor: FC = ({ borderRadius: 0, }} > - + )}