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

Skip to content

Commit b0a4ef0

Browse files
chore: replace MUI icons - 2 (#17732)
Replace icons: Check | CheckIcon KeyboardArrowDown | ChevronDownIcon KeyboardArrowUp | ChevronUpIcon
1 parent 9e44f18 commit b0a4ef0

File tree

9 files changed

+21
-24
lines changed

9 files changed

+21
-24
lines changed

site/src/components/CopyButton/CopyButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { type Interpolation, type Theme, css } from "@emotion/react";
2-
import Check from "@mui/icons-material/Check";
32
import IconButton from "@mui/material/Button";
43
import Tooltip from "@mui/material/Tooltip";
54
import { useClipboard } from "hooks/useClipboard";
5+
import { CheckIcon } from "lucide-react";
66
import { type ReactNode, forwardRef } from "react";
77
import { FileCopyIcon } from "../Icons/FileCopyIcon";
88

@@ -48,7 +48,7 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
4848
onClick={copyToClipboard}
4949
>
5050
{showCopiedSuccess ? (
51-
<Check css={styles.copyIcon} />
51+
<CheckIcon css={styles.copyIcon} />
5252
) : (
5353
<FileCopyIcon css={styles.copyIcon} />
5454
)}

site/src/components/DropdownArrow/DropdownArrow.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
3-
import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp";
2+
import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
43
import type { FC } from "react";
54

65
interface ArrowProps {
@@ -14,7 +13,7 @@ export const DropdownArrow: FC<ArrowProps> = ({
1413
color,
1514
close,
1615
}) => {
17-
const Arrow = close ? KeyboardArrowUp : KeyboardArrowDown;
16+
const Arrow = close ? ChevronUpIcon : ChevronDownIcon;
1817

1918
return (
2019
<Arrow

site/src/components/DurationField/DurationField.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
21
import FormHelperText from "@mui/material/FormHelperText";
32
import MenuItem from "@mui/material/MenuItem";
43
import Select from "@mui/material/Select";
54
import TextField, { type TextFieldProps } from "@mui/material/TextField";
5+
import { ChevronDownIcon } from "lucide-react";
66
import { type FC, useEffect, useReducer } from "react";
77
import {
88
type TimeUnit,
@@ -126,7 +126,7 @@ export const DurationField: FC<DurationFieldProps> = (props) => {
126126
});
127127
}}
128128
inputProps={{ "aria-label": "Time unit" }}
129-
IconComponent={KeyboardArrowDown}
129+
IconComponent={ChevronDownIcon}
130130
>
131131
<MenuItem value="hours">Hours</MenuItem>
132132
<MenuItem

site/src/components/Filter/Filter.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 KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
32
import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined";
43
import Button from "@mui/material/Button";
54
import Divider from "@mui/material/Divider";
@@ -15,6 +14,7 @@ import {
1514
import { InputGroup } from "components/InputGroup/InputGroup";
1615
import { SearchField } from "components/SearchField/SearchField";
1716
import { useDebouncedFunction } from "hooks/debounce";
17+
import { ChevronDownIcon } from "lucide-react";
1818
import { type FC, type ReactNode, useEffect, useRef, useState } from "react";
1919
import type { useSearchParams } from "react-router-dom";
2020

@@ -267,7 +267,7 @@ const PresetMenu: FC<PresetMenuProps> = ({
267267
<Button
268268
onClick={() => setIsOpen(true)}
269269
ref={anchorRef}
270-
endIcon={<KeyboardArrowDown />}
270+
endIcon={<ChevronDownIcon className="size-4" />}
271271
>
272272
Filters
273273
</Button>

site/src/modules/resources/PortForwardButton.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 CloseIcon from "@mui/icons-material/Close";
3-
import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
43
import LockIcon from "@mui/icons-material/Lock";
54
import LockOpenIcon from "@mui/icons-material/LockOpen";
65
import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined";
@@ -42,6 +41,7 @@ import {
4241
} from "components/deprecated/Popover/Popover";
4342
import { type FormikContextType, useFormik } from "formik";
4443
import { type ClassName, useClassName } from "hooks/useClassName";
44+
import { ChevronDownIcon } from "lucide-react";
4545
import { useDashboard } from "modules/dashboard/useDashboard";
4646
import { type FC, useState } from "react";
4747
import { useMutation, useQuery } from "react-query";
@@ -82,7 +82,7 @@ export const PortForwardButton: FC<PortForwardButtonProps> = (props) => {
8282
disabled={!portsQuery.data}
8383
size="small"
8484
variant="text"
85-
endIcon={<KeyboardArrowDown />}
85+
endIcon={<ChevronDownIcon className="size-4" />}
8686
css={{ fontSize: 13, padding: "8px 12px" }}
8787
startIcon={
8888
portsQuery.data ? (

site/src/modules/resources/SSHButton/SSHButton.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
32
import Button from "@mui/material/Button";
43
import { CodeExample } from "components/CodeExample/CodeExample";
54
import {
@@ -14,6 +13,7 @@ import {
1413
PopoverTrigger,
1514
} from "components/deprecated/Popover/Popover";
1615
import { type ClassName, useClassName } from "hooks/useClassName";
16+
import { ChevronDownIcon } from "lucide-react";
1717
import type { FC } from "react";
1818
import { docs } from "utils/docs";
1919

@@ -36,7 +36,7 @@ export const AgentSSHButton: FC<AgentSSHButtonProps> = ({
3636
<Button
3737
size="small"
3838
variant="text"
39-
endIcon={<KeyboardArrowDown />}
39+
endIcon={<ChevronDownIcon className="size-4" />}
4040
css={{ fontSize: 13, padding: "8px 12px" }}
4141
>
4242
Connect via SSH
@@ -98,7 +98,7 @@ export const AgentDevcontainerSSHButton: FC<
9898
<Button
9999
size="small"
100100
variant="text"
101-
endIcon={<KeyboardArrowDown />}
101+
endIcon={<ChevronDownIcon className="size-4" />}
102102
css={{ fontSize: 13, padding: "8px 12px" }}
103103
>
104104
Connect via SSH

site/src/modules/workspaces/WorkspaceTiming/WorkspaceTimings.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import type { Interpolation, Theme } from "@emotion/react";
2-
import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
3-
import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp";
42
import Button from "@mui/material/Button";
53
import Collapse from "@mui/material/Collapse";
64
import Skeleton from "@mui/material/Skeleton";
@@ -11,6 +9,7 @@ import type {
119
} from "api/typesGenerated";
1210
import sortBy from "lodash/sortBy";
1311
import uniqBy from "lodash/uniqBy";
12+
import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
1413
import { type FC, useState } from "react";
1514
import {
1615
type TimeRange,
@@ -102,9 +101,9 @@ export const WorkspaceTimings: FC<WorkspaceTimingsProps> = ({
102101
onClick={() => setIsOpen((o) => !o)}
103102
>
104103
{isOpen ? (
105-
<KeyboardArrowUp css={{ fontSize: 16, marginRight: 16 }} />
104+
<ChevronUpIcon css={{ width: 16, height: 16, marginRight: 16 }} />
106105
) : (
107-
<KeyboardArrowDown css={{ fontSize: 16, marginRight: 16 }} />
106+
<ChevronDownIcon css={{ width: 16, height: 16, marginRight: 16 }} />
108107
)}
109108
<span>Build timeline</span>
110109
<span

site/src/pages/WorkspacesPage/WorkspacesPageView.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import CloudQueue from "@mui/icons-material/CloudQueue";
2-
import KeyboardArrowDownOutlined from "@mui/icons-material/KeyboardArrowDownOutlined";
32
import LoadingButton from "@mui/lab/LoadingButton";
43
import { hasError, isApiValidationError } from "api/errors";
54
import type { Template, Workspace } from "api/typesGenerated";
@@ -19,7 +18,7 @@ import { PaginationHeader } from "components/PaginationWidget/PaginationHeader";
1918
import { PaginationWidgetBase } from "components/PaginationWidget/PaginationWidgetBase";
2019
import { Stack } from "components/Stack/Stack";
2120
import { TableToolbar } from "components/TableToolbar/TableToolbar";
22-
import { PlayIcon, SquareIcon, TrashIcon } from "lucide-react";
21+
import { ChevronDownIcon, PlayIcon, SquareIcon, TrashIcon } from "lucide-react";
2322
import { WorkspacesTable } from "pages/WorkspacesPage/WorkspacesTable";
2423
import type { FC } from "react";
2524
import type { UseQueryResult } from "react-query";
@@ -142,7 +141,7 @@ export const WorkspacesPageView: FC<WorkspacesPageViewProps> = ({
142141
variant="text"
143142
size="small"
144143
css={{ borderRadius: 9999, marginLeft: "auto" }}
145-
endIcon={<KeyboardArrowDownOutlined />}
144+
endIcon={<ChevronDownIcon className="size-4" />}
146145
>
147146
Actions
148147
</LoadingButton>

site/src/pages/WorkspacesPage/WorkspacesTable.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight";
21
import Star from "@mui/icons-material/Star";
32
import Checkbox from "@mui/material/Checkbox";
43
import Skeleton from "@mui/material/Skeleton";
@@ -52,6 +51,7 @@ import dayjs from "dayjs";
5251
import relativeTime from "dayjs/plugin/relativeTime";
5352
import { useAuthenticated } from "hooks";
5453
import { useClickableTableRow } from "hooks/useClickableTableRow";
54+
import { ChevronRightIcon } from "lucide-react";
5555
import {
5656
BanIcon,
5757
PlayIcon,
@@ -303,7 +303,7 @@ export const WorkspacesTable: FC<WorkspacesTableProps> = ({
303303
/>
304304
<TableCell>
305305
<div className="flex">
306-
<KeyboardArrowRight className="text-content-secondary size-icon-sm" />
306+
<ChevronRightIcon className="text-content-secondary size-icon-sm" />
307307
</div>
308308
</TableCell>
309309
</WorkspacesRow>
@@ -385,7 +385,7 @@ const TableLoader: FC<TableLoaderProps> = ({ canCheckWorkspaces }) => {
385385
</TableCell>
386386
<TableCell>
387387
<div className="flex">
388-
<KeyboardArrowRight className="text-content-disabled size-icon-sm" />
388+
<ChevronRightIcon className="text-content-disabled size-icon-sm" />
389389
</div>
390390
</TableCell>
391391
</TableRowSkeleton>

0 commit comments

Comments
 (0)