Skip to content

Commit 6ff6e95

Browse files
BrunoQuaresmaBrunoQuaresma
authored
chore: replace MUI icons with Lucide icons - 13 (#17831)
OpenInNew -> ExternalLinkIcon InfoOutlined -> InfoIcon CloudDownload -> CloudDownloadIcon CloudUpload -> CloudUploadIcon Compare -> GitCompareArrowsIcon SettingsEthernet -> GaugeIcon WebAsset -> AppWindowIcon
1 parent ba6690f commit 6ff6e95

File tree

6 files changed

+26
-24
lines changed

6 files changed

+26
-24
lines changed

‎site/src/modules/dashboard/DashboardLayout.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import InfoOutlined from "@mui/icons-material/InfoOutlined";
21
import Link from "@mui/material/Link";
32
import Snackbar from "@mui/material/Snackbar";
43
import { Button } from "components/Button/Button";
54
import { Loader } from "components/Loader/Loader";
65
import { useAuthenticated } from "hooks";
6+
import { InfoIcon } from "lucide-react";
77
import { AnnouncementBanners } from "modules/dashboard/AnnouncementBanners/AnnouncementBanners";
88
import { LicenseBanner } from "modules/dashboard/LicenseBanner/LicenseBanner";
99
import { type FC, type HTMLAttributes, Suspense } from "react";
@@ -74,7 +74,8 @@ export const DashboardLayout: FC = () => {
7474
}}
7575
message={
7676
<div css={{ display: "flex", gap: 16 }}>
77-
<InfoOutlined
77+
<InfoIcon
78+
className="size-icon-xs"
7879
css={(theme) => ({
7980
fontSize: 16,
8081
height: 20, // 20 is the height of the text line so we can align them

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

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
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 DownloadIcon from "@mui/icons-material/CloudDownload";
4-
import UploadIcon from "@mui/icons-material/CloudUpload";
5-
import CollectedIcon from "@mui/icons-material/Compare";
6-
import LatencyIcon from "@mui/icons-material/SettingsEthernet";
7-
import WebTerminalIcon from "@mui/icons-material/WebAsset";
83
import Button from "@mui/material/Button";
94
import Link from "@mui/material/Link";
105
import Tooltip from "@mui/material/Tooltip";
@@ -21,6 +16,11 @@ import { VSCodeIcon } from "components/Icons/VSCodeIcon";
2116
import { Stack } from "components/Stack/Stack";
2217
import dayjs from "dayjs";
2318
import { type ClassName, useClassName } from "hooks/useClassName";
19+
import { CloudDownloadIcon } from "lucide-react";
20+
import { CloudUploadIcon } from "lucide-react";
21+
import { GitCompareArrowsIcon } from "lucide-react";
22+
import { GaugeIcon } from "lucide-react";
23+
import { AppWindowIcon } from "lucide-react";
2424
import { RotateCwIcon, WrenchIcon } from "lucide-react";
2525
import { CircleAlertIcon } from "lucide-react";
2626
import prettyBytes from "pretty-bytes";
@@ -197,14 +197,14 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
197197
<div css={styles.values}>
198198
<Tooltip title="Data sent to workspaces">
199199
<div css={styles.value}>
200-
<DownloadIcon />
200+
<CloudDownloadIcon className="size-icon-xs" />
201201
{stats ? prettyBytes(stats.workspaces.rx_bytes) : "-"}
202202
</div>
203203
</Tooltip>
204204
<ValueSeparator />
205205
<Tooltip title="Data sent from workspaces">
206206
<div css={styles.value}>
207-
<UploadIcon />
207+
<CloudUploadIcon className="size-icon-xs" />
208208
{stats ? prettyBytes(stats.workspaces.tx_bytes) : "-"}
209209
</div>
210210
</Tooltip>
@@ -217,7 +217,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
217217
}
218218
>
219219
<div css={styles.value}>
220-
<LatencyIcon />
220+
<GaugeIcon className="size-icon-xs" />
221221
{displayLatency > 0 ? `${displayLatency?.toFixed(2)} ms` : "-"}
222222
</div>
223223
</Tooltip>
@@ -269,7 +269,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
269269
<ValueSeparator />
270270
<Tooltip title="Web Terminal Sessions">
271271
<div css={styles.value}>
272-
<WebTerminalIcon />
272+
<AppWindowIcon className="size-icon-xs" />
273273
{typeof stats?.session_count.reconnecting_pty === "undefined"
274274
? "-"
275275
: stats?.session_count.reconnecting_pty}
@@ -289,7 +289,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
289289
>
290290
<Tooltip title="The last time stats were aggregated. Workspaces report statistics periodically, so it may take a bit for these to update!">
291291
<div css={styles.value}>
292-
<CollectedIcon />
292+
<GitCompareArrowsIcon className="size-icon-xs" />
293293
{lastAggregated}
294294
</div>
295295
</Tooltip>

‎site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import AppsIcon from "@mui/icons-material/Apps";
44
import CheckCircle from "@mui/icons-material/CheckCircle";
55
import ErrorIcon from "@mui/icons-material/Error";
66
import InsertDriveFile from "@mui/icons-material/InsertDriveFile";
7-
import OpenInNew from "@mui/icons-material/OpenInNew";
87
import Warning from "@mui/icons-material/Warning";
98
import CircularProgress from "@mui/material/CircularProgress";
109
import type {
@@ -13,6 +12,7 @@ import type {
1312
WorkspaceAgent,
1413
WorkspaceApp,
1514
} from "api/typesGenerated";
15+
import { ExternalLinkIcon } from "lucide-react";
1616
import { useAppLink } from "modules/apps/useAppLink";
1717
import type { FC } from "react";
1818

@@ -186,13 +186,12 @@ export const WorkspaceAppStatus = ({
186186
},
187187
}}
188188
>
189-
<OpenInNew
190-
sx={{
191-
fontSize: 11,
189+
<ExternalLinkIcon
190+
className="size-icon-xs"
191+
css={{
192192
opacity: 0.7,
193-
mt: -0.125,
194193
flexShrink: 0,
195-
mr: 0.5,
194+
marginRight: 2,
196195
}}
197196
/>
198197
<span

‎site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { type Interpolation, type Theme, useTheme } from "@emotion/react";
2-
import InfoIcon from "@mui/icons-material/InfoOutlined";
32
import Link from "@mui/material/Link";
43
import Skeleton from "@mui/material/Skeleton";
54
import { getErrorDetail, getErrorMessage } from "api/errors";
@@ -16,6 +15,7 @@ import {
1615
HelpTooltipTrigger,
1716
} from "components/HelpTooltip/HelpTooltip";
1817
import { usePopover } from "components/deprecated/Popover/Popover";
18+
import { InfoIcon } from "lucide-react";
1919
import { RotateCcwIcon } from "lucide-react";
2020
import { linkToTemplate, useLinks } from "modules/navigation";
2121
import type { FC } from "react";

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

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { Interpolation, Theme } from "@emotion/react";
22
import ErrorSharp from "@mui/icons-material/ErrorSharp";
3-
import InfoOutlined from "@mui/icons-material/InfoOutlined";
43
import type { TimingStage } from "api/typesGenerated";
4+
import { InfoIcon } from "lucide-react";
55
import type { FC } from "react";
66
import { Bar, ClickableBar } from "./Chart/Bar";
77
import { Blocks } from "./Chart/Blocks";
@@ -107,7 +107,10 @@ export const StagesChart: FC<StagesChartProps> = ({
107107
<span css={styles.stageLabel}>
108108
{stage.label}
109109
<Tooltip {...stage.tooltip}>
110-
<InfoOutlined css={styles.info} />
110+
<InfoIcon
111+
className="size-icon-xs"
112+
css={styles.info}
113+
/>
111114
</Tooltip>
112115
</span>
113116
</YAxisLabel>

‎site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import type { CSSObject, Interpolation, Theme } from "@emotion/react";
2-
import InfoOutlined from "@mui/icons-material/InfoOutlined";
32
import Collapse from "@mui/material/Collapse";
43
import Link from "@mui/material/Link";
54
import TableCell from "@mui/material/TableCell";
@@ -10,6 +9,7 @@ import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
109
import { Pill } from "components/Pill/Pill";
1110
import { Stack } from "components/Stack/Stack";
1211
import { TimelineEntry } from "components/Timeline/TimelineEntry";
12+
import { InfoIcon } from "lucide-react";
1313
import { NetworkIcon } from "lucide-react";
1414
import { type FC, useState } from "react";
1515
import { Link as RouterLink } from "react-router-dom";
@@ -191,9 +191,8 @@ export const AuditLogRow: FC<AuditLogRowProps> = ({
191191
</div>
192192
}
193193
>
194-
<InfoOutlined
194+
<InfoIcon
195195
css={(theme) => ({
196-
fontSize: 20,
197196
color: theme.palette.info.light,
198197
})}
199198
/>

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