From 4641d60bb1c8aa52f147b75a7f65ec54215e4547 Mon Sep 17 00:00:00 2001 From: momo5502 Date: Mon, 21 Apr 2025 19:46:36 +0200 Subject: [PATCH] Switch icons --- page/package-lock.json | 62 +++++++++++++++++++----- page/package.json | 2 +- page/src/App.tsx | 10 ++-- page/src/components/status-indicator.tsx | 4 +- 4 files changed, 59 insertions(+), 19 deletions(-) diff --git a/page/package-lock.json b/page/package-lock.json index d9b743b6..99891f55 100644 --- a/page/package-lock.json +++ b/page/package-lock.json @@ -10,7 +10,6 @@ "dependencies": { "@radix-ui/react-checkbox": "^1.2.2", "@radix-ui/react-dialog": "^1.1.10", - "@radix-ui/react-icons": "^1.3.2", "@radix-ui/react-label": "^2.1.4", "@radix-ui/react-popover": "^1.1.10", "@radix-ui/react-scroll-area": "^1.2.5", @@ -24,6 +23,7 @@ "jszip": "^3.10.1", "lucide-react": "^0.501.0", "react": "^19.0.0", + "react-bootstrap-icons": "^1.11.5", "react-dom": "^19.0.0", "react-window": "^1.8.11", "tailwind-merge": "^3.2.0", @@ -1312,15 +1312,6 @@ } } }, - "node_modules/@radix-ui/react-icons": { - "version": "1.3.2", - "resolved": "https://registry.npmjs.org/@radix-ui/react-icons/-/react-icons-1.3.2.tgz", - "integrity": "sha512-fyQIhGDhzfc9pK2kH6Pl9c4BDJGfMkPqkyIgYDthyNYoNg3wVhoJMMh19WS4Up/1KMPFVpNsT2q3WmXn2N1m6g==", - "license": "MIT", - "peerDependencies": { - "react": "^16.x || ^17.x || ^18.x || ^19.0.0 || ^19.0.0-rc" - } - }, "node_modules/@radix-ui/react-id": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.1.tgz", @@ -3507,7 +3498,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true, "license": "MIT" }, "node_modules/js-yaml": { @@ -3866,6 +3856,18 @@ "dev": true, "license": "MIT" }, + "node_modules/loose-envify": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", + "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "license": "MIT", + "dependencies": { + "js-tokens": "^3.0.0 || ^4.0.0" + }, + "bin": { + "loose-envify": "cli.js" + } + }, "node_modules/lru-cache": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", @@ -3967,6 +3969,15 @@ "dev": true, "license": "MIT" }, + "node_modules/object-assign": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/optionator": { "version": "0.9.4", "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz", @@ -4119,6 +4130,17 @@ "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==", "license": "MIT" }, + "node_modules/prop-types": { + "version": "15.8.1", + "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", + "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", + "license": "MIT", + "dependencies": { + "loose-envify": "^1.4.0", + "object-assign": "^4.1.1", + "react-is": "^16.13.1" + } + }, "node_modules/punycode": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", @@ -4159,6 +4181,18 @@ "node": ">=0.10.0" } }, + "node_modules/react-bootstrap-icons": { + "version": "1.11.5", + "resolved": "https://registry.npmjs.org/react-bootstrap-icons/-/react-bootstrap-icons-1.11.5.tgz", + "integrity": "sha512-eOhtFJMUqw98IJcfKJsSMZkFHCeNPTTwXZAe9V9d4mT22ARmbrISxPO9GmtWWuf72zQctLeZMGodX/q6wrbYYg==", + "license": "MIT", + "dependencies": { + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": ">=16.8.6" + } + }, "node_modules/react-dom": { "version": "19.1.0", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz", @@ -4171,6 +4205,12 @@ "react": "^19.1.0" } }, + "node_modules/react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "license": "MIT" + }, "node_modules/react-refresh": { "version": "0.17.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz", diff --git a/page/package.json b/page/package.json index 1b5693b6..e35c5310 100644 --- a/page/package.json +++ b/page/package.json @@ -12,7 +12,6 @@ "dependencies": { "@radix-ui/react-checkbox": "^1.2.2", "@radix-ui/react-dialog": "^1.1.10", - "@radix-ui/react-icons": "^1.3.2", "@radix-ui/react-label": "^2.1.4", "@radix-ui/react-popover": "^1.1.10", "@radix-ui/react-scroll-area": "^1.2.5", @@ -26,6 +25,7 @@ "jszip": "^3.10.1", "lucide-react": "^0.501.0", "react": "^19.0.0", + "react-bootstrap-icons": "^1.11.5", "react-dom": "^19.0.0", "react-window": "^1.8.11", "tailwind-merge": "^3.2.0", diff --git a/page/src/App.tsx b/page/src/App.tsx index 84482d22..30d00283 100644 --- a/page/src/App.tsx +++ b/page/src/App.tsx @@ -20,7 +20,7 @@ import { Popover, PopoverContent, PopoverTrigger } from './components/ui/popover import { createDefaultSettings } from './settings'; import { SettingsMenu } from './components/settings-menu'; -import { PlayIcon, GearIcon, StopIcon } from "@radix-ui/react-icons"; +import { PlayFill, StopFill, GearFill } from 'react-bootstrap-icons'; import { StatusIndicator } from './components/status-indicator' function selectAndReadFile(): Promise { @@ -99,13 +99,13 @@ function App() {
- - - + + + - + diff --git a/page/src/components/status-indicator.tsx b/page/src/components/status-indicator.tsx index 2dad9efe..c12b497d 100644 --- a/page/src/components/status-indicator.tsx +++ b/page/src/components/status-indicator.tsx @@ -1,5 +1,5 @@ import { Badge } from '@/components/ui/badge' -import { CircleIcon } from '@radix-ui/react-icons'; +import { CircleFill } from 'react-bootstrap-icons'; export interface StatusIndicatorProps { running: boolean; @@ -16,6 +16,6 @@ export function StatusIndicator(props: StatusIndicatorProps) { } return ( - {getText()} + {getText()} ); } \ No newline at end of file