From ad7d21764d175e375a2ad50acba22b6189fa9160 Mon Sep 17 00:00:00 2001 From: proddy Date: Wed, 29 Jan 2025 21:04:01 +0100 Subject: [PATCH] remove flash from dashboard --- interface/package.json | 4 +- interface/src/app/main/Dashboard.tsx | 34 +++++----- interface/src/app/main/Devices.tsx | 27 ++------ interface/src/components/ButtonTooltip.tsx | 17 +++++ interface/src/components/index.ts | 1 + interface/yarn.lock | 78 +++++++++++----------- mock-api/package.json | 2 +- mock-api/yarn.lock | 26 ++++---- 8 files changed, 96 insertions(+), 93 deletions(-) create mode 100644 interface/src/components/ButtonTooltip.tsx diff --git a/interface/package.json b/interface/package.json index 47bcaf633..ee37cbb80 100644 --- a/interface/package.json +++ b/interface/package.json @@ -24,8 +24,8 @@ "@alova/adapter-xhr": "2.1.1", "@emotion/react": "^11.14.0", "@emotion/styled": "^11.14.0", - "@mui/icons-material": "^6.4.1", - "@mui/material": "^6.4.1", + "@mui/icons-material": "^6.4.2", + "@mui/material": "^6.4.2", "@table-library/react-table-library": "4.1.7", "alova": "3.2.8", "async-validator": "^4.2.5", diff --git a/interface/src/app/main/Dashboard.tsx b/interface/src/app/main/Dashboard.tsx index 60dedf6f3..2bee49195 100644 --- a/interface/src/app/main/Dashboard.tsx +++ b/interface/src/app/main/Dashboard.tsx @@ -14,7 +14,6 @@ import { IconButton, ToggleButton, ToggleButtonGroup, - Tooltip, Typography } from '@mui/material'; @@ -22,7 +21,13 @@ import { Body, Cell, Row, Table } from '@table-library/react-table-library/table import { useTheme } from '@table-library/react-table-library/theme'; import { CellTree, useTree } from '@table-library/react-table-library/tree'; import { useRequest } from 'alova/client'; -import { FormLoader, MessageBox, SectionContent, useLayoutTitle } from 'components'; +import { + ButtonTooltip, + FormLoader, + MessageBox, + SectionContent, + useLayoutTitle +} from 'components'; import { AuthenticatedContext } from 'contexts/authentication'; import { useI18nContext } from 'i18n/i18n-react'; import { useInterval, usePersistState } from 'utils'; @@ -55,8 +60,7 @@ const Dashboard = () => { const { data, send: fetchDashboard, - error, - loading + error } = useRequest(readDashboard, { initialData: { connected: false, nodes: [] } }).onSuccess((event) => { @@ -224,10 +228,6 @@ const Dashboard = () => { return ; } - if (loading) { - return; - } - const hasFavEntities = data.nodes.filter( (item: DashboardItem) => item.id <= 90 ).length; @@ -264,20 +264,20 @@ const Dashboard = () => { exclusive onChange={handleShowAll} > - + - - + + - + - + - + { <> {showName(di)} - {formatValue(LL, di.dv?.v, di.dv?.u)} - + diff --git a/interface/src/app/main/Devices.tsx b/interface/src/app/main/Devices.tsx index 62d239fed..0e5dc71fe 100644 --- a/interface/src/app/main/Devices.tsx +++ b/interface/src/app/main/Devices.tsx @@ -35,11 +35,7 @@ import { List, ListItem, ListItemText, - Tooltip, - type TooltipProps, - Typography, - styled, - tooltipClasses + Typography } from '@mui/material'; import { useRowSelect } from '@table-library/react-table-library/select'; @@ -57,7 +53,12 @@ import { useTheme } from '@table-library/react-table-library/theme'; import type { Action, State } from '@table-library/react-table-library/types/common'; import { dialogStyle } from 'CustomTheme'; import { useRequest } from 'alova/client'; -import { MessageBox, SectionContent, useLayoutTitle } from 'components'; +import { + ButtonTooltip, + MessageBox, + SectionContent, + useLayoutTitle +} from 'components'; import { AuthenticatedContext } from 'contexts/authentication'; import { useI18nContext } from 'i18n/i18n-react'; import { useInterval } from 'utils'; @@ -221,20 +222,6 @@ const Devices = () => { } ]); - const ButtonTooltip = styled(({ className, ...props }: TooltipProps) => ( - - ))(({ theme }) => ({ - [`& .${tooltipClasses.arrow}`]: { - color: theme.palette.success.main - }, - [`& .${tooltipClasses.tooltip}`]: { - backgroundColor: theme.palette.success.main, - color: 'rgba(0, 0, 0, 0.87)', - boxShadow: theme.shadows[1], - fontSize: 10 - } - })); - const getSortIcon = (state: State, sortKey: unknown) => { if (state.sortKey === sortKey && state.reverse) { return ; diff --git a/interface/src/components/ButtonTooltip.tsx b/interface/src/components/ButtonTooltip.tsx new file mode 100644 index 000000000..8498a6860 --- /dev/null +++ b/interface/src/components/ButtonTooltip.tsx @@ -0,0 +1,17 @@ +import { Tooltip, type TooltipProps, styled, tooltipClasses } from '@mui/material'; + +export const ButtonTooltip = styled(({ className, ...props }: TooltipProps) => ( + +))(({ theme }) => ({ + [`& .${tooltipClasses.arrow}`]: { + color: theme.palette.success.main + }, + [`& .${tooltipClasses.tooltip}`]: { + backgroundColor: theme.palette.success.main, + color: 'rgba(0, 0, 0, 0.87)', + boxShadow: theme.shadows[1], + fontSize: 10 + } +})); + +export default ButtonTooltip; diff --git a/interface/src/components/index.ts b/interface/src/components/index.ts index 0d00bdf92..4d47f6d2d 100644 --- a/interface/src/components/index.ts +++ b/interface/src/components/index.ts @@ -7,3 +7,4 @@ export { default as SectionContent } from './SectionContent'; export { default as ButtonRow } from './ButtonRow'; export { default as MessageBox } from './MessageBox'; export { default as BlockNavigation } from './routing/BlockNavigation'; +export { default as ButtonTooltip } from './ButtonTooltip'; diff --git a/interface/yarn.lock b/interface/yarn.lock index 50bc08217..edaefdc52 100644 --- a/interface/yarn.lock +++ b/interface/yarn.lock @@ -783,38 +783,38 @@ __metadata: languageName: node linkType: hard -"@mui/core-downloads-tracker@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/core-downloads-tracker@npm:6.4.1" - checksum: 10c0/5c35592eecb6b9b64b23003975a8ce20fadb9e9b712a78dd552b5ea835d06e8e4d7b7cb84f471f5658b5285de317a860b40597ad3c5e494e84f0ae0daf35fd6b +"@mui/core-downloads-tracker@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/core-downloads-tracker@npm:6.4.2" + checksum: 10c0/7df1784d2b79fc90b808b0f02c1f2f2f5ab58f7b4967c11703571202a5ab0cf9ebc20708d2c6c7b09c3bf6d03669ffa32ad7e47246439fbe2642f51a85744069 languageName: node linkType: hard -"@mui/icons-material@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/icons-material@npm:6.4.1" +"@mui/icons-material@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/icons-material@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" peerDependencies: - "@mui/material": ^6.4.1 + "@mui/material": ^6.4.2 "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0 react: ^17.0.0 || ^18.0.0 || ^19.0.0 peerDependenciesMeta: "@types/react": optional: true - checksum: 10c0/f551aea11f0c3a6ff0336333e1cf28b69d7965e5984643067e5f8563eabf1434dee910c9b4beb530f785f191b0ec14520d9c41fd8ee6649f4f8d26f831f02ba8 + checksum: 10c0/b182f0ba58fd400852a4b7e3497f0ad5e6d3051f7a6d1b442e823d04c14f3e1d65958bfe41782573622cb77c4628078fd1f30d262642597c6aa2dca95e1554d7 languageName: node linkType: hard -"@mui/material@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/material@npm:6.4.1" +"@mui/material@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/material@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" - "@mui/core-downloads-tracker": "npm:^6.4.1" - "@mui/system": "npm:^6.4.1" + "@mui/core-downloads-tracker": "npm:^6.4.2" + "@mui/system": "npm:^6.4.2" "@mui/types": "npm:^7.2.21" - "@mui/utils": "npm:^6.4.1" + "@mui/utils": "npm:^6.4.2" "@popperjs/core": "npm:^2.11.8" "@types/react-transition-group": "npm:^4.4.12" clsx: "npm:^2.1.1" @@ -825,7 +825,7 @@ __metadata: peerDependencies: "@emotion/react": ^11.5.0 "@emotion/styled": ^11.3.0 - "@mui/material-pigment-css": ^6.4.1 + "@mui/material-pigment-css": ^6.4.2 "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0 react: ^17.0.0 || ^18.0.0 || ^19.0.0 react-dom: ^17.0.0 || ^18.0.0 || ^19.0.0 @@ -838,16 +838,16 @@ __metadata: optional: true "@types/react": optional: true - checksum: 10c0/c5ad8ab4339e145cac815cd9fdd9c909d5e2e5edf4997b8afe5edc320f3a020ddb857b5939f6a4453a34d996e3f334804c3858c5dc5f0bfede087e7d6b5e574e + checksum: 10c0/e77604a7f83a5f8526077a9b7394e644d919dee5661f676d8b60ec6a7b9ae6a11eb5cf6656e9383d45467b7eb8e6d7e559f942df494f0bec908ff018874b97ae languageName: node linkType: hard -"@mui/private-theming@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/private-theming@npm:6.4.1" +"@mui/private-theming@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/private-theming@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" - "@mui/utils": "npm:^6.4.1" + "@mui/utils": "npm:^6.4.2" prop-types: "npm:^15.8.1" peerDependencies: "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0 @@ -855,13 +855,13 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 10c0/5b6936e6dff6218373579f901aabba01eea1953e97a5b4b695736aeebca2d39fc7c2b4d0e54ab064d1ba99a6ffce0d907098791ecec28795f7da25c1bd0d33cb + checksum: 10c0/23d5a51a91db3ff6849e3511d95c7726969c888ff67a06b9f1d91a6aa322d37f9376baaf9ac53a21fa1ec200c7be2a7c7eb6205bf3f20042460da19d52a6d83d languageName: node linkType: hard -"@mui/styled-engine@npm:^6.4.0": - version: 6.4.0 - resolution: "@mui/styled-engine@npm:6.4.0" +"@mui/styled-engine@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/styled-engine@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" "@emotion/cache": "npm:^11.13.5" @@ -878,19 +878,19 @@ __metadata: optional: true "@emotion/styled": optional: true - checksum: 10c0/bff35147ca9ef586679b53786d840e98837f0c1e5bf10a3510d4b2b68c340ae4ab69befe94b69ef25f6846bada5b3c355d25fa3a179d1598499e28c51f28d5d2 + checksum: 10c0/c60622d11d2f039d48c182674206b6117df8399dfe3f28a7b5ac21bc6f838ee3b6d2c637243c7bb39b067f042097d3ebf87e410c959435d419aaf8f9d78b366c languageName: node linkType: hard -"@mui/system@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/system@npm:6.4.1" +"@mui/system@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/system@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" - "@mui/private-theming": "npm:^6.4.1" - "@mui/styled-engine": "npm:^6.4.0" + "@mui/private-theming": "npm:^6.4.2" + "@mui/styled-engine": "npm:^6.4.2" "@mui/types": "npm:^7.2.21" - "@mui/utils": "npm:^6.4.1" + "@mui/utils": "npm:^6.4.2" clsx: "npm:^2.1.1" csstype: "npm:^3.1.3" prop-types: "npm:^15.8.1" @@ -906,7 +906,7 @@ __metadata: optional: true "@types/react": optional: true - checksum: 10c0/34d731fb5faf1a6242c9faca5672a4b8722ac97cf5d1fd58cf85cce093cfbd2249ed57dd4c33e8f3b879c611e0fab56bb9e0e8fc1b7c8a49cbe4dd39ba32f98d + checksum: 10c0/4a298140eb354b4842bcb00c45da0a8803fd41a2c7fa3ef9fa1218c9931e6ba3bb3fcf44b92e628042b5420ff4979ae089d9327da89d3bfb0c67b38d8a432d64 languageName: node linkType: hard @@ -922,9 +922,9 @@ __metadata: languageName: node linkType: hard -"@mui/utils@npm:^6.4.1": - version: 6.4.1 - resolution: "@mui/utils@npm:6.4.1" +"@mui/utils@npm:^6.4.2": + version: 6.4.2 + resolution: "@mui/utils@npm:6.4.2" dependencies: "@babel/runtime": "npm:^7.26.0" "@mui/types": "npm:^7.2.21" @@ -938,7 +938,7 @@ __metadata: peerDependenciesMeta: "@types/react": optional: true - checksum: 10c0/c0cfb8737db7c5709ce35ebdf739c5014914a1344e1b305d13a75b061b970656777eaf01f6fbdb8f209da91c086ab36dd3f5ddc1c94237c5868a383cdd1aad81 + checksum: 10c0/981a267c87d4ed9e9880dd98e31a16b8ff9e268295d4bcc7d185bf5e19a0d7b0afe14e9e37263acb054694f4520a8c5bf6d8ced6f6df1cbef4e8163d44a52da4 languageName: node linkType: hard @@ -1597,8 +1597,8 @@ __metadata: "@emotion/react": "npm:^11.14.0" "@emotion/styled": "npm:^11.14.0" "@eslint/js": "npm:^9.19.0" - "@mui/icons-material": "npm:^6.4.1" - "@mui/material": "npm:^6.4.1" + "@mui/icons-material": "npm:^6.4.2" + "@mui/material": "npm:^6.4.2" "@preact/compat": "npm:^18.3.1" "@preact/preset-vite": "npm:^2.10.0" "@table-library/react-table-library": "npm:4.1.7" diff --git a/mock-api/package.json b/mock-api/package.json index 52ded383d..b636211db 100644 --- a/mock-api/package.json +++ b/mock-api/package.json @@ -10,7 +10,7 @@ }, "dependencies": { "@msgpack/msgpack": "^2.8.0", - "@trivago/prettier-plugin-sort-imports": "^5.2.1", + "@trivago/prettier-plugin-sort-imports": "^5.2.2", "formidable": "^3.5.2", "itty-router": "^5.0.18", "prettier": "^3.4.2" diff --git a/mock-api/yarn.lock b/mock-api/yarn.lock index 9451d4f9a..5a5440c43 100644 --- a/mock-api/yarn.lock +++ b/mock-api/yarn.lock @@ -16,7 +16,7 @@ __metadata: languageName: node linkType: hard -"@babel/generator@npm:^7.26.2, @babel/generator@npm:^7.26.5": +"@babel/generator@npm:^7.26.5": version: 7.26.5 resolution: "@babel/generator@npm:7.26.5" dependencies: @@ -43,7 +43,7 @@ __metadata: languageName: node linkType: hard -"@babel/parser@npm:^7.25.9, @babel/parser@npm:^7.26.2, @babel/parser@npm:^7.26.5, @babel/parser@npm:^7.26.7": +"@babel/parser@npm:^7.25.9, @babel/parser@npm:^7.26.5, @babel/parser@npm:^7.26.7": version: 7.26.7 resolution: "@babel/parser@npm:7.26.7" dependencies: @@ -65,7 +65,7 @@ __metadata: languageName: node linkType: hard -"@babel/traverse@npm:^7.25.9": +"@babel/traverse@npm:^7.26.7": version: 7.26.7 resolution: "@babel/traverse@npm:7.26.7" dependencies: @@ -80,7 +80,7 @@ __metadata: languageName: node linkType: hard -"@babel/types@npm:^7.25.9, @babel/types@npm:^7.26.0, @babel/types@npm:^7.26.5, @babel/types@npm:^7.26.7": +"@babel/types@npm:^7.25.9, @babel/types@npm:^7.26.5, @babel/types@npm:^7.26.7": version: 7.26.7 resolution: "@babel/types@npm:7.26.7" dependencies: @@ -139,14 +139,14 @@ __metadata: languageName: node linkType: hard -"@trivago/prettier-plugin-sort-imports@npm:^5.2.1": - version: 5.2.1 - resolution: "@trivago/prettier-plugin-sort-imports@npm:5.2.1" +"@trivago/prettier-plugin-sort-imports@npm:^5.2.2": + version: 5.2.2 + resolution: "@trivago/prettier-plugin-sort-imports@npm:5.2.2" dependencies: - "@babel/generator": "npm:^7.26.2" - "@babel/parser": "npm:^7.26.2" - "@babel/traverse": "npm:^7.25.9" - "@babel/types": "npm:^7.26.0" + "@babel/generator": "npm:^7.26.5" + "@babel/parser": "npm:^7.26.7" + "@babel/traverse": "npm:^7.26.7" + "@babel/types": "npm:^7.26.7" javascript-natural-sort: "npm:^0.7.1" lodash: "npm:^4.17.21" peerDependencies: @@ -161,7 +161,7 @@ __metadata: optional: true svelte: optional: true - checksum: 10c0/fd782f84d44c61159dce099775a86ebb5082b5e5eea205ec71d6fede3cf079aafb8f9a9979d5742ff0126598a37098cf679d5bad268320907513f2984df3d501 + checksum: 10c0/2a4f0464f1f5a294bcd34558fb053f8263f0c62c4a7fcdd3ce40c9822a68ac8b4d951700ab6d01eb3919efe0ed44e4191997edd494d59679b22db1c0db00474e languageName: node linkType: hard @@ -261,7 +261,7 @@ __metadata: resolution: "mock-api@workspace:." dependencies: "@msgpack/msgpack": "npm:^2.8.0" - "@trivago/prettier-plugin-sort-imports": "npm:^5.2.1" + "@trivago/prettier-plugin-sort-imports": "npm:^5.2.2" formidable: "npm:^3.5.2" itty-router: "npm:^5.0.18" prettier: "npm:^3.4.2"