From 42f618af8df3377ec5daf6afa2a9f912e8558675 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Thu, 15 May 2025 17:39:32 +0000 Subject: [PATCH 1/2] chore: replace MUI icons with Lucide icons - 16 --- site/src/modules/provisioners/ProvisionerTag.tsx | 7 ++----- .../templates/TemplateFiles/TemplateFileTree.tsx | 2 +- .../workspaces/WorkspaceTiming/Chart/Blocks.tsx | 4 ++-- .../workspaces/WorkspaceTiming/Chart/Chart.tsx | 4 ++-- site/src/pages/ChatPage/ChatLanding.tsx | 2 +- site/src/pages/ChatPage/ChatLayout.tsx | 4 ++-- site/src/pages/ChatPage/ChatMessages.tsx | 2 +- site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx | 11 +++-------- .../OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx | 9 ++++----- .../OAuth2AppsSettingsPageView.tsx | 11 ++--------- site/src/pages/GroupsPage/GroupPage.tsx | 4 ++-- site/src/pages/GroupsPage/GroupsPage.tsx | 4 ++-- site/src/pages/GroupsPage/GroupsPageView.tsx | 5 ++--- .../OrganizationMembersPageView.tsx | 4 ++-- .../TemplateEmbedPage/TemplateEmbedPage.tsx | 5 ++--- site/src/pages/TemplatePage/TemplatePageHeader.tsx | 4 ++-- .../TemplatePermissionsPageView.tsx | 4 ++-- .../TemplateVersionEditor.tsx | 6 +++--- .../TemplateVersionPage/TemplateVersionPageView.tsx | 4 ++-- 19 files changed, 39 insertions(+), 57 deletions(-) diff --git a/site/src/modules/provisioners/ProvisionerTag.tsx b/site/src/modules/provisioners/ProvisionerTag.tsx index 94467497cfa1b..62806edc4c15e 100644 --- a/site/src/modules/provisioners/ProvisionerTag.tsx +++ b/site/src/modules/provisioners/ProvisionerTag.tsx @@ -1,10 +1,7 @@ import type { Interpolation, Theme } from "@emotion/react"; -import CloseIcon from "@mui/icons-material/Close"; import IconButton from "@mui/material/IconButton"; import { Pill } from "components/Pill/Pill"; -import { CircleCheck as CircleCheckIcon } from "lucide-react"; -import { CircleMinus as CircleMinusIcon } from "lucide-react"; -import { Tag as TagIcon } from "lucide-react"; +import { CircleCheckIcon, CircleMinusIcon, TagIcon, XIcon } from "lucide-react"; import type { ComponentProps, FC } from "react"; const parseBool = (s: string): { valid: boolean; value: boolean } => { @@ -51,7 +48,7 @@ export const ProvisionerTag: FC = ({ onDelete(tagName); }} > - + Delete {tagName} diff --git a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx index cfebbd81eee11..7c61519574254 100644 --- a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx +++ b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx @@ -1,11 +1,11 @@ import { css } from "@emotion/react"; -import ChevronRightIcon from "@mui/icons-material/ChevronRight"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; import FormatAlignLeftOutlined from "@mui/icons-material/FormatAlignLeftOutlined"; import Menu from "@mui/material/Menu"; import MenuItem from "@mui/material/MenuItem"; import { SimpleTreeView, TreeItem } from "@mui/x-tree-view"; import { DockerIcon } from "components/Icons/DockerIcon"; +import { ChevronRightIcon } from "lucide-react"; import { type CSSProperties, type ElementType, type FC, useState } from "react"; import type { FileTree } from "utils/filetree"; diff --git a/site/src/modules/workspaces/WorkspaceTiming/Chart/Blocks.tsx b/site/src/modules/workspaces/WorkspaceTiming/Chart/Blocks.tsx index 00660c39f495c..0d7e1c2fbaaa5 100644 --- a/site/src/modules/workspaces/WorkspaceTiming/Chart/Blocks.tsx +++ b/site/src/modules/workspaces/WorkspaceTiming/Chart/Blocks.tsx @@ -1,5 +1,5 @@ import type { Interpolation, Theme } from "@emotion/react"; -import MoreHorizOutlined from "@mui/icons-material/MoreHorizOutlined"; +import { EllipsisIcon } from "lucide-react"; import { type FC, useEffect, useRef, useState } from "react"; const spaceBetweenBlocks = 4; @@ -37,7 +37,7 @@ export const Blocks: FC = ({ count }) => { ))} {!hasSpacing && (
- +
)} diff --git a/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx b/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx index cdef0fc68bdc2..08c365e957a78 100644 --- a/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx +++ b/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx @@ -1,9 +1,9 @@ import type { Interpolation, Theme } from "@emotion/react"; -import ChevronRight from "@mui/icons-material/ChevronRight"; import { SearchField, type SearchFieldProps, } from "components/SearchField/SearchField"; +import { ChevronRightIcon } from "lucide-react"; import type { FC, HTMLProps } from "react"; import React, { useEffect, useRef } from "react"; import type { BarColors } from "./Bar"; @@ -81,7 +81,7 @@ export const ChartBreadcrumbs: FC = ({ {!isLast && (
  • - +
    • )} diff --git a/site/src/pages/ChatPage/ChatLanding.tsx b/site/src/pages/ChatPage/ChatLanding.tsx index 060752f895313..9ce232f6b3105 100644 --- a/site/src/pages/ChatPage/ChatLanding.tsx +++ b/site/src/pages/ChatPage/ChatLanding.tsx @@ -1,5 +1,4 @@ import { useTheme } from "@emotion/react"; -import SendIcon from "@mui/icons-material/Send"; import Button from "@mui/material/Button"; import IconButton from "@mui/material/IconButton"; import Paper from "@mui/material/Paper"; @@ -9,6 +8,7 @@ import { createChat } from "api/queries/chats"; import type { Chat } from "api/typesGenerated"; import { Margins } from "components/Margins/Margins"; import { useAuthenticated } from "hooks"; +import { SendIcon } from "lucide-react"; import { type FC, type FormEvent, useState } from "react"; import { useMutation, useQueryClient } from "react-query"; import { useNavigate } from "react-router-dom"; diff --git a/site/src/pages/ChatPage/ChatLayout.tsx b/site/src/pages/ChatPage/ChatLayout.tsx index 77de96af01595..ce69379bc9b27 100644 --- a/site/src/pages/ChatPage/ChatLayout.tsx +++ b/site/src/pages/ChatPage/ChatLayout.tsx @@ -1,5 +1,4 @@ import { useTheme } from "@emotion/react"; -import AddIcon from "@mui/icons-material/Add"; import Button from "@mui/material/Button"; import List from "@mui/material/List"; import ListItem from "@mui/material/ListItem"; @@ -13,6 +12,7 @@ import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; import { useAgenticChat } from "contexts/useAgenticChat"; +import { PlusIcon } from "lucide-react"; import { type FC, type PropsWithChildren, @@ -169,7 +169,7 @@ export const ChatLayout: FC = () => { diff --git a/site/src/pages/GroupsPage/GroupsPage.tsx b/site/src/pages/GroupsPage/GroupsPage.tsx index 46903157734e7..4c1e6f9f1633d 100644 --- a/site/src/pages/GroupsPage/GroupsPage.tsx +++ b/site/src/pages/GroupsPage/GroupsPage.tsx @@ -1,4 +1,3 @@ -import GroupAdd from "@mui/icons-material/GroupAddOutlined"; import { getErrorMessage } from "api/errors"; import { groupsByOrganization } from "api/queries/groups"; import { organizationsPermissions } from "api/queries/organizations"; @@ -12,6 +11,7 @@ import { SettingsHeaderTitle, } from "components/SettingsHeader/SettingsHeader"; import { Stack } from "components/Stack/Stack"; +import { PlusIcon } from "lucide-react"; import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; import { RequirePermission } from "modules/permissions/RequirePermission"; import { type FC, useEffect } from "react"; @@ -95,7 +95,7 @@ const GroupsPage: FC = () => { {groupsEnabled && permissions.createGroup && ( diff --git a/site/src/pages/GroupsPage/GroupsPageView.tsx b/site/src/pages/GroupsPage/GroupsPageView.tsx index c1cc60ec83aa6..296425d2ebad5 100644 --- a/site/src/pages/GroupsPage/GroupsPageView.tsx +++ b/site/src/pages/GroupsPage/GroupsPageView.tsx @@ -1,5 +1,4 @@ import type { Interpolation, Theme } from "@emotion/react"; -import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; import Skeleton from "@mui/material/Skeleton"; import type { Group } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; @@ -23,7 +22,7 @@ import { TableRowSkeleton, } from "components/TableLoader/TableLoader"; import { useClickableTableRow } from "hooks"; -import { PlusIcon } from "lucide-react"; +import { ChevronRightIcon, PlusIcon } from "lucide-react"; import type { FC } from "react"; import { Link as RouterLink, useNavigate } from "react-router-dom"; import { docs } from "utils/docs"; @@ -158,7 +157,7 @@ const GroupRow: FC = ({ group }) => {
    - +
    diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx index dc507d567b3c0..99e80cb6de397 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx @@ -1,4 +1,3 @@ -import PersonAdd from "@mui/icons-material/PersonAdd"; import { getErrorMessage } from "api/errors"; import type { Group, @@ -35,6 +34,7 @@ import { } from "components/Table/Table"; import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; import type { PaginationResultInfo } from "hooks/usePaginatedQuery"; +import { UserPlusIcon } from "lucide-react"; import { EllipsisVertical, TriangleAlert } from "lucide-react"; import { UserGroupsCell } from "pages/UsersPage/UsersTable/UserGroupsCell"; import { type FC, useState } from "react"; @@ -243,7 +243,7 @@ const AddOrganizationMember: FC = ({ variant="outline" > - + Add user diff --git a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx index bcbab3fe49ad2..74295ed63cf72 100644 --- a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx +++ b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx @@ -1,4 +1,3 @@ -import FileCopyOutlined from "@mui/icons-material/FileCopyOutlined"; import Button from "@mui/material/Button"; import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; @@ -9,7 +8,7 @@ import { FormSection, VerticalForm } from "components/Form/Form"; import { Loader } from "components/Loader/Loader"; import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; import { useClipboard } from "hooks/useClipboard"; -import { CheckIcon } from "lucide-react"; +import { CheckIcon, CopyIcon } from "lucide-react"; import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; import { type FC, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; @@ -189,7 +188,7 @@ export const TemplateEmbedPageView: FC = ({ clipboard.showCopiedSuccess ? ( ) : ( - + ) } variant="contained" diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.tsx index 7379ac0da0a96..94883e7b6c134 100644 --- a/site/src/pages/TemplatePage/TemplatePageHeader.tsx +++ b/site/src/pages/TemplatePage/TemplatePageHeader.tsx @@ -1,5 +1,4 @@ import EditIcon from "@mui/icons-material/EditOutlined"; -import CopyIcon from "@mui/icons-material/FileCopyOutlined"; import Button from "@mui/material/Button"; import { workspaces } from "api/queries/workspaces"; import type { @@ -27,6 +26,7 @@ import { } from "components/PageHeader/PageHeader"; import { Pill } from "components/Pill/Pill"; import { Stack } from "components/Stack/Stack"; +import { CopyIcon } from "lucide-react"; import { EllipsisVertical, PlusIcon, @@ -99,7 +99,7 @@ const TemplateMenu: FC = ({ navigate(`/templates/new?fromTemplate=${templateId}`) } > - + Duplicate… diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx index e00708a8b37ff..62de4d7d5271b 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx @@ -1,5 +1,4 @@ import type { Interpolation, Theme } from "@emotion/react"; -import PersonAdd from "@mui/icons-material/PersonAdd"; import MenuItem from "@mui/material/MenuItem"; import Select, { type SelectProps } from "@mui/material/Select"; import Table from "@mui/material/Table"; @@ -31,6 +30,7 @@ import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { Spinner } from "components/Spinner/Spinner"; import { Stack } from "components/Stack/Stack"; import { TableLoader } from "components/TableLoader/TableLoader"; +import { UserPlusIcon } from "lucide-react"; import { EllipsisVertical } from "lucide-react"; import { type FC, useState } from "react"; import { getGroupSubtitle } from "utils/groups"; @@ -121,7 +121,7 @@ const AddTemplateUserOrGroup: FC = ({ type="submit" > - + Add member diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx index 03dd9d47231bd..c2e729d994569 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx @@ -1,5 +1,4 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import WarningOutlined from "@mui/icons-material/WarningOutlined"; import Button from "@mui/material/Button"; import IconButton from "@mui/material/IconButton"; import Tooltip from "@mui/material/Tooltip"; @@ -24,6 +23,7 @@ import { } from "components/FullPageLayout/Topbar"; import { displayError } from "components/GlobalSnackbar/utils"; import { Loader } from "components/Loader/Loader"; +import { TriangleAlertIcon } from "lucide-react"; import { ChevronLeftIcon } from "lucide-react"; import { PlayIcon, PlusIcon, XIcon } from "lucide-react"; import { linkToTemplate, useLinks } from "modules/navigation"; @@ -461,11 +461,11 @@ export const TemplateVersionEditor: FC = ({ textAlign: "center", }} > -

    = ({ {createWorkspaceUrl && (