Skip to content

Commit 57c6b0b

Browse files
BrunoQuaresmaBrunoQuaresma
committed
chore: replace MUI icons with Lucide icons - 8
1 parent d0ab91c commit 57c6b0b

File tree

8 files changed

+34
-43
lines changed

8 files changed

+34
-43
lines changed

‎site/src/components/SelectMenu/SelectMenu.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import CheckOutlined from "@mui/icons-material/CheckOutlined";
21
import Button, { type ButtonProps } from "@mui/material/Button";
32
import MenuItem, { type MenuItemProps } from "@mui/material/MenuItem";
43
import MenuList, { type MenuListProps } from "@mui/material/MenuList";
@@ -7,6 +6,7 @@ import {
76
SearchField,
87
type SearchFieldProps,
98
} from "components/SearchField/SearchField";
9+
import { CheckIcon } from "lucide-react";
1010
import {
1111
Popover,
1212
PopoverContent,
@@ -145,11 +145,11 @@ export const SelectMenuItem: FC<MenuItemProps> = (props) => {
145145
>
146146
{props.children}
147147
{props.selected && (
148-
<CheckOutlined
149-
// TODO: Don't set the menu icon font size on default theme
150-
css={{ marginLeft: "auto", fontSize: "inherit !important" }}
148+
<CheckIcon
149+
className="size-icon-xs"
150+
css={{ marginLeft: "auto" }}
151151
/>
152152
)}
153153
</MenuItem>
154154
);
155-
};
155+
};

‎site/src/components/Sidebar/Sidebar.stories.tsx

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,4 @@
1-
import ScheduleIcon from "@mui/icons-material/EditCalendarOutlined";
2-
import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined";
3-
import SecurityIcon from "@mui/icons-material/LockOutlined";
4-
import AccountIcon from "@mui/icons-material/Person";
5-
import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined";
1+
import { CalendarCogIcon, FingerprintIcon, KeyIcon, LockIcon, UserIcon } from "lucide-react";
62
import type { Meta, StoryObj } from "@storybook/react";
73
import { Avatar } from "components/Avatar/Avatar";
84
import { Sidebar, SidebarHeader, SidebarNavItem } from "./Sidebar";
@@ -24,22 +20,22 @@ export const Default: Story = {
2420
title="Jon"
2521
subtitle="jon@coder.com"
2622
/>
27-
<SidebarNavItem href="account" icon={AccountIcon}>
23+
<SidebarNavItem href="account" icon={UserIcon}>
2824
Account
2925
</SidebarNavItem>
30-
<SidebarNavItem href="schedule" icon={ScheduleIcon}>
26+
<SidebarNavItem href="schedule" icon={CalendarCogIcon}>
3127
Schedule
3228
</SidebarNavItem>
33-
<SidebarNavItem href="security" icon={SecurityIcon}>
29+
<SidebarNavItem href="security" icon={LockIcon}>
3430
Security
3531
</SidebarNavItem>
36-
<SidebarNavItem href="ssh-keys" icon={FingerprintOutlinedIcon}>
32+
<SidebarNavItem href="ssh-keys" icon={FingerprintIcon}>
3733
SSH Keys
3834
</SidebarNavItem>
39-
<SidebarNavItem href="tokens" icon={VpnKeyOutlined}>
35+
<SidebarNavItem href="tokens" icon={KeyIcon}>
4036
Tokens
4137
</SidebarNavItem>
4238
</Sidebar>
4339
),
4440
},
45-
};
41+
};

‎site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import CheckOutlined from "@mui/icons-material/CheckOutlined";
21
import FileCopyOutlined from "@mui/icons-material/FileCopyOutlined";
32
import Button from "@mui/material/Button";
43
import FormControlLabel from "@mui/material/FormControlLabel";
54
import Radio from "@mui/material/Radio";
65
import RadioGroup from "@mui/material/RadioGroup";
76
import { API } from "api/api";
87
import type { Template, TemplateVersionParameter } from "api/typesGenerated";
8+
import { CheckIcon } from "lucide-react";
99
import { FormSection, VerticalForm } from "components/Form/Form";
1010
import { Loader } from "components/Loader/Loader";
1111
import { RichParameterInput } from "components/RichParameterInput/RichParameterInput";
@@ -187,7 +187,7 @@ export const TemplateEmbedPageView: FC<TemplateEmbedPageViewProps> = ({
187187
css={{ borderRadius: 999 }}
188188
startIcon={
189189
clipboard.showCopiedSuccess ? (
190-
<CheckOutlined />
190+
<CheckIcon className="size-icon-sm" />
191191
) : (
192192
<FileCopyOutlined />
193193
)
@@ -206,4 +206,4 @@ export const TemplateEmbedPageView: FC<TemplateEmbedPageViewProps> = ({
206206
);
207207
};
208208

209-
export default TemplateEmbedPage;
209+
export default TemplateEmbedPage;

‎site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import CheckOutlined from "@mui/icons-material/CheckOutlined";
21
import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
32
import Button from "@mui/material/Button";
43
import Menu from "@mui/material/Menu";
54
import MenuItem from "@mui/material/MenuItem";
5+
import { CheckIcon } from "lucide-react";
66
import { type FC, useRef, useState } from "react";
77

88
const insightsIntervals = {
@@ -72,7 +72,7 @@ export const IntervalMenu: FC<IntervalMenuProps> = ({ value, onChange }) => {
7272
{label}
7373
<div css={{ width: 16, height: 16 }}>
7474
{value === interval && (
75-
<CheckOutlined css={{ width: 16, height: 16 }} />
75+
<CheckIcon className="size-icon-xs" />
7676
)}
7777
</div>
7878
</MenuItem>
@@ -81,4 +81,4 @@ export const IntervalMenu: FC<IntervalMenuProps> = ({ value, onChange }) => {
8181
</Menu>
8282
</div>
8383
);
84-
};
84+
};

‎site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import CheckOutlined from "@mui/icons-material/CheckOutlined";
21
import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
32
import Button from "@mui/material/Button";
43
import Menu from "@mui/material/Menu";
54
import MenuItem from "@mui/material/MenuItem";
65
import { differenceInWeeks } from "date-fns";
6+
import { CheckIcon } from "lucide-react";
77
import { type FC, useRef, useState } from "react";
88
import type { DateRangeValue } from "./DateRange";
99
import { lastWeeks } from "./utils";
@@ -71,7 +71,7 @@ export const WeekPicker: FC<WeekPickerProps> = ({ value, onChange }) => {
7171
Last {option} weeks
7272
<div css={{ width: 16, height: 16 }}>
7373
{numberOfWeeks === option && (
74-
<CheckOutlined css={{ width: 16, height: 16 }} />
74+
<CheckIcon className="size-icon-xs" />
7575
)}
7676
</div>
7777
</MenuItem>
@@ -80,4 +80,4 @@ export const WeekPicker: FC<WeekPickerProps> = ({ value, onChange }) => {
8080
</Menu>
8181
</div>
8282
);
83-
};
83+
};

‎site/src/pages/TemplateSettingsPage/Sidebar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import VariablesIcon from "@mui/icons-material/CodeOutlined";
2-
import SecurityIcon from "@mui/icons-material/LockOutlined";
32
import GeneralIcon from "@mui/icons-material/SettingsOutlined";
43
import ScheduleIcon from "@mui/icons-material/TimerOutlined";
4+
import { LockIcon } from "lucide-react";
55
import type { Template } from "api/typesGenerated";
66
import { Avatar } from "components/Avatar/Avatar";
77
import {
@@ -35,7 +35,7 @@ export const Sidebar: FC<SidebarProps> = ({ template }) => {
3535
<SidebarNavItem href="" icon={GeneralIcon}>
3636
General
3737
</SidebarNavItem>
38-
<SidebarNavItem href="permissions" icon={SecurityIcon}>
38+
<SidebarNavItem href="permissions" icon={LockIcon}>
3939
Permissions
4040
</SidebarNavItem>
4141
<SidebarNavItem href="variables" icon={VariablesIcon}>
@@ -46,4 +46,4 @@ export const Sidebar: FC<SidebarProps> = ({ template }) => {
4646
</SidebarNavItem>
4747
</BaseSidebar>
4848
);
49-
};
49+
};

‎site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import CheckIcon from "@mui/icons-material/CheckOutlined";
21
import QueuedIcon from "@mui/icons-material/HourglassEmpty";
32
import type { TemplateVersion } from "api/typesGenerated";
43
import { Pill, PillSpinner } from "components/Pill/Pill";
5-
import { CircleAlertIcon } from "lucide-react";
4+
import { CheckIcon, CircleAlertIcon } from "lucide-react";
65
import type { FC, ReactNode } from "react";
76
import type { ThemeRole } from "theme/roles";
87
import { getPendingStatusLabel } from "utils/provisionerJob";
@@ -70,7 +69,7 @@ const getStatus = (
7069
return {
7170
type: "success",
7271
text: "Success",
73-
icon: <CheckIcon />,
72+
icon: <CheckIcon className="size-icon-sm" />,
7473
};
7574
}
76-
};
75+
};

‎site/src/pages/UserSettingsPage/Sidebar.tsx

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,6 @@
11
import AppearanceIcon from "@mui/icons-material/Brush";
2-
import ScheduleIcon from "@mui/icons-material/EditCalendarOutlined";
3-
import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined";
4-
import SecurityIcon from "@mui/icons-material/LockOutlined";
52
import NotificationsIcon from "@mui/icons-material/NotificationsNoneOutlined";
6-
import AccountIcon from "@mui/icons-material/Person";
7-
import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined";
3+
import { CalendarCogIcon, FingerprintIcon, KeyIcon, LockIcon, UserIcon } from "lucide-react";
84
import type { User } from "api/typesGenerated";
95
import { Avatar } from "components/Avatar/Avatar";
106
import { GitIcon } from "components/Icons/GitIcon";
@@ -32,7 +28,7 @@ export const Sidebar: FC<SidebarProps> = ({ user }) => {
3228
title={user.username}
3329
subtitle={user.email}
3430
/>
35-
<SidebarNavItem href="account" icon={AccountIcon}>
31+
<SidebarNavItem href="account" icon={UserIcon}>
3632
Account
3733
</SidebarNavItem>
3834
<SidebarNavItem href="appearance" icon={AppearanceIcon}>
@@ -42,22 +38,22 @@ export const Sidebar: FC<SidebarProps> = ({ user }) => {
4238
External Authentication
4339
</SidebarNavItem>
4440
{showSchedulePage && (
45-
<SidebarNavItem href="schedule" icon={ScheduleIcon}>
41+
<SidebarNavItem href="schedule" icon={CalendarCogIcon}>
4642
Schedule
4743
</SidebarNavItem>
4844
)}
49-
<SidebarNavItem href="security" icon={SecurityIcon}>
45+
<SidebarNavItem href="security" icon={LockIcon}>
5046
Security
5147
</SidebarNavItem>
52-
<SidebarNavItem href="ssh-keys" icon={FingerprintOutlinedIcon}>
48+
<SidebarNavItem href="ssh-keys" icon={FingerprintIcon}>
5349
SSH Keys
5450
</SidebarNavItem>
55-
<SidebarNavItem href="tokens" icon={VpnKeyOutlined}>
51+
<SidebarNavItem href="tokens" icon={KeyIcon}>
5652
Tokens
5753
</SidebarNavItem>
5854
<SidebarNavItem href="notifications" icon={NotificationsIcon}>
5955
Notifications
6056
</SidebarNavItem>
6157
</BaseSidebar>
6258
);
63-
};
59+
};

0 commit comments

Comments
 (0)