Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 3011eca

Browse files
BrunoQuaresmaBrunoQuaresma
authored
chore: replace MUI icons with Lucide icons - 16 (#17862)
Close -> XIcon WarningOutlined -> TriangleAlertIcon FileCopyOutlined -> CopyIcon KeyboardArrowRight -> ChevronRightIcon Add -> PlusIcon Send -> SendIcon ChevronRight -> ChevronRightIcon MoreHorizOutlined -> EllipsisIcon
1 parent 952c254 commit 3011eca

File tree

19 files changed

+39
-57
lines changed

19 files changed

+39
-57
lines changed

‎site/src/modules/provisioners/ProvisionerTag.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import CloseIcon from "@mui/icons-material/Close";
32
import IconButton from "@mui/material/IconButton";
43
import { Pill } from "components/Pill/Pill";
5-
import { CircleCheck as CircleCheckIcon } from "lucide-react";
6-
import { CircleMinus as CircleMinusIcon } from "lucide-react";
7-
import { Tag as TagIcon } from "lucide-react";
4+
import { CircleCheckIcon, CircleMinusIcon, TagIcon, XIcon } from "lucide-react";
85
import type { ComponentProps, FC } from "react";
96

107
const parseBool = (s: string): { valid: boolean; value: boolean } => {
@@ -51,7 +48,7 @@ export const ProvisionerTag: FC<ProvisionerTagProps> = ({
5148
onDelete(tagName);
5249
}}
5350
>
54-
<CloseIcon fontSize="inherit" css={{ width: 14, height: 14 }} />
51+
<XIcon className="size-icon-xs" />
5552
<span className="sr-only">Delete {tagName}</span>
5653
</IconButton>
5754
</>

‎site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import { css } from "@emotion/react";
2-
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
32
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
43
import FormatAlignLeftOutlined from "@mui/icons-material/FormatAlignLeftOutlined";
54
import Menu from "@mui/material/Menu";
65
import MenuItem from "@mui/material/MenuItem";
76
import { SimpleTreeView, TreeItem } from "@mui/x-tree-view";
87
import { DockerIcon } from "components/Icons/DockerIcon";
8+
import { ChevronRightIcon } from "lucide-react";
99
import { type CSSProperties, type ElementType, type FC, useState } from "react";
1010
import type { FileTree } from "utils/filetree";
1111

‎site/src/modules/workspaces/WorkspaceTiming/Chart/Blocks.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import MoreHorizOutlined from "@mui/icons-material/MoreHorizOutlined";
2+
import { EllipsisIcon } from "lucide-react";
33
import { type FC, useEffect, useRef, useState } from "react";
44

55
const spaceBetweenBlocks = 4;
@@ -37,7 +37,7 @@ export const Blocks: FC<BlocksProps> = ({ count }) => {
3737
))}
3838
{!hasSpacing && (
3939
<div css={styles.more}>
40-
<MoreHorizOutlined />
40+
<EllipsisIcon className="size-icon-sm" />
4141
</div>
4242
)}
4343
</div>

‎site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import ChevronRight from "@mui/icons-material/ChevronRight";
32
import {
43
SearchField,
54
type SearchFieldProps,
65
} from "components/SearchField/SearchField";
6+
import { ChevronRightIcon } from "lucide-react";
77
import type { FC, HTMLProps } from "react";
88
import React, { useEffect, useRef } from "react";
99
import type { BarColors } from "./Bar";
@@ -81,7 +81,7 @@ export const ChartBreadcrumbs: FC<ChartBreadcrumbsProps> = ({
8181
</li>
8282
{!isLast && (
8383
<li role="presentation">
84-
<ChevronRight />
84+
<ChevronRightIcon />
8585
</li>
8686
)}
8787
</React.Fragment>

‎site/src/pages/ChatPage/ChatLanding.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { useTheme } from "@emotion/react";
2-
import SendIcon from "@mui/icons-material/Send";
32
import Button from "@mui/material/Button";
43
import IconButton from "@mui/material/IconButton";
54
import Paper from "@mui/material/Paper";
@@ -9,6 +8,7 @@ import { createChat } from "api/queries/chats";
98
import type { Chat } from "api/typesGenerated";
109
import { Margins } from "components/Margins/Margins";
1110
import { useAuthenticated } from "hooks";
11+
import { SendIcon } from "lucide-react";
1212
import { type FC, type FormEvent, useState } from "react";
1313
import { useMutation, useQueryClient } from "react-query";
1414
import { useNavigate } from "react-router-dom";

‎site/src/pages/ChatPage/ChatLayout.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { useTheme } from "@emotion/react";
2-
import AddIcon from "@mui/icons-material/Add";
32
import Button from "@mui/material/Button";
43
import List from "@mui/material/List";
54
import ListItem from "@mui/material/ListItem";
@@ -13,6 +12,7 @@ import { ErrorAlert } from "components/Alert/ErrorAlert";
1312
import { Loader } from "components/Loader/Loader";
1413
import { Margins } from "components/Margins/Margins";
1514
import { useAgenticChat } from "contexts/useAgenticChat";
15+
import { PlusIcon } from "lucide-react";
1616
import {
1717
type FC,
1818
type PropsWithChildren,
@@ -169,7 +169,7 @@ export const ChatLayout: FC = () => {
169169
<Button
170170
variant="outlined"
171171
size="small"
172-
startIcon={<AddIcon fontSize="small" />}
172+
startIcon={<PlusIcon className="size-icon-sm" />}
173173
onClick={handleNewChat}
174174
disabled={createChatMutation.isLoading}
175175
css={{

‎site/src/pages/ChatPage/ChatMessages.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import { type Message, useChat } from "@ai-sdk/react";
22
import { type Theme, keyframes, useTheme } from "@emotion/react";
3-
import SendIcon from "@mui/icons-material/Send";
43
import IconButton from "@mui/material/IconButton";
54
import Paper from "@mui/material/Paper";
65
import TextField from "@mui/material/TextField";
76
import { getChatMessages } from "api/queries/chats";
87
import type { ChatMessage, CreateChatMessageRequest } from "api/typesGenerated";
98
import { ErrorAlert } from "components/Alert/ErrorAlert";
109
import { Loader } from "components/Loader/Loader";
10+
import { SendIcon } from "lucide-react";
1111
import {
1212
type FC,
1313
type KeyboardEvent,

‎site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import WarningOutlined from "@mui/icons-material/WarningOutlined";
32
import Button from "@mui/material/Button";
43
import Drawer from "@mui/material/Drawer";
54
import IconButton from "@mui/material/IconButton";
65
import { visuallyHidden } from "@mui/utils";
76
import { JobError } from "api/queries/templates";
87
import type { TemplateVersion } from "api/typesGenerated";
98
import { Loader } from "components/Loader/Loader";
10-
import { X as XIcon } from "lucide-react";
9+
import { TriangleAlertIcon, XIcon } from "lucide-react";
1110
import { AlertVariant } from "modules/provisioners/ProvisionerAlert";
1211
import { ProvisionerStatusAlert } from "modules/provisioners/ProvisionerStatusAlert";
1312
import { useWatchVersionLogs } from "modules/templates/useWatchVersionLogs";
@@ -66,7 +65,7 @@ export const BuildLogsDrawer: FC<BuildLogsDrawerProps> = ({
6665
<header css={styles.header}>
6766
<h3 css={styles.title}>Creating template...</h3>
6867
<IconButton size="small" onClick={drawerProps.onClose}>
69-
<XIcon css={styles.closeIcon} />
68+
<XIcon className="size-icon-sm" />
7069
<span style={visuallyHidden}>Close build logs</span>
7170
</IconButton>
7271
</header>
@@ -113,7 +112,7 @@ const MissingVariablesBanner: FC<MissingVariablesBannerProps> = ({
113112
return (
114113
<div css={bannerStyles.root}>
115114
<div css={bannerStyles.content}>
116-
<WarningOutlined css={bannerStyles.icon} />
115+
<TriangleAlertIcon className="size-icon-lg" css={bannerStyles.icon} />
117116
<h4 css={bannerStyles.title}>Missing variables</h4>
118117
<p css={bannerStyles.description}>
119118
During the build process, we identified some missing variables. Rest
@@ -152,9 +151,6 @@ const styles = {
152151
fontWeight: 500,
153152
fontSize: 16,
154153
},
155-
closeIcon: {
156-
fontSize: 20,
157-
},
158154
logs: (theme) => ({
159155
flex: 1,
160156
overflow: "auto",
@@ -177,7 +173,6 @@ const bannerStyles = {
177173
maxWidth: 360,
178174
},
179175
icon: (theme) => ({
180-
fontSize: 32,
181176
color: theme.roles.warning.fill.outline,
182177
}),
183178
title: {

‎site/src/pages/DeploymentSettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { type Interpolation, type Theme, useTheme } from "@emotion/react";
2-
import CopyIcon from "@mui/icons-material/FileCopyOutlined";
32
import Divider from "@mui/material/Divider";
43
import Table from "@mui/material/Table";
54
import TableBody from "@mui/material/TableBody";
@@ -24,6 +23,7 @@ import {
2423
import { Spinner } from "components/Spinner/Spinner";
2524
import { Stack } from "components/Stack/Stack";
2625
import { TableLoader } from "components/TableLoader/TableLoader";
26+
import { CopyIcon } from "lucide-react";
2727
import { ChevronLeftIcon } from "lucide-react";
2828
import { type FC, useState } from "react";
2929
import { Link as RouterLink, useSearchParams } from "react-router-dom";
@@ -149,21 +149,20 @@ export const EditOAuth2AppPageView: FC<EditOAuth2AppProps> = ({
149149
<dt>Client ID</dt>
150150
<dd>
151151
<CopyableValue value={app.id}>
152-
{app.id} <CopyIcon css={{ width: 16, height: 16 }} />
152+
{app.id} <CopyIcon className="size-icon-xs" />
153153
</CopyableValue>
154154
</dd>
155155
<dt>Authorization URL</dt>
156156
<dd>
157157
<CopyableValue value={app.endpoints.authorization}>
158158
{app.endpoints.authorization}{" "}
159-
<CopyIcon css={{ width: 16, height: 16 }} />
159+
<CopyIcon className="size-icon-xs" />
160160
</CopyableValue>
161161
</dd>
162162
<dt>Token URL</dt>
163163
<dd>
164164
<CopyableValue value={app.endpoints.token}>
165-
{app.endpoints.token}{" "}
166-
<CopyIcon css={{ width: 16, height: 16 }} />
165+
{app.endpoints.token} <CopyIcon className="size-icon-xs" />
167166
</CopyableValue>
168167
</dd>
169168
</dl>

‎site/src/pages/DeploymentSettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPageView.tsx

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { useTheme } from "@emotion/react";
2-
import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight";
32
import Button from "@mui/material/Button";
43
import Table from "@mui/material/Table";
54
import TableBody from "@mui/material/TableBody";
@@ -18,7 +17,7 @@ import {
1817
import { Stack } from "components/Stack/Stack";
1918
import { TableLoader } from "components/TableLoader/TableLoader";
2019
import { useClickableTableRow } from "hooks/useClickableTableRow";
21-
import { PlusIcon } from "lucide-react";
20+
import { ChevronRightIcon, PlusIcon } from "lucide-react";
2221
import type { FC } from "react";
2322
import { Link, useNavigate } from "react-router-dom";
2423

@@ -111,13 +110,7 @@ const OAuth2AppRow: FC<OAuth2AppRowProps> = ({ app }) => {
111110

112111
<TableCell>
113112
<div css={{ display: "flex", paddingLeft: 16 }}>
114-
<KeyboardArrowRight
115-
css={{
116-
color: theme.palette.text.secondary,
117-
width: 20,
118-
height: 20,
119-
}}
120-
/>
113+
<ChevronRightIcon className="size-icon-sm" />
121114
</div>
122115
</TableCell>
123116
</TableRow>

0 commit comments

Comments
 (0)