diff --git a/packages/view/package.json b/packages/view/package.json index 700eb931..ae6517c0 100644 --- a/packages/view/package.json +++ b/packages/view/package.json @@ -106,7 +106,6 @@ "nanoid": "^4.0.0", "react": "^18.1.0", "react-dom": "^18.1.0", - "react-icons": "^4.4.0", "react-spinners": "^0.13.8", "reflect-metadata": "^0.1.13", "svg-parser": "^2.0.4", diff --git a/packages/view/src/assets/author.svg b/packages/view/src/assets/author.svg deleted file mode 100644 index 6a952e9b..00000000 --- a/packages/view/src/assets/author.svg +++ /dev/null @@ -1,3 +0,0 @@ -<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" style="display: inline-block; vertical-align: text-bottom;"> - <path d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> -</svg> \ No newline at end of file diff --git a/packages/view/src/assets/changed-file.svg b/packages/view/src/assets/changed-file.svg deleted file mode 100644 index a33e1db7..00000000 --- a/packages/view/src/assets/changed-file.svg +++ /dev/null @@ -1,3 +0,0 @@ -<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" style="display: inline-block; vertical-align: text-bottom;"> - <path d="M1 1.75C1 .784 1.784 0 2.75 0h7.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V4.664a.25.25 0 0 0-.073-.177l-2.914-2.914a.25.25 0 0 0-.177-.073ZM8 3.25a.75.75 0 0 1 .75.75v1.5h1.5a.75.75 0 0 1 0 1.5h-1.5v1.5a.75.75 0 0 1-1.5 0V7h-1.5a.75.75 0 0 1 0-1.5h1.5V4A.75.75 0 0 1 8 3.25Zm-3 8a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Z"></path> -</svg> \ No newline at end of file diff --git a/packages/view/src/assets/commit.svg b/packages/view/src/assets/commit.svg deleted file mode 100644 index 2f75b438..00000000 --- a/packages/view/src/assets/commit.svg +++ /dev/null @@ -1,3 +0,0 @@ -<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" style="display: inline-block; vertical-align: text-bottom;"> - <path d="M11.93 8.5a4.002 4.002 0 0 1-7.86 0H.75a.75.75 0 0 1 0-1.5h3.32a4.002 4.002 0 0 1 7.86 0h3.32a.75.75 0 0 1 0 1.5Zm-1.43-.75a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"></path> -</svg> \ No newline at end of file diff --git a/packages/view/src/assets/diff-add.svg b/packages/view/src/assets/diff-add.svg deleted file mode 100644 index f07da9ee..00000000 --- a/packages/view/src/assets/diff-add.svg +++ /dev/null @@ -1,3 +0,0 @@ -<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" style="display:inline-block;vertical-align:text-bottom"> - <path d="M2.75 1h10.5c.966 0 1.75.784 1.75 1.75v10.5A1.75 1.75 0 0 1 13.25 15H2.75A1.75 1.75 0 0 1 1 13.25V2.75C1 1.784 1.784 1 2.75 1Zm10.5 1.5H2.75a.25.25 0 0 0-.25.25v10.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V2.75a.25.25 0 0 0-.25-.25ZM8 4a.75.75 0 0 1 .75.75v2.5h2.5a.75.75 0 0 1 0 1.5h-2.5v2.5a.75.75 0 0 1-1.5 0v-2.5h-2.5a.75.75 0 0 1 0-1.5h2.5v-2.5A.75.75 0 0 1 8 4Z"></path> -</svg> \ No newline at end of file diff --git a/packages/view/src/assets/diff-delete.svg b/packages/view/src/assets/diff-delete.svg deleted file mode 100644 index a5dbc9d0..00000000 --- a/packages/view/src/assets/diff-delete.svg +++ /dev/null @@ -1,3 +0,0 @@ -<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" style="display: inline-block; vertical-align: text-bottom;"> - <path d="M13.25 1c.966 0 1.75.784 1.75 1.75v10.5A1.75 1.75 0 0 1 13.25 15H2.75A1.75 1.75 0 0 1 1 13.25V2.75C1 1.784 1.784 1 2.75 1ZM2.75 2.5a.25.25 0 0 0-.25.25v10.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V2.75a.25.25 0 0 0-.25-.25Zm8.5 6.25h-6.5a.75.75 0 0 1 0-1.5h6.5a.75.75 0 0 1 0 1.5Z"></path> -</svg> \ No newline at end of file diff --git a/packages/view/src/components/Detail/Detail.tsx b/packages/view/src/components/Detail/Detail.tsx index 2fea7b8b..f76d1a02 100644 --- a/packages/view/src/components/Detail/Detail.tsx +++ b/packages/view/src/components/Detail/Detail.tsx @@ -1,10 +1,10 @@ import dayjs from "dayjs"; +import AddCircleRoundedIcon from "@mui/icons-material/AddCircleRounded"; +import RemoveCircleRoundedIcon from "@mui/icons-material/RemoveCircleRounded"; +import PersonRoundedIcon from "@mui/icons-material/PersonRounded"; +import CommitRoundedIcon from "@mui/icons-material/CommitRounded"; +import RestorePageRoundedIcon from "@mui/icons-material/RestorePageRounded"; -import AuthorIcon from "assets/author.svg"; -import ChangedFileIcon from "assets/changed-file.svg"; -import CommitIcon from "assets/commit.svg"; -import DiffAddIcon from "assets/diff-add.svg"; -import DiffDeleteIcon from "assets/diff-delete.svg"; import { Author } from "components/@common/Author"; import { useCommitListHide } from "./Detail.hook"; @@ -20,11 +20,11 @@ const DetailSummary = ({ commitNodeListInCluster }: DetailSummaryProps) => { }); const summaryItems: DetailSummaryItem[] = [ - { name: "authors", count: authorLength, icon: <AuthorIcon /> }, - { name: "commits", count: commitLength, icon: <CommitIcon /> }, - { name: "changed files", count: fileLength, icon: <ChangedFileIcon /> }, - { name: "additions", count: insertions, icon: <DiffAddIcon /> }, - { name: "deletions", count: deletions, icon: <DiffDeleteIcon /> }, + { name: "authors", count: authorLength, icon: <PersonRoundedIcon sx={{ fontSize: 18 }} /> }, + { name: "commits", count: commitLength, icon: <CommitRoundedIcon sx={{ fontSize: 18 }} /> }, + { name: "changed files", count: fileLength, icon: <RestorePageRoundedIcon sx={{ fontSize: 18 }} /> }, + { name: "additions", count: insertions, icon: <AddCircleRoundedIcon sx={{ fontSize: 18 }} /> }, + { name: "deletions", count: deletions, icon: <RemoveCircleRoundedIcon sx={{ fontSize: 18 }} /> }, ]; return ( diff --git a/packages/view/src/components/RefreshButton/RefreshButton.tsx b/packages/view/src/components/RefreshButton/RefreshButton.tsx index d066e4ac..cf1b4ebc 100644 --- a/packages/view/src/components/RefreshButton/RefreshButton.tsx +++ b/packages/view/src/components/RefreshButton/RefreshButton.tsx @@ -1,10 +1,9 @@ import "reflect-metadata"; import cn from "classnames"; -import { FiRefreshCcw } from "react-icons/fi"; +import ReplayCircleFilledRoundedIcon from "@mui/icons-material/ReplayCircleFilledRounded"; import { throttle } from "utils"; import { useGlobalData } from "hooks"; - import "./RefreshButton.scss"; import { sendRefreshDataCommand } from "services"; @@ -22,9 +21,9 @@ const RefreshButton = () => { className={cn("refresh-button")} onClick={refreshHandler} > - <FiRefreshCcw + <ReplayCircleFilledRoundedIcon className={cn("refresh-button-icon", { "refresh-button-icon--loading": loading })} - stroke="white" + style={{ color: "white" }} /> </button> ); diff --git a/packages/view/src/components/VerticalClusterList/Summary/Content/Content.tsx b/packages/view/src/components/VerticalClusterList/Summary/Content/Content.tsx index ac5e0825..5920734c 100644 --- a/packages/view/src/components/VerticalClusterList/Summary/Content/Content.tsx +++ b/packages/view/src/components/VerticalClusterList/Summary/Content/Content.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from "react"; -import { IoIosArrowDropdownCircle, IoIosArrowDropupCircle } from "react-icons/io"; +import ArrowDropDownCircleRoundedIcon from "@mui/icons-material/ArrowDropDownCircleRounded"; import { useGlobalData } from "hooks"; @@ -48,9 +48,9 @@ const Content = ({ content, clusterId, selectedClusterId }: ContentProps) => { </div> <div className="collapsible-icon"> {selectedClusterId.includes(clusterId) ? ( - <IoIosArrowDropupCircle className="show" /> + <ArrowDropDownCircleRoundedIcon className="show" /> ) : ( - <IoIosArrowDropdownCircle /> + <ArrowDropDownCircleRoundedIcon /> )} </div> </> diff --git a/packages/view/src/components/VerticalClusterList/Summary/Summary.scss b/packages/view/src/components/VerticalClusterList/Summary/Summary.scss index 8f3d9028..17d12b77 100644 --- a/packages/view/src/components/VerticalClusterList/Summary/Summary.scss +++ b/packages/view/src/components/VerticalClusterList/Summary/Summary.scss @@ -47,6 +47,7 @@ & .show { visibility: visible; + transform: rotate(180deg); } }