mirror/web
1
0
Fork 0
mirror of https://github.com/meshtastic/web.git synced 2026-01-27 08:49:24 -05:00
Code Issues Packages Projects Releases Wiki Activity

Tooltips, mqtt status & commit hash

Browse Source
This commit is contained in:
Sacha Weatherstone
2022-01-16 15:16:38 +11:00
parent 5f2503976d
commit 070fbc664f
6 changed files with 225 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
package.json
View File

@@ -17,6 +17,7 @@
"@meshtastic/components": "^1.0.17",
"@meshtastic/meshtasticjs": "^0.6.38",
"@reduxjs/toolkit": "^1.7.1",
"@tippyjs/react": "^4.2.6",
"base64-js": "^1.5.1",
"boring-avatars": "^1.6.1",
"i18next": "^21.6.6",
@@ -37,8 +38,10 @@
"rfc4648": "^1.5.1",
"swr": "^1.1.2",
"timeago-react": "^3.0.4",
"tippy.js": "^6.3.7",
"type-route": "^0.6.0",
"use-breakpoint": "^3.0.1"
"use-breakpoint": "^3.0.1",
"vite-plugin-environment": "^1.1.0"
},
"devDependencies": {
"@types/mapbox-gl": "^2.6.0",
@@ -53,7 +56,7 @@
"@vitejs/plugin-react": "^1.1.4",
"autoprefixer": "^10.4.2",
"babel-plugin-module-resolver": "^4.1.0",
"eslint": "8.6.0",
"eslint": "8.7.0",
"eslint-config-prettier": "^8.3.0",
"eslint-import-resolver-alias": "^1.1.2",
"eslint-import-resolver-babel-module": "^5.3.1",

178
pnpm-lock.yaml generated
View File

@@ -6,6 +6,7 @@ specifiers:
'@meshtastic/components': ^1.0.17
'@meshtastic/meshtasticjs': ^0.6.38
'@reduxjs/toolkit': ^1.7.1
'@tippyjs/react': ^4.2.6
'@types/mapbox-gl': ^2.6.0
'@types/react': ^17.0.38
'@types/react-dom': ^17.0.11
@@ -20,7 +21,7 @@ specifiers:
babel-plugin-module-resolver: ^4.1.0
base64-js: ^1.5.1
boring-avatars: ^1.6.1
eslint: 8.6.0
eslint: 8.7.0
eslint-config-prettier: ^8.3.0
eslint-import-resolver-alias: ^1.1.2
eslint-import-resolver-babel-module: ^5.3.1
@@ -51,11 +52,13 @@ specifiers:
tailwindcss: ^3.0.15
tar: ^6.1.11
timeago-react: ^3.0.4
tippy.js: ^6.3.7
type-route: ^0.6.0
typescript: ^4.5.4
use-breakpoint: ^3.0.1
vite: ^2.7.12
vite-plugin-cdn-import: ^0.3.5
vite-plugin-environment: ^1.1.0
vite-plugin-pwa: ^0.11.13
workbox-window: ^6.4.2
@@ -65,6 +68,7 @@ dependencies:
'@meshtastic/components': 1.0.17_@types+react@17.0.38
'@meshtastic/meshtasticjs': 0.6.38
'@reduxjs/toolkit': 1.7.1_react-redux@7.2.6+react@17.0.2
'@tippyjs/react': 4.2.6_react-dom@17.0.2+react@17.0.2
base64-js: 1.5.1
boring-avatars: 1.6.1
i18next: 21.6.6
@@ -85,8 +89,10 @@ dependencies:
rfc4648: 1.5.1
swr: 1.1.2_react@17.0.2
timeago-react: 3.0.4_react@17.0.2
tippy.js: 6.3.7
type-route: 0.6.0
use-breakpoint: 3.0.1_react-dom@17.0.2+react@17.0.2
vite-plugin-environment: 1.1.0_vite@2.7.12
devDependencies:
'@types/mapbox-gl': 2.6.0
@@ -95,20 +101,20 @@ devDependencies:
'@types/react-file-icon': 1.0.1
'@types/w3c-web-serial': 1.0.2
'@types/web-bluetooth': 0.0.12
'@typescript-eslint/eslint-plugin': 5.9.1_b7b2e42b32ee097737cd3e626b10847b
'@typescript-eslint/parser': 5.9.1_eslint@8.6.0+typescript@4.5.4
'@typescript-eslint/eslint-plugin': 5.9.1_bbe74534e31a8c21f1b3522447c55341
'@typescript-eslint/parser': 5.9.1_eslint@8.7.0+typescript@4.5.4
'@verypossible/eslint-config': 1.6.1_typescript@4.5.4
'@vitejs/plugin-react': 1.1.4
autoprefixer: 10.4.2_postcss@8.4.5
babel-plugin-module-resolver: 4.1.0
eslint: 8.6.0
eslint-config-prettier: 8.3.0_eslint@8.6.0
eslint: 8.7.0
eslint-config-prettier: 8.3.0_eslint@8.7.0
eslint-import-resolver-alias: 1.1.2_eslint-plugin-import@2.25.4
eslint-import-resolver-babel-module: 5.3.1_e51044130ac762fd207a8cd2109b5344
eslint-import-resolver-typescript: 2.5.0_b5a36b8c1535387c8dd00eff7ec6b551
eslint-plugin-import: 2.25.4_eslint@8.6.0
eslint-plugin-react: 7.28.0_eslint@8.6.0
eslint-plugin-react-hooks: 4.3.0_eslint@8.6.0
eslint-import-resolver-typescript: 2.5.0_9ff7dbcc486b497d34e34a545c49272a
eslint-plugin-import: 2.25.4_eslint@8.7.0
eslint-plugin-react: 7.28.0_eslint@8.7.0
eslint-plugin-react-hooks: 4.3.0_eslint@8.7.0
gzipper: 6.2.1
postcss: 8.4.5
prettier: 2.5.1
@@ -122,13 +128,13 @@ devDependencies:
packages:
/@apideck/better-ajv-errors/0.3.2_ajv@8.8.2:
/@apideck/better-ajv-errors/0.3.2_ajv@8.9.0:
resolution: {integrity: sha512-JdEazx7qiVqTBzzBl5rolRwl5cmhihjfIcpqRzIZjtT6b18liVmDn/VlWpqW4C/qP2hrFFMLRV1wlex8ZVBPTg==}
engines: {node: '>=10'}
peerDependencies:
ajv: '>=8'
dependencies:
ajv: 8.8.2
ajv: 8.9.0
json-schema: 0.4.0
jsonpointer: 5.0.0
leven: 3.1.0
@@ -241,8 +247,8 @@ packages:
regexpu-core: 4.8.0
dev: true
/@babel/helper-define-polyfill-provider/0.3.0_@babel+core@7.16.7:
resolution: {integrity: sha512-7hfT8lUljl/tM3h+izTX/pO3W3frz2ok6Pk+gzys8iJqDfZrZy2pXjRTZAvG2YmfHun1X4q8/UZRLatMfqc5Tg==}
/@babel/helper-define-polyfill-provider/0.3.1_@babel+core@7.16.7:
resolution: {integrity: sha512-J9hGMpJQmtWmj46B3kBHmL38UhJGhYX7eqkcq+2gsstyYt341HmPeWspihX43yVRA0mS+8GGk2Gckc7bY/HCmA==}
peerDependencies:
'@babel/core': ^7.4.0-0
dependencies:
@@ -1255,10 +1261,10 @@ packages:
'@babel/plugin-transform-unicode-regex': 7.16.7_@babel+core@7.16.7
'@babel/preset-modules': 0.1.5_@babel+core@7.16.7
'@babel/types': 7.16.8
babel-plugin-polyfill-corejs2: 0.3.0_@babel+core@7.16.7
babel-plugin-polyfill-corejs3: 0.5.0_@babel+core@7.16.7
babel-plugin-polyfill-regenerator: 0.3.0_@babel+core@7.16.7
core-js-compat: 3.20.2
babel-plugin-polyfill-corejs2: 0.3.1_@babel+core@7.16.7
babel-plugin-polyfill-corejs3: 0.5.1_@babel+core@7.16.7
babel-plugin-polyfill-regenerator: 0.3.1_@babel+core@7.16.7
core-js-compat: 3.20.3
semver: 6.3.0
transitivePeerDependencies:
- supports-color
@@ -1565,6 +1571,10 @@ packages:
fastq: 1.13.0
dev: true
/@popperjs/core/2.11.2:
resolution: {integrity: sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA==}
dev: false
/@protobuf-ts/runtime/2.2.1:
resolution: {integrity: sha512-iF7VFFz61ep5w/+4Ub+2GaKPF1/s0YWLxjEia2+x2/xUpl4vkI0yWf2RRdh3GHl4f3j1he8M+WNRGh26F+Vupw==}
dev: false
@@ -1659,6 +1669,17 @@ packages:
string.prototype.matchall: 4.0.6
dev: true
/@tippyjs/react/4.2.6_react-dom@17.0.2+react@17.0.2:
resolution: {integrity: sha512-91RicDR+H7oDSyPycI13q3b7o4O60wa2oRbjlz2fyRLmHImc4vyDwuUP8NtZaN0VARJY5hybvDYrFzhY9+Lbyw==}
peerDependencies:
react: '>=16.8'
react-dom: '>=16.8'
dependencies:
react: 17.0.2
react-dom: 17.0.2_react@17.0.2
tippy.js: 6.3.7
dev: false
/@types/estree/0.0.39:
resolution: {integrity: sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==}
dev: true
@@ -1784,7 +1805,7 @@ packages:
- supports-color
dev: true
/@typescript-eslint/eslint-plugin/5.9.1_b7b2e42b32ee097737cd3e626b10847b:
/@typescript-eslint/eslint-plugin/5.9.1_bbe74534e31a8c21f1b3522447c55341:
resolution: {integrity: sha512-Xv9tkFlyD4MQGpJgTo6wqDqGvHIRmRgah/2Sjz1PUnJTawjHWIwBivUE9x0QtU2WVii9baYgavo/bHjrZJkqTw==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1795,12 +1816,12 @@ packages:
typescript:
optional: true
dependencies:
'@typescript-eslint/experimental-utils': 5.9.1_eslint@8.6.0+typescript@4.5.4
'@typescript-eslint/parser': 5.9.1_eslint@8.6.0+typescript@4.5.4
'@typescript-eslint/experimental-utils': 5.9.1_eslint@8.7.0+typescript@4.5.4
'@typescript-eslint/parser': 5.9.1_eslint@8.7.0+typescript@4.5.4
'@typescript-eslint/scope-manager': 5.9.1
'@typescript-eslint/type-utils': 5.9.1_eslint@8.6.0+typescript@4.5.4
'@typescript-eslint/type-utils': 5.9.1_eslint@8.7.0+typescript@4.5.4
debug: 4.3.3
eslint: 8.6.0
eslint: 8.7.0
functional-red-black-tree: 1.0.1
ignore: 5.2.0
regexpp: 3.2.0
@@ -1829,7 +1850,7 @@ packages:
- typescript
dev: true
/@typescript-eslint/experimental-utils/5.9.1_eslint@8.6.0+typescript@4.5.4:
/@typescript-eslint/experimental-utils/5.9.1_eslint@8.7.0+typescript@4.5.4:
resolution: {integrity: sha512-cb1Njyss0mLL9kLXgS/eEY53SZQ9sT519wpX3i+U457l2UXRDuo87hgKfgRazmu9/tQb0x2sr3Y0yrU+Zz0y+w==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1839,9 +1860,9 @@ packages:
'@typescript-eslint/scope-manager': 5.9.1
'@typescript-eslint/types': 5.9.1
'@typescript-eslint/typescript-estree': 5.9.1_typescript@4.5.4
eslint: 8.6.0
eslint: 8.7.0
eslint-scope: 5.1.1
eslint-utils: 3.0.0_eslint@8.6.0
eslint-utils: 3.0.0_eslint@8.7.0
transitivePeerDependencies:
- supports-color
- typescript
@@ -1867,7 +1888,7 @@ packages:
- supports-color
dev: true
/@typescript-eslint/parser/5.9.1_eslint@8.6.0+typescript@4.5.4:
/@typescript-eslint/parser/5.9.1_eslint@8.7.0+typescript@4.5.4:
resolution: {integrity: sha512-PLYO0AmwD6s6n0ZQB5kqPgfvh73p0+VqopQQLuNfi7Lm0EpfKyDalchpVwkE+81k5HeiRrTV/9w1aNHzjD7C4g==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1881,7 +1902,7 @@ packages:
'@typescript-eslint/types': 5.9.1
'@typescript-eslint/typescript-estree': 5.9.1_typescript@4.5.4
debug: 4.3.3
eslint: 8.6.0
eslint: 8.7.0
typescript: 4.5.4
transitivePeerDependencies:
- supports-color
@@ -1903,7 +1924,7 @@ packages:
'@typescript-eslint/visitor-keys': 5.9.1
dev: true
/@typescript-eslint/type-utils/5.9.1_eslint@8.6.0+typescript@4.5.4:
/@typescript-eslint/type-utils/5.9.1_eslint@8.7.0+typescript@4.5.4:
resolution: {integrity: sha512-tRSpdBnPRssjlUh35rE9ug5HrUvaB9ntREy7gPXXKwmIx61TNN7+l5YKgi1hMKxo5NvqZCfYhA5FvyuJG6X6vg==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies:
@@ -1913,9 +1934,9 @@ packages:
typescript:
optional: true
dependencies:
'@typescript-eslint/experimental-utils': 5.9.1_eslint@8.6.0+typescript@4.5.4
'@typescript-eslint/experimental-utils': 5.9.1_eslint@8.7.0+typescript@4.5.4
debug: 4.3.3
eslint: 8.6.0
eslint: 8.7.0
tsutils: 3.21.0_typescript@4.5.4
typescript: 4.5.4
transitivePeerDependencies:
@@ -1987,7 +2008,7 @@ packages:
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dependencies:
'@typescript-eslint/types': 5.9.1
eslint-visitor-keys: 3.1.0
eslint-visitor-keys: 3.2.0
dev: true
/@verypossible/eslint-config/1.6.1_typescript@4.5.4:
@@ -2076,8 +2097,8 @@ packages:
uri-js: 4.4.1
dev: true
/ajv/8.8.2:
resolution: {integrity: sha512-x9VuX+R/jcFj1DHo/fCp99esgGDWiHENrKxaCENuCxpoMCmAt/COCGVDwA7kleEpEzJjDnvh3yGoOuLu0Dtllw==}
/ajv/8.9.0:
resolution: {integrity: sha512-qOKJyNj/h+OWx7s5DePL6Zu1KeM9jPZhwBqs+7DzP6bGOvqzVCSf0xueYmVuaC/oQ/VtS2zLMLHdQFbkka+XDQ==}
dependencies:
fast-deep-equal: 3.1.3
json-schema-traverse: 1.0.0
@@ -2233,38 +2254,38 @@ packages:
resolve: 1.21.0
dev: true
/babel-plugin-polyfill-corejs2/0.3.0_@babel+core@7.16.7:
resolution: {integrity: sha512-wMDoBJ6uG4u4PNFh72Ty6t3EgfA91puCuAwKIazbQlci+ENb/UU9A3xG5lutjUIiXCIn1CY5L15r9LimiJyrSA==}
/babel-plugin-polyfill-corejs2/0.3.1_@babel+core@7.16.7:
resolution: {integrity: sha512-v7/T6EQcNfVLfcN2X8Lulb7DjprieyLWJK/zOWH5DUYcAgex9sP3h25Q+DLsX9TloXe3y1O8l2q2Jv9q8UVB9w==}
peerDependencies:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/compat-data': 7.16.8
'@babel/core': 7.16.7
'@babel/helper-define-polyfill-provider': 0.3.0_@babel+core@7.16.7
'@babel/helper-define-polyfill-provider': 0.3.1_@babel+core@7.16.7
semver: 6.3.0
transitivePeerDependencies:
- supports-color
dev: true
/babel-plugin-polyfill-corejs3/0.5.0_@babel+core@7.16.7:
resolution: {integrity: sha512-Hcrgnmkf+4JTj73GbK3bBhlVPiLL47owUAnoJIf69Hakl3q+KfodbDXiZWGMM7iqCZTxCG3Z2VRfPNYES4rXqQ==}
/babel-plugin-polyfill-corejs3/0.5.1_@babel+core@7.16.7:
resolution: {integrity: sha512-TihqEe4sQcb/QcPJvxe94/9RZuLQuF1+To4WqQcRvc+3J3gLCPIPgDKzGLG6zmQLfH3nn25heRuDNkS2KR4I8A==}
peerDependencies:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/core': 7.16.7
'@babel/helper-define-polyfill-provider': 0.3.0_@babel+core@7.16.7
core-js-compat: 3.20.2
'@babel/helper-define-polyfill-provider': 0.3.1_@babel+core@7.16.7
core-js-compat: 3.20.3
transitivePeerDependencies:
- supports-color
dev: true
/babel-plugin-polyfill-regenerator/0.3.0_@babel+core@7.16.7:
resolution: {integrity: sha512-dhAPTDLGoMW5/84wkgwiLRwMnio2i1fUe53EuvtKMv0pn2p3S8OCoV1xAzfJPl0KOX7IB89s2ib85vbYiea3jg==}
/babel-plugin-polyfill-regenerator/0.3.1_@babel+core@7.16.7:
resolution: {integrity: sha512-Y2B06tvgHYt1x0yz17jGkGeeMr5FeKUu+ASJ+N6nB5lQ8Dapfg42i0OVrf8PNGJ3zKL4A23snMi1IRwrqqND7A==}
peerDependencies:
'@babel/core': ^7.0.0-0
dependencies:
'@babel/core': 7.16.7
'@babel/helper-define-polyfill-provider': 0.3.0_@babel+core@7.16.7
'@babel/helper-define-polyfill-provider': 0.3.1_@babel+core@7.16.7
transitivePeerDependencies:
- supports-color
dev: true
@@ -2466,8 +2487,8 @@ packages:
toggle-selection: 1.0.6
dev: false
/core-js-compat/3.20.2:
resolution: {integrity: sha512-qZEzVQ+5Qh6cROaTPFLNS4lkvQ6mBzE3R6A6EEpssj7Zr2egMHgsy4XapdifqJDGC9CBiNv7s+ejI96rLNQFdg==}
/core-js-compat/3.20.3:
resolution: {integrity: sha512-c8M5h0IkNZ+I92QhIpuSijOxGAcj3lgpsWdkCqmUTZNwidujF4r3pi6x1DCN+Vcs5qTS2XWWMfWSuCqyupX8gw==}
dependencies:
browserslist: 4.19.1
semver: 7.0.0
@@ -2937,13 +2958,13 @@ packages:
eslint: 7.32.0
dev: true
/eslint-config-prettier/8.3.0_eslint@8.6.0:
/eslint-config-prettier/8.3.0_eslint@8.7.0:
resolution: {integrity: sha512-BgZuLUSeKzvlL/VUjx/Yb787VQ26RU3gGjA3iiFvdsp/2bMfVIWUVP7tjxtjS0e+HP409cPlPvNkQloz8C91ew==}
hasBin: true
peerDependencies:
eslint: '>=7.0.0'
dependencies:
eslint: 8.6.0
eslint: 8.7.0
dev: true
/eslint-import-resolver-alias/1.1.2_eslint-plugin-import@2.25.4:
@@ -2952,7 +2973,7 @@ packages:
peerDependencies:
eslint-plugin-import: '>=1.4.0'
dependencies:
eslint-plugin-import: 2.25.4_eslint@8.6.0
eslint-plugin-import: 2.25.4_eslint@8.7.0
dev: true
/eslint-import-resolver-babel-module/5.3.1_e51044130ac762fd207a8cd2109b5344:
@@ -2992,7 +3013,7 @@ packages:
- supports-color
dev: true
/eslint-import-resolver-typescript/2.5.0_b5a36b8c1535387c8dd00eff7ec6b551:
/eslint-import-resolver-typescript/2.5.0_9ff7dbcc486b497d34e34a545c49272a:
resolution: {integrity: sha512-qZ6e5CFr+I7K4VVhQu3M/9xGv9/YmwsEXrsm3nimw8vWaVHRDrQRp26BgCypTxBp3vUp4o5aVEJRiy0F2DFddQ==}
engines: {node: '>=4'}
peerDependencies:
@@ -3000,8 +3021,8 @@ packages:
eslint-plugin-import: '*'
dependencies:
debug: 4.3.3
eslint: 8.6.0
eslint-plugin-import: 2.25.4_eslint@8.6.0
eslint: 8.7.0
eslint-plugin-import: 2.25.4_eslint@8.7.0
glob: 7.2.0
is-glob: 4.0.3
resolve: 1.21.0
@@ -3040,7 +3061,7 @@ packages:
tsconfig-paths: 3.12.0
dev: true
/eslint-plugin-import/2.25.4_eslint@8.6.0:
/eslint-plugin-import/2.25.4_eslint@8.7.0:
resolution: {integrity: sha512-/KJBASVFxpu0xg1kIBn9AUa8hQVnszpwgE7Ld0lKAlx7Ie87yzEzCgSkekt+le/YVhiaosO4Y14GDAOc41nfxA==}
engines: {node: '>=4'}
peerDependencies:
@@ -3050,7 +3071,7 @@ packages:
array.prototype.flat: 1.2.5
debug: 2.6.9
doctrine: 2.1.0
eslint: 8.6.0
eslint: 8.7.0
eslint-import-resolver-node: 0.3.6
eslint-module-utils: 2.7.2
has: 1.0.3
@@ -3071,13 +3092,13 @@ packages:
eslint: 7.32.0
dev: true
/eslint-plugin-react-hooks/4.3.0_eslint@8.6.0:
/eslint-plugin-react-hooks/4.3.0_eslint@8.7.0:
resolution: {integrity: sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==}
engines: {node: '>=10'}
peerDependencies:
eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0
dependencies:
eslint: 8.6.0
eslint: 8.7.0
dev: true
/eslint-plugin-react/7.28.0_eslint@7.32.0:
@@ -3103,7 +3124,7 @@ packages:
string.prototype.matchall: 4.0.6
dev: true
/eslint-plugin-react/7.28.0_eslint@8.6.0:
/eslint-plugin-react/7.28.0_eslint@8.7.0:
resolution: {integrity: sha512-IOlFIRHzWfEQQKcAD4iyYDndHwTQiCMcJVJjxempf203jnNLUnW34AXLrV33+nEXoifJE2ZEGmcjKPL8957eSw==}
engines: {node: '>=4'}
peerDependencies:
@@ -3112,7 +3133,7 @@ packages:
array-includes: 3.1.4
array.prototype.flatmap: 1.2.5
doctrine: 2.1.0
eslint: 8.6.0
eslint: 8.7.0
estraverse: 5.3.0
jsx-ast-utils: 3.2.1
minimatch: 3.0.4
@@ -3159,13 +3180,13 @@ packages:
eslint-visitor-keys: 2.1.0
dev: true
/eslint-utils/3.0.0_eslint@8.6.0:
/eslint-utils/3.0.0_eslint@8.7.0:
resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==}
engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0}
peerDependencies:
eslint: '>=5'
dependencies:
eslint: 8.6.0
eslint: 8.7.0
eslint-visitor-keys: 2.1.0
dev: true
@@ -3179,8 +3200,8 @@ packages:
engines: {node: '>=10'}
dev: true
/eslint-visitor-keys/3.1.0:
resolution: {integrity: sha512-yWJFpu4DtjsWKkt5GeNBBuZMlNcYVs6vRCLoCVEJrTjaSB6LC98gFipNK/erM2Heg/E8mIK+hXG/pJMLK+eRZA==}
/eslint-visitor-keys/3.2.0:
resolution: {integrity: sha512-IOzT0X126zn7ALX0dwFiUQEdsfzrm4+ISsQS8nukaJXwEyYKRSnEIIDULYg1mCtGp7UUXgfGl7BIolXREQK+XQ==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dev: true
@@ -3233,8 +3254,8 @@ packages:
- supports-color
dev: true
/eslint/8.6.0:
resolution: {integrity: sha512-UvxdOJ7mXFlw7iuHZA4jmzPaUqIw54mZrv+XPYKNbKdLR0et4rf60lIZUU9kiNtnzzMzGWxMV+tQ7uG7JG8DPw==}
/eslint/8.7.0:
resolution: {integrity: sha512-ifHYzkBGrzS2iDU7KjhCAVMGCvF6M3Xfs8X8b37cgrUlDt6bWRTpRh6T/gtSXv1HJ/BUGgmjvNvOEGu85Iif7w==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
hasBin: true
dependencies:
@@ -3245,11 +3266,10 @@ packages:
cross-spawn: 7.0.3
debug: 4.3.3
doctrine: 3.0.0
enquirer: 2.3.6
escape-string-regexp: 4.0.0
eslint-scope: 7.1.0
eslint-utils: 3.0.0_eslint@8.6.0
eslint-visitor-keys: 3.1.0
eslint-utils: 3.0.0_eslint@8.7.0
eslint-visitor-keys: 3.2.0
espree: 9.3.0
esquery: 1.4.0
esutils: 2.0.3
@@ -3258,7 +3278,7 @@ packages:
functional-red-black-tree: 1.0.1
glob-parent: 6.0.2
globals: 13.12.0
ignore: 4.0.6
ignore: 5.2.0
import-fresh: 3.3.0
imurmurhash: 0.1.4
is-glob: 4.0.3
@@ -3269,9 +3289,7 @@ packages:
minimatch: 3.0.4
natural-compare: 1.4.0
optionator: 0.9.1
progress: 2.0.3
regexpp: 3.2.0
semver: 7.3.5
strip-ansi: 6.0.1
strip-json-comments: 3.1.1
text-table: 0.2.0
@@ -3295,7 +3313,7 @@ packages:
dependencies:
acorn: 8.7.0
acorn-jsx: 5.3.2_acorn@8.7.0
eslint-visitor-keys: 3.1.0
eslint-visitor-keys: 3.2.0
dev: true
/esprima/4.0.1:
@@ -5350,7 +5368,7 @@ packages:
resolution: {integrity: sha512-s/fitrbVeEyHKFa7mFdkuQMWlH1Wgw/yEXMt5xACT4ZpzWFluehAxRtUUQKPuWhaLAWhFcVx6w3oC8VKaUfPGA==}
engines: {node: '>=10.0.0'}
dependencies:
ajv: 8.8.2
ajv: 8.9.0
lodash.truncate: 4.4.2
slice-ansi: 4.0.0
string-width: 4.2.3
@@ -5499,6 +5517,12 @@ packages:
resolution: {integrity: sha512-ppJZNDuKGgxzkHihX8v9v9G5f+18gzaTfrukGrq6ueg0lmH4nqVnA2IPG0AEH3jKEk2GRJCUhDoqpoiw3PHLBA==}
dev: false
/tippy.js/6.3.7:
resolution: {integrity: sha512-E1d3oP2emgJ9dRQZdf3Kkn0qJgI6ZLpyS5z6ZkY1DF3kaQaBsGZsndEpHwx+eC+tYM41HaSNvNtLx8tU57FzTQ==}
dependencies:
'@popperjs/core': 2.11.2
dev: false
/to-fast-properties/2.0.0:
resolution: {integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=}
engines: {node: '>=4'}
@@ -5684,6 +5708,14 @@ packages:
- rollup
dev: true
/vite-plugin-environment/1.1.0_vite@2.7.12:
resolution: {integrity: sha512-ay0vYB8DEB7xB5sqVzOgLyTaGH5jbnvghzoDBmHvMx2Y2k1WUl0QQUuyu7oeiKnmIJDc8ciklhVcGc4lXMKyiA==}
peerDependencies:
vite: ^2.7
dependencies:
vite: 2.7.12
dev: false
/vite-plugin-pwa/0.11.13_vite@2.7.12:
resolution: {integrity: sha512-Ssj14m3TRVLfkFEAWSMcFE2d1cSdEZyrVTzfY2lSL+umHYvcIFHVDAY143sygtBCb44OPczsAOmWwBTxwOvh7g==}
peerDependencies:
@@ -5822,7 +5854,7 @@ packages:
resolution: {integrity: sha512-WMdYLhDIsuzViOTXDH+tJ1GijkFp5khSYolnxR/11zmfhNDtuo7jof72xPGFy+KRpsz6tug39RhivCj77qqO0w==}
engines: {node: '>=10.0.0'}
dependencies:
'@apideck/better-ajv-errors': 0.3.2_ajv@8.8.2
'@apideck/better-ajv-errors': 0.3.2_ajv@8.9.0
'@babel/core': 7.16.7
'@babel/preset-env': 7.16.8_@babel+core@7.16.7
'@babel/runtime': 7.16.7
@@ -5830,7 +5862,7 @@ packages:
'@rollup/plugin-node-resolve': 11.2.1_rollup@2.64.0
'@rollup/plugin-replace': 2.4.2_rollup@2.64.0
'@surma/rollup-plugin-off-main-thread': 2.2.3
ajv: 8.8.2
ajv: 8.9.0
common-tags: 1.8.2
fast-json-stable-stringify: 2.1.0
fs-extra: 9.1.0

14
src/components/generic/Tooltip.tsx Normal file
View File

@@ -0,0 +1,14 @@
import 'tippy.js/dist/tippy.css';
import type React from 'react';
import Tippy from '@tippyjs/react';
export interface TooltipProps {
children: JSX.Element;
contents: string;
}
export const Tooltip = ({ children, contents }: TooltipProps): JSX.Element => {
return <Tippy content={contents}>{children}</Tippy>;
};

151
src/components/menu/BottomNav.tsx
View File

@@ -8,7 +8,13 @@ import {
FiMoon,
FiSun,
FiWifi,
FiX,
} from 'react-icons/fi';
import {
RiArrowDownLine,
RiArrowUpDownLine,
RiArrowUpLine,
} from 'react-icons/ri';
import {
connType,
@@ -17,7 +23,9 @@ import {
} from '@app/core/slices/appSlice';
import { useAppDispatch } from '@hooks/useAppDispatch';
import { useAppSelector } from '@hooks/useAppSelector';
import { Types } from '@meshtastic/meshtasticjs';
import { Protobuf, Types } from '@meshtastic/meshtasticjs';
import { Tooltip } from '../generic/Tooltip';
// export interface BottomNavProps {
@@ -27,70 +35,97 @@ export const BottomNav = (): JSX.Element => {
const dispatch = useAppDispatch();
const meshtasticState = useAppSelector((state) => state.meshtastic);
const appState = useAppSelector((state) => state.app);
// @ts-ignore define version string global
const version = window.__COMMIT_HASH__ as string;
const primaryChannelSettings = useAppSelector(
(state) => state.meshtastic.radio.channels,
).find((channel) => channel.channel.role === Protobuf.Channel_Role.PRIMARY)
?.channel.settings;
return (
<div className="flex justify-between bg-white border-t border-gray-300 dark:bg-secondaryDark dark:border-gray-600">
<div
className={`flex p-1 cursor-pointer group w-min hover:bg-opacity-80 ${
[
Types.DeviceStatusEnum.DEVICE_CONNECTED,
Types.DeviceStatusEnum.DEVICE_CONFIGURED,
].includes(meshtasticState.deviceStatus)
? 'bg-primary'
: [
Types.DeviceStatusEnum.DEVICE_CONNECTING,
Types.DeviceStatusEnum.DEVICE_RECONNECTING,
Types.DeviceStatusEnum.DEVICE_CONFIGURING,
<div className="flex">
<Tooltip contents={`Connection Status`}>
<div
className={`flex p-1 cursor-pointer group w-min hover:bg-opacity-80 ${
[
Types.DeviceStatusEnum.DEVICE_CONNECTED,
Types.DeviceStatusEnum.DEVICE_CONFIGURED,
].includes(meshtasticState.deviceStatus)
? 'bg-yellow-400'
: 'bg-gray-400'
}`}
onClick={(): void => {
dispatch(dispatch(openConnectionModal()));
}}
>
{appState.connType === connType.BLE ? (
<FiBluetooth className="mr-1 p-0.5 group-active:scale-90" />
) : appState.connType === connType.SERIAL ? (
<FiCpu className="mr-1 p-0.5 group-active:scale-90" />
) : (
<FiWifi className="mr-1 p-0.5 group-active:scale-90" />
)}
<div className="text-xs font-medium truncate group-active:scale-90">
{meshtasticState.nodes.find(
(node) => node.number === meshtasticState.radio.hardware.myNodeNum,
)?.user?.longName ?? 'Disconnected'}
</div>
? 'bg-primary'
: [
Types.DeviceStatusEnum.DEVICE_CONNECTING,
Types.DeviceStatusEnum.DEVICE_RECONNECTING,
Types.DeviceStatusEnum.DEVICE_CONFIGURING,
].includes(meshtasticState.deviceStatus)
? 'bg-yellow-400'
: 'bg-gray-400'
}`}
onClick={(): void => {
dispatch(dispatch(openConnectionModal()));
}}
>
{appState.connType === connType.BLE ? (
<FiBluetooth className="mr-1 p-0.5 group-active:scale-90" />
) : appState.connType === connType.SERIAL ? (
<FiCpu className="mr-1 p-0.5 group-active:scale-90" />
) : (
<FiWifi className="mr-1 p-0.5 group-active:scale-90" />
)}
<div className="text-xs font-medium truncate group-active:scale-90">
{meshtasticState.nodes.find(
(node) =>
node.number === meshtasticState.radio.hardware.myNodeNum,
)?.user?.longName ?? 'Disconnected'}
</div>
</div>
</Tooltip>
<Tooltip contents={`MQTT Status`}>
<div className="flex p-1 border-r border-gray-300 cursor-pointer select-none group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark">
{primaryChannelSettings?.uplinkEnabled &&
primaryChannelSettings?.downlinkEnabled ? (
<RiArrowUpDownLine className="p-0.5 group-active:scale-90" />
) : primaryChannelSettings?.uplinkEnabled ? (
<RiArrowUpLine className="p-0.5 group-active:scale-90" />
) : primaryChannelSettings?.downlinkEnabled ? (
<RiArrowDownLine className="p-0.5 group-active:scale-90" />
) : (
<FiX className="p-0.5" />
)}
</div>
</Tooltip>
</div>
<div className="flex">
<a
href={`https://github.com/meshtastic/meshtastic-web/commit/${version}`}
target="_blank"
rel="noreferrer"
className="flex p-1 border-l border-gray-300 cursor-pointer select-none group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark"
>
<FiGitBranch className="p-0.5 mr-1 group-active:scale-90" />
<p className="text-xs opacity-60">{version}</p>
</a>
<div className="flex p-1 border-l border-gray-300 cursor-pointer select-none group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark">
<FiBell className="p-0.5 mr-1 group-active:scale-90" />
<p className="text-xs opacity-60">Example Notification</p>
</div>
<div
className="p-1 border-l border-gray-300 cursor-pointer group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark"
onClick={(): void => {
dispatch(setDarkModeEnabled(!appState.darkMode));
}}
>
{appState.darkMode ? (
<FiSun className="p-0.5 group-active:scale-90" />
) : (
<FiMoon className="p-0.5 group-active:scale-90" />
)}
</div>
<Tooltip contents={`Current Commit`}>
<a
href={`https://github.com/meshtastic/meshtastic-web/commit/${process.env.COMMIT_HASH}`}
target="_blank"
rel="noreferrer"
className="flex p-1 border-l border-gray-300 cursor-pointer select-none group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark"
>
<FiGitBranch className="p-0.5 mr-1 group-active:scale-90" />
<p className="text-xs opacity-60">{process.env.COMMIT_HASH}</p>
</a>
</Tooltip>
<Tooltip contents={`Notifications`}>
<div className="flex p-1 border-l border-gray-300 cursor-pointer select-none group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark">
<FiBell className="p-0.5 mr-1 group-active:scale-90" />
<p className="text-xs opacity-60">Example Notification</p>
</div>
</Tooltip>
<Tooltip contents={`Toggle Theme`}>
<div
className="p-1 border-l border-gray-300 cursor-pointer group dark:border-gray-600 dark:text-white hover:bg-gray-200 dark:hover:bg-primaryDark"
onClick={(): void => {
dispatch(setDarkModeEnabled(!appState.darkMode));
}}
>
{appState.darkMode ? (
<FiSun className="p-0.5 group-active:scale-90" />
) : (
<FiMoon className="p-0.5 group-active:scale-90" />
)}
</div>
</Tooltip>
</div>
</div>
);

5
src/pages/Nodes/Sidebar.tsx
View File

@@ -110,7 +110,10 @@ export const Sidebar = ({ node, closeSidebar }: SidebarProps): JSX.Element => {
icon={isCopied ? <FiCheck /> : <FiClipboard />}
/>
</div>
<JSONPretty className="max-w-sm overflow-auto" data={node} />
<JSONPretty
className="h-screen max-w-sm pb-40 overflow-y-auto"
data={node}
/>
</Tab.Panel>
</Tab.Panels>
</Tab.Group>

10
vite.config.ts
View File

@@ -2,19 +2,17 @@ import { execSync } from 'child_process';
import path from 'path';
import { defineConfig } from 'vite';
import importToCDN from 'vite-plugin-cdn-import';
import EnvironmentPlugin from 'vite-plugin-environment';
import { VitePWA } from 'vite-plugin-pwa';
import react from '@vitejs/plugin-react';
// https://vitejs.dev/config/
export default defineConfig({
define: {
__COMMIT_HASH__: JSON.stringify(
execSync('git rev-parse --short HEAD').toString().trim(),
),
},
plugins: [
react(),
EnvironmentPlugin({
COMMIT_HASH: execSync('git rev-parse --short HEAD').toString().trim(),
}),
importToCDN({
modules: [
{