From 332c759ed08f4deebde1f9a6ea23edee7180ce22 Mon Sep 17 00:00:00 2001 From: Sean Edmunds Date: Fri, 28 Mar 2025 14:25:33 -0500 Subject: [PATCH] Mobile and style improvements --- package-lock.json | 203 ++++++++++------- package.json | 18 +- .../WeatherModal/CurrentWeather.tsx | 78 +++++-- .../WeatherModal/ExtendedForecast.tsx | 35 ++- src/components/WeatherModal/WeatherGraphs.tsx | 8 +- src/components/WeatherModal/WeatherModal.tsx | 17 +- .../homepage/components/Header/Header.tsx | 13 +- .../homepage/components/Search/Search.tsx | 14 +- src/pages/settings/Settings.tsx | 6 +- .../components/Applications/Applications.tsx | 207 +++++++++--------- .../Applications/DebouncedApplication.tsx | 4 +- .../components/Bookmarks/Bookmarks.tsx | 134 ++++++------ .../Bookmarks/DebouncedGroupSettingsItem.tsx | 184 ++++++++-------- .../settings/components/Messages/Messages.tsx | 89 ++++---- .../components/Search/SearchProviders.tsx | 128 +++++------ .../components/Theming/ThemeModal.tsx | 4 +- .../components/Theming/ThemePlaylistCard.tsx | 13 +- .../components/Theming/ThemePlaylists.tsx | 2 +- .../settings/components/Theming/Themes.tsx | 4 +- .../components/WoL/WolClientSettingsItem.tsx | 4 +- .../settings/components/WoL/WolClients.tsx | 126 +++++------ src/styles/Text.module.css | 21 ++ src/styles/TextInput.module.css | 3 + 23 files changed, 743 insertions(+), 572 deletions(-) diff --git a/package-lock.json b/package-lock.json index c96e123..7e9722c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,12 +10,12 @@ "dependencies": { "@hello-pangea/dnd": "^18.0.1", "@iconify/react": "^5.2.0", - "@mantine/core": "^7.17.2", - "@mantine/hooks": "^7.17.2", + "@mantine/core": "^7.17.3", + "@mantine/hooks": "^7.17.3", "@tabler/icons-react": "^3.31.0", - "@tanstack/react-query": "^5.69.0", - "@tanstack/react-query-devtools": "^5.69.0", - "@tanstack/react-query-persist-client": "^5.69.0", + "@tanstack/react-query": "^5.69.3", + "@tanstack/react-query-devtools": "^5.69.3", + "@tanstack/react-query-persist-client": "^5.69.3", "idb-keyval": "^6.2.1", "jotai": "^2.12.2", "react": "^19.0.0", @@ -27,11 +27,11 @@ "recharts": "^2.15.1" }, "devDependencies": { - "@types/node": "^22.13.11", + "@types/node": "^22.13.14", "@types/react": "^19.0.12", "@types/react-dom": "^19.0.4", - "@typescript-eslint/eslint-plugin": "^8.27.0", - "@typescript-eslint/parser": "^8.27.0", + "@typescript-eslint/eslint-plugin": "^8.28.0", + "@typescript-eslint/parser": "^8.28.0", "@vitejs/plugin-react": "^4.3.4", "@vitest/coverage-v8": "^3.0.9", "@vitest/ui": "^3.0.9", @@ -39,7 +39,7 @@ "eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-refresh": "^0.4.19", "typescript": "^5.8.2", - "vite": "^6.2.2", + "vite": "^6.2.3", "vite-plugin-dts": "~4.5.3", "vite-plugin-eslint": "^1.8.1", "vite-tsconfig-paths": "^5.1.4", @@ -1180,9 +1180,10 @@ } }, "node_modules/@mantine/core": { - "version": "7.17.2", - "resolved": "https://registry.npmjs.org/@mantine/core/-/core-7.17.2.tgz", - "integrity": "sha512-R6MYhitJ0JEgrhadd31Nw9FhRaQwDHjXUs5YIlitKH/fTOz9gKSxKjzmNng3bEBQCcbEDOkZj3FRcBgTUh/F0Q==", + "version": "7.17.3", + "resolved": "https://registry.npmjs.org/@mantine/core/-/core-7.17.3.tgz", + "integrity": "sha512-N/AfV5eMnfEMx9WzI7AU5pNFBEzAfT/KtE2XDKS+0ht6RifUmolIxyIvoGMYz2yUEsCBMJZqmBq33Rabf5W7Ug==", + "license": "MIT", "dependencies": { "@floating-ui/react": "^0.26.28", "clsx": "^2.1.1", @@ -1192,15 +1193,16 @@ "type-fest": "^4.27.0" }, "peerDependencies": { - "@mantine/hooks": "7.17.2", + "@mantine/hooks": "7.17.3", "react": "^18.x || ^19.x", "react-dom": "^18.x || ^19.x" } }, "node_modules/@mantine/hooks": { - "version": "7.17.2", - "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-7.17.2.tgz", - "integrity": "sha512-tbErVcGZu0E4dSmE6N0k6Tv1y9R3SQmmQgwqorcc+guEgKMdamc36lucZGlJnSGUmGj+WLUgELkEQ0asdfYBDA==", + "version": "7.17.3", + "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-7.17.3.tgz", + "integrity": "sha512-6o65Rbfl8jd1C1nF9icvungqL0qZViEOmrZgkyKXxBYkC3x91fz4zftwQgNjt1tZHWDNO6Bo4GpRjJyAdwl48g==", + "license": "MIT", "peerDependencies": { "react": "^18.x || ^19.x" } @@ -1349,6 +1351,7 @@ "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", "dev": true, + "license": "MIT", "dependencies": { "@nodelib/fs.stat": "2.0.5", "run-parallel": "^1.1.9" @@ -1362,6 +1365,7 @@ "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", "dev": true, + "license": "MIT", "engines": { "node": ">= 8" } @@ -1371,6 +1375,7 @@ "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", "dev": true, + "license": "MIT", "dependencies": { "@nodelib/fs.scandir": "2.1.5", "fastq": "^1.6.0" @@ -1608,9 +1613,10 @@ } }, "node_modules/@tanstack/query-core": { - "version": "5.69.0", - "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.69.0.tgz", - "integrity": "sha512-Kn410jq6vs1P8Nm+ZsRj9H+U3C0kjuEkYLxbiCyn3MDEiYor1j2DGVULqAz62SLZtUZ/e9Xt6xMXiJ3NJ65WyQ==", + "version": "5.69.2", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.69.2.tgz", + "integrity": "sha512-+spKBqGMSxVMhYPMHr4L7efc4CDdb0Y8nE4UxP/FjV4V3ajP3uhBsh0T7pSuObBgYkU+nY1PRkJhKNmwlHmkUg==", + "license": "MIT", "funding": { "type": "github", "url": "https://github.com/sponsors/tannerlinsley" @@ -1626,11 +1632,12 @@ } }, "node_modules/@tanstack/query-persist-client-core": { - "version": "5.69.0", - "resolved": "https://registry.npmjs.org/@tanstack/query-persist-client-core/-/query-persist-client-core-5.69.0.tgz", - "integrity": "sha512-OisxDgcDH0ajswGBA+TXXSn5uzll1EaCB6/MQH+2+t4JqR/qq5TS8nh6A7pas/GBFB01kNpgKRYmZp0tkKVtOg==", + "version": "5.69.2", + "resolved": "https://registry.npmjs.org/@tanstack/query-persist-client-core/-/query-persist-client-core-5.69.2.tgz", + "integrity": "sha512-RxKv+FTKzRMtL3veHvLjQdy+kaYHxAyfV+Gg/1Lj/t61iUqdhzF4lFFctfGDSKrzvEIsg/JwJDfmYvScjNloMw==", + "license": "MIT", "dependencies": { - "@tanstack/query-core": "5.69.0" + "@tanstack/query-core": "5.69.2" }, "funding": { "type": "github", @@ -1638,11 +1645,12 @@ } }, "node_modules/@tanstack/react-query": { - "version": "5.69.0", - "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.69.0.tgz", - "integrity": "sha512-Ift3IUNQqTcaFa1AiIQ7WCb/PPy8aexZdq9pZWLXhfLcLxH0+PZqJ2xFImxCpdDZrFRZhLJrh76geevS5xjRhA==", + "version": "5.69.3", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.69.3.tgz", + "integrity": "sha512-EozCj1aFM/c827GQbVnvEt2x80oBax1vd2e5s/2EDeD469AZW9BPAyRK9VVyD0I1yvO6vOI+tPKXXFcadbSXvA==", + "license": "MIT", "dependencies": { - "@tanstack/query-core": "5.69.0" + "@tanstack/query-core": "5.69.2" }, "funding": { "type": "github", @@ -1653,9 +1661,10 @@ } }, "node_modules/@tanstack/react-query-devtools": { - "version": "5.69.0", - "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.69.0.tgz", - "integrity": "sha512-sYklnou3IKAemqB5wJeBwjmG5bUGDKAL5/I4pVA+aqSnsNibVLt8/pAU976uuJ5K71w71bHtI/AMxiIs3gtkEA==", + "version": "5.69.3", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.69.3.tgz", + "integrity": "sha512-BQ37OAnG4+2zZjz7ot2A6FIerOOVMTQaMgAgcZYyxKNHrwTEsQ4e+vpmticBig4NUSK3CNSD4wGPVqSEppe+Bw==", + "license": "MIT", "dependencies": { "@tanstack/query-devtools": "5.67.2" }, @@ -1664,23 +1673,24 @@ "url": "https://github.com/sponsors/tannerlinsley" }, "peerDependencies": { - "@tanstack/react-query": "^5.69.0", + "@tanstack/react-query": "^5.69.3", "react": "^18 || ^19" } }, "node_modules/@tanstack/react-query-persist-client": { - "version": "5.69.0", - "resolved": "https://registry.npmjs.org/@tanstack/react-query-persist-client/-/react-query-persist-client-5.69.0.tgz", - "integrity": "sha512-/uIblBRwnpms6Xu+71Jy+2V+iuWrSyDfeYVNp8kbyYOKP9135ii/S80+EXBGeM/jx7+vizRGORaq4kKuKXo6Sw==", + "version": "5.69.3", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-persist-client/-/react-query-persist-client-5.69.3.tgz", + "integrity": "sha512-7grYKVT4JwjlGHv0aFVefcWjU9TSF0N6h4pwEEszlByvr2105j78f/hJLypASk4o661YlNLnm+5sLaAc94q7wA==", + "license": "MIT", "dependencies": { - "@tanstack/query-persist-client-core": "5.69.0" + "@tanstack/query-persist-client-core": "5.69.2" }, "funding": { "type": "github", "url": "https://github.com/sponsors/tannerlinsley" }, "peerDependencies": { - "@tanstack/react-query": "^5.69.0", + "@tanstack/react-query": "^5.69.3", "react": "^18 || ^19" } }, @@ -1813,10 +1823,11 @@ "dev": true }, "node_modules/@types/node": { - "version": "22.13.11", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.13.11.tgz", - "integrity": "sha512-iEUCUJoU0i3VnrCmgoWCXttklWcvoCIx4jzcP22fioIVSdTmjgoEvmAO/QPw6TcS9k5FrNgn4w7q5lGOd1CT5g==", + "version": "22.13.14", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.13.14.tgz", + "integrity": "sha512-Zs/Ollc1SJ8nKUAgc7ivOEdIBM8JAKgrqqUYi2J997JuKO7/tpQC+WCetQ1sypiKCQWHdvdg9wBNpUPEWZae7w==", "dev": true, + "license": "MIT", "dependencies": { "undici-types": "~6.20.0" } @@ -1846,16 +1857,17 @@ "license": "MIT" }, "node_modules/@typescript-eslint/eslint-plugin": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.27.0.tgz", - "integrity": "sha512-4henw4zkePi5p252c8ncBLzLce52SEUz2Ebj8faDnuUXz2UuHEONYcJ+G0oaCF+bYCWVZtrGzq3FD7YXetmnSA==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.28.0.tgz", + "integrity": "sha512-lvFK3TCGAHsItNdWZ/1FkvpzCxTHUVuFrdnOGLMa0GGCFIbCgQWVk3CzCGdA7kM3qGVc+dfW9tr0Z/sHnGDFyg==", "dev": true, + "license": "MIT", "dependencies": { "@eslint-community/regexpp": "^4.10.0", - "@typescript-eslint/scope-manager": "8.27.0", - "@typescript-eslint/type-utils": "8.27.0", - "@typescript-eslint/utils": "8.27.0", - "@typescript-eslint/visitor-keys": "8.27.0", + "@typescript-eslint/scope-manager": "8.28.0", + "@typescript-eslint/type-utils": "8.28.0", + "@typescript-eslint/utils": "8.28.0", + "@typescript-eslint/visitor-keys": "8.28.0", "graphemer": "^1.4.0", "ignore": "^5.3.1", "natural-compare": "^1.4.0", @@ -1875,15 +1887,16 @@ } }, "node_modules/@typescript-eslint/parser": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.27.0.tgz", - "integrity": "sha512-XGwIabPallYipmcOk45DpsBSgLC64A0yvdAkrwEzwZ2viqGqRUJ8eEYoPz0CWnutgAFbNMPdsGGvzjSmcWVlEA==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.28.0.tgz", + "integrity": "sha512-LPcw1yHD3ToaDEoljFEfQ9j2xShY367h7FZ1sq5NJT9I3yj4LHer1Xd1yRSOdYy9BpsrxU7R+eoDokChYM53lQ==", "dev": true, + "license": "MIT", "dependencies": { - "@typescript-eslint/scope-manager": "8.27.0", - "@typescript-eslint/types": "8.27.0", - "@typescript-eslint/typescript-estree": "8.27.0", - "@typescript-eslint/visitor-keys": "8.27.0", + "@typescript-eslint/scope-manager": "8.28.0", + "@typescript-eslint/types": "8.28.0", + "@typescript-eslint/typescript-estree": "8.28.0", + "@typescript-eslint/visitor-keys": "8.28.0", "debug": "^4.3.4" }, "engines": { @@ -1899,13 +1912,14 @@ } }, "node_modules/@typescript-eslint/scope-manager": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.27.0.tgz", - "integrity": "sha512-8oI9GwPMQmBryaaxG1tOZdxXVeMDte6NyJA4i7/TWa4fBwgnAXYlIQP+uYOeqAaLJ2JRxlG9CAyL+C+YE9Xknw==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.28.0.tgz", + "integrity": "sha512-u2oITX3BJwzWCapoZ/pXw6BCOl8rJP4Ij/3wPoGvY8XwvXflOzd1kLrDUUUAIEdJSFh+ASwdTHqtan9xSg8buw==", "dev": true, + "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.27.0", - "@typescript-eslint/visitor-keys": "8.27.0" + "@typescript-eslint/types": "8.28.0", + "@typescript-eslint/visitor-keys": "8.28.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -1916,13 +1930,14 @@ } }, "node_modules/@typescript-eslint/type-utils": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.27.0.tgz", - "integrity": "sha512-wVArTVcz1oJOIEJxui/nRhV0TXzD/zMSOYi/ggCfNq78EIszddXcJb7r4RCp/oBrjt8n9A0BSxRMKxHftpDxDA==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.28.0.tgz", + "integrity": "sha512-oRoXu2v0Rsy/VoOGhtWrOKDiIehvI+YNrDk5Oqj40Mwm0Yt01FC/Q7nFqg088d3yAsR1ZcZFVfPCTTFCe/KPwg==", "dev": true, + "license": "MIT", "dependencies": { - "@typescript-eslint/typescript-estree": "8.27.0", - "@typescript-eslint/utils": "8.27.0", + "@typescript-eslint/typescript-estree": "8.28.0", + "@typescript-eslint/utils": "8.28.0", "debug": "^4.3.4", "ts-api-utils": "^2.0.1" }, @@ -1939,10 +1954,11 @@ } }, "node_modules/@typescript-eslint/types": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.27.0.tgz", - "integrity": "sha512-/6cp9yL72yUHAYq9g6DsAU+vVfvQmd1a8KyA81uvfDE21O2DwQ/qxlM4AR8TSdAu+kJLBDrEHKC5/W2/nxsY0A==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.28.0.tgz", + "integrity": "sha512-bn4WS1bkKEjx7HqiwG2JNB3YJdC1q6Ue7GyGlwPHyt0TnVq6TtD/hiOdTZt71sq0s7UzqBFXD8t8o2e63tXgwA==", "dev": true, + "license": "MIT", "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" }, @@ -1952,13 +1968,14 @@ } }, "node_modules/@typescript-eslint/typescript-estree": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.27.0.tgz", - "integrity": "sha512-BnKq8cqPVoMw71O38a1tEb6iebEgGA80icSxW7g+kndx0o6ot6696HjG7NdgfuAVmVEtwXUr3L8R9ZuVjoQL6A==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.28.0.tgz", + "integrity": "sha512-H74nHEeBGeklctAVUvmDkxB1mk+PAZ9FiOMPFncdqeRBXxk1lWSYraHw8V12b7aa6Sg9HOBNbGdSHobBPuQSuA==", "dev": true, + "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.27.0", - "@typescript-eslint/visitor-keys": "8.27.0", + "@typescript-eslint/types": "8.28.0", + "@typescript-eslint/visitor-keys": "8.28.0", "debug": "^4.3.4", "fast-glob": "^3.3.2", "is-glob": "^4.0.3", @@ -1978,15 +1995,16 @@ } }, "node_modules/@typescript-eslint/utils": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.27.0.tgz", - "integrity": "sha512-njkodcwH1yvmo31YWgRHNb/x1Xhhq4/m81PhtvmRngD8iHPehxffz1SNCO+kwaePhATC+kOa/ggmvPoPza5i0Q==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.28.0.tgz", + "integrity": "sha512-OELa9hbTYciYITqgurT1u/SzpQVtDLmQMFzy/N8pQE+tefOyCWT79jHsav294aTqV1q1u+VzqDGbuujvRYaeSQ==", "dev": true, + "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", - "@typescript-eslint/scope-manager": "8.27.0", - "@typescript-eslint/types": "8.27.0", - "@typescript-eslint/typescript-estree": "8.27.0" + "@typescript-eslint/scope-manager": "8.28.0", + "@typescript-eslint/types": "8.28.0", + "@typescript-eslint/typescript-estree": "8.28.0" }, "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" @@ -2001,12 +2019,13 @@ } }, "node_modules/@typescript-eslint/visitor-keys": { - "version": "8.27.0", - "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.27.0.tgz", - "integrity": "sha512-WsXQwMkILJvffP6z4U3FYJPlbf/j07HIxmDjZpbNvBJkMfvwXj5ACRkkHwBDvLBbDbtX5TdU64/rcvKJ/vuInQ==", + "version": "8.28.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.28.0.tgz", + "integrity": "sha512-hbn8SZ8w4u2pRwgQ1GlUrPKE+t2XvcCW5tTRF7j6SMYIuYG37XuzIW44JCZPa36evi0Oy2SnM664BlIaAuQcvg==", "dev": true, + "license": "MIT", "dependencies": { - "@typescript-eslint/types": "8.27.0", + "@typescript-eslint/types": "8.28.0", "eslint-visitor-keys": "^4.2.0" }, "engines": { @@ -2022,6 +2041,7 @@ "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz", "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==", "dev": true, + "license": "Apache-2.0", "engines": { "node": "^18.18.0 || ^20.9.0 || >=21.1.0" }, @@ -2455,6 +2475,7 @@ "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dev": true, + "license": "MIT", "dependencies": { "fill-range": "^7.1.1" }, @@ -3225,6 +3246,7 @@ "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", "dev": true, + "license": "MIT", "dependencies": { "@nodelib/fs.stat": "^2.0.2", "@nodelib/fs.walk": "^1.2.3", @@ -3241,6 +3263,7 @@ "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", "dev": true, + "license": "ISC", "dependencies": { "is-glob": "^4.0.1" }, @@ -3282,6 +3305,7 @@ "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.19.1.tgz", "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==", "dev": true, + "license": "ISC", "dependencies": { "reusify": "^1.0.4" } @@ -3323,6 +3347,7 @@ "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dev": true, + "license": "MIT", "dependencies": { "to-regex-range": "^5.0.1" }, @@ -3674,6 +3699,7 @@ "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", "dev": true, + "license": "MIT", "engines": { "node": ">=0.12.0" } @@ -4011,6 +4037,7 @@ "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", "dev": true, + "license": "MIT", "engines": { "node": ">= 8" } @@ -4020,6 +4047,7 @@ "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", "dev": true, + "license": "MIT", "dependencies": { "braces": "^3.0.3", "picomatch": "^2.3.1" @@ -4425,7 +4453,8 @@ "type": "consulting", "url": "https://feross.org/support" } - ] + ], + "license": "MIT" }, "node_modules/raf-schd": { "version": "4.0.3", @@ -4786,6 +4815,7 @@ "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", "dev": true, + "license": "MIT", "engines": { "iojs": ">=1.0.0", "node": ">=0.10.0" @@ -4862,6 +4892,7 @@ "url": "https://feross.org/support" } ], + "license": "MIT", "dependencies": { "queue-microtask": "^1.2.2" } @@ -5222,6 +5253,7 @@ "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", "dev": true, + "license": "MIT", "dependencies": { "is-number": "^7.0.0" }, @@ -5499,10 +5531,11 @@ } }, "node_modules/vite": { - "version": "6.2.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.2.tgz", - "integrity": "sha512-yW7PeMM+LkDzc7CgJuRLMW2Jz0FxMOsVJ8Lv3gpgW9WLcb9cTW+121UEr1hvmfR7w3SegR5ItvYyzVz1vxNJgQ==", + "version": "6.2.3", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.3.tgz", + "integrity": "sha512-IzwM54g4y9JA/xAeBPNaDXiBF8Jsgl3VBQ2YQ/wOY6fyW3xMdSoltIV3Bo59DErdqdE6RxUfv8W69DvUorE4Eg==", "dev": true, + "license": "MIT", "dependencies": { "esbuild": "^0.25.0", "postcss": "^8.5.3", diff --git a/package.json b/package.json index 47d7708..50d51de 100644 --- a/package.json +++ b/package.json @@ -12,12 +12,12 @@ "dependencies": { "@hello-pangea/dnd": "^18.0.1", "@iconify/react": "^5.2.0", - "@mantine/core": "^7.17.2", - "@mantine/hooks": "^7.17.2", + "@mantine/core": "^7.17.3", + "@mantine/hooks": "^7.17.3", "@tabler/icons-react": "^3.31.0", - "@tanstack/react-query": "^5.69.0", - "@tanstack/react-query-devtools": "^5.69.0", - "@tanstack/react-query-persist-client": "^5.69.0", + "@tanstack/react-query": "^5.69.3", + "@tanstack/react-query-devtools": "^5.69.3", + "@tanstack/react-query-persist-client": "^5.69.3", "idb-keyval": "^6.2.1", "jotai": "^2.12.2", "react": "^19.0.0", @@ -29,11 +29,11 @@ "recharts": "^2.15.1" }, "devDependencies": { - "@types/node": "^22.13.11", + "@types/node": "^22.13.14", "@types/react": "^19.0.12", "@types/react-dom": "^19.0.4", - "@typescript-eslint/eslint-plugin": "^8.27.0", - "@typescript-eslint/parser": "^8.27.0", + "@typescript-eslint/eslint-plugin": "^8.28.0", + "@typescript-eslint/parser": "^8.28.0", "@vitejs/plugin-react": "^4.3.4", "@vitest/coverage-v8": "^3.0.9", "@vitest/ui": "^3.0.9", @@ -41,7 +41,7 @@ "eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-refresh": "^0.4.19", "typescript": "^5.8.2", - "vite": "^6.2.2", + "vite": "^6.2.3", "vite-plugin-dts": "~4.5.3", "vite-plugin-eslint": "^1.8.1", "vite-tsconfig-paths": "^5.1.4", diff --git a/src/components/WeatherModal/CurrentWeather.tsx b/src/components/WeatherModal/CurrentWeather.tsx index 1a3c516..7b78eac 100644 --- a/src/components/WeatherModal/CurrentWeather.tsx +++ b/src/components/WeatherModal/CurrentWeather.tsx @@ -7,7 +7,7 @@ import { WiBarometer, WiHumidity, WiSunrise, WiSunset } from 'react-icons/wi'; import WeatherIcon from './WeatherIcon'; export default function CurrentWeather({ current }: any) { - const { currentLocation } = useCommonHooks(); + const { currentLocation, isMobile } = useCommonHooks(); const { data: sunStateData } = useSunStateAPI({ lat: currentLocation.lat, lon: currentLocation.lon, @@ -56,7 +56,7 @@ export default function CurrentWeather({ current }: any) { - + - + {current.temperature}°F @@ -89,7 +89,7 @@ export default function CurrentWeather({ current }: any) { {current.textDescription} - + Feels like {current.heatIndex ?? current.windChill ?? current.temperature} °F @@ -105,7 +105,12 @@ export default function CurrentWeather({ current }: any) { - + {current.highTemp}°F @@ -120,7 +125,12 @@ export default function CurrentWeather({ current }: any) { - + {current.lowTemp}°F @@ -137,7 +147,12 @@ export default function CurrentWeather({ current }: any) { - + {sunStates[0]?.sunrise} @@ -150,7 +165,12 @@ export default function CurrentWeather({ current }: any) { - + {sunStates[0]?.sunset} @@ -165,10 +185,20 @@ export default function CurrentWeather({ current }: any) { - + Humidity - + {current.humidity}% @@ -183,10 +213,20 @@ export default function CurrentWeather({ current }: any) { - + Wind - + {current.windSpeed}mph @@ -201,10 +241,20 @@ export default function CurrentWeather({ current }: any) { - + Pressure - + {current.pressure} in diff --git a/src/components/WeatherModal/ExtendedForecast.tsx b/src/components/WeatherModal/ExtendedForecast.tsx index 30bd8b1..2cc48bb 100644 --- a/src/components/WeatherModal/ExtendedForecast.tsx +++ b/src/components/WeatherModal/ExtendedForecast.tsx @@ -1,9 +1,12 @@ import { Group, Stack, Text } from '@mantine/core'; +import { useCommonHooks } from 'hooks'; +import { textClasses } from 'styles'; import WeatherIcon from './WeatherIcon'; export default function ExtendedForecast({ forecast }: any) { const day = forecast.slice(2, 14).filter((item: any) => item.isDaytime); const night = forecast.slice(2, 14).filter((item: any) => !item.isDaytime); + const { isMobile } = useCommonHooks(); return ( - + + {item.name} - {short} + 15 ? 'flex-start' : 'center'} + style={{ + width: '100%', + whiteSpace: 'nowrap', + overflow: 'hidden', + boxSizing: 'border-box', + position: 'relative', + }} + > + 15 ? textClasses.autoScrollText : undefined} + classNames={textClasses} + > + {short} + + {item.temperature}°{item.temperatureUnit}/{night[index].temperature}° {item.temperatureUnit} diff --git a/src/components/WeatherModal/WeatherGraphs.tsx b/src/components/WeatherModal/WeatherGraphs.tsx index 8628d9c..775a560 100644 --- a/src/components/WeatherModal/WeatherGraphs.tsx +++ b/src/components/WeatherModal/WeatherGraphs.tsx @@ -58,7 +58,11 @@ export default function WeatherGraphs({ hourlyForecast }: any) { }); }} /> - + } /> { - closeWeatherModal(); - setProviderLabel('Google Search'); setSearchValue(''); + setProviderLabel('Google Search'); setProviderURL('https://www.google.com/search?q='); + closeWeatherModal(); }} style={{ '--color-text-pri': theme.primaryColor, diff --git a/src/pages/homepage/components/Header/Header.tsx b/src/pages/homepage/components/Header/Header.tsx index 97aad7b..3f7b236 100644 --- a/src/pages/homepage/components/Header/Header.tsx +++ b/src/pages/homepage/components/Header/Header.tsx @@ -1,5 +1,4 @@ import { Group, Stack, Text } from '@mantine/core'; -import { WeatherModal } from 'components'; import { useCommonHooks } from 'hooks'; import { useEffect, useState } from 'react'; import { textClasses } from 'styles'; @@ -9,12 +8,8 @@ function Header({ date, current, setCurrent, - outlook, - extendedForecast, weather, basicWeather, - weatherModalOpened, - closeWeatherModal, openWeatherModal, }: any) { const [time, setTime] = useState(new Date()); @@ -127,6 +122,7 @@ function Header({ position: 'absolute', bottom: isMobile ? -32 : 0, right: 16, + cursor: 'pointer', }} onClick={openWeatherModal} > @@ -158,13 +154,6 @@ function Header({ - ); } diff --git a/src/pages/homepage/components/Search/Search.tsx b/src/pages/homepage/components/Search/Search.tsx index f36c6a1..51aafc0 100644 --- a/src/pages/homepage/components/Search/Search.tsx +++ b/src/pages/homepage/components/Search/Search.tsx @@ -43,6 +43,7 @@ export default function Search({ const [listIndex, setListIndex] = useState(0); const { theme, + isMobile, urlPattern, providerLabel, setProviderLabel, @@ -263,7 +264,13 @@ export default function Search({ const [showFillButton, setShowFillButton] = useState(false); if (item.option.searchTerm !== undefined) { const m = new Date(item.option.dateTimeStamp); - const dateString = `${m.getUTCFullYear()}/${`0${m.getUTCMonth() + 1}`.slice(-2)}/${`0${m.getUTCDate()}`.slice(-2)} ${`0${m.getUTCHours()}`.slice(-2)}:${`0${m.getUTCMinutes()}`.slice(-2)}:${`0${m.getUTCSeconds()}`.slice(-2)}`; + const year = m.getUTCFullYear(); + const month = `0${m.getUTCMonth() + 1}`.slice(-2); + const day = `0${m.getUTCDate()}`.slice(-2); + const hours = `0${m.getUTCHours()}`.slice(-2); + const minutes = `0${m.getUTCMinutes()}`.slice(-2); + const seconds = `0${m.getUTCSeconds()}`.slice(-2); + const dateString = `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`; return ( } renderOption={RenderOption} @@ -478,6 +485,9 @@ export default function Search({ closeProviderModal={closeProviderModal} /> : 'Bookmarks'} - {isMobile ? : 'Themes'} + {isMobile ? : 'Themes'} - {isMobile ? : 'Theme Playlists'} + {isMobile ? : 'Theme Playlists'} {isMobile ? : 'Search Providers'} diff --git a/src/pages/settings/components/Applications/Applications.tsx b/src/pages/settings/components/Applications/Applications.tsx index fd71143..b05a724 100644 --- a/src/pages/settings/components/Applications/Applications.tsx +++ b/src/pages/settings/components/Applications/Applications.tsx @@ -2,6 +2,7 @@ import { ActionIcon, Box, Button, + Card, Divider, Grid, GridCol, @@ -20,6 +21,7 @@ import { FiHelpCircle, FiPlus } from 'react-icons/fi'; import { actionIconClasses, buttonClasses, + cardClasses, modalClasses, textClasses, textInputClasses, @@ -81,108 +83,111 @@ const ApplicationSettings = () => { - - - { - setNewApplication({ - ...newApplication, - name: event.target.value, - }); - }} - /> - { - setNewApplication({ - ...newApplication, - baseUrl: event.target.value, - }); - }} - /> - - - { - setNewApplication({ - ...newApplication, - url: event.target.value, - }); - }} - /> - - - { - setNewApplication({ - ...newApplication, - icon: event.target.value, - }); - }} - /> - { - setNewApplication({ - ...newApplication, - filterName: event.target.value, - }); - }} - /> - - - - - + - - - + }} + > + Cancel + + + + @@ -252,7 +257,7 @@ const ApplicationSettings = () => { pos={isMobile ? undefined : 'absolute'} className={textInputClasses.settingsItem} classNames={textInputClasses} - autoFocus + autoFocus={!isMobile} placeholder='Search...' value={searchValue} onInput={(event: any) => { diff --git a/src/pages/settings/components/Applications/DebouncedApplication.tsx b/src/pages/settings/components/Applications/DebouncedApplication.tsx index e7baa3b..76a5872 100644 --- a/src/pages/settings/components/Applications/DebouncedApplication.tsx +++ b/src/pages/settings/components/Applications/DebouncedApplication.tsx @@ -26,13 +26,13 @@ function DebouncedApplication({ application }: { application: Application }) { const [debounced] = useDebouncedValue(update, 1000); useEffect(() => { - if (Object.keys(debounced).length) { + if (debounced && Object.keys(debounced).length > 0) { mutateAsync({ method: 'PATCH', endpoint: 'api/apps', body: debounced }); } }, [debounced]); useEffect(() => { - if (update !== app && Object.keys(update).length) { + if (update && update !== app && Object.keys(update).length) { setApp(update); } }, [update]); diff --git a/src/pages/settings/components/Bookmarks/Bookmarks.tsx b/src/pages/settings/components/Bookmarks/Bookmarks.tsx index e7661a1..0eb4e71 100644 --- a/src/pages/settings/components/Bookmarks/Bookmarks.tsx +++ b/src/pages/settings/components/Bookmarks/Bookmarks.tsx @@ -21,6 +21,7 @@ import { FiHelpCircle, FiPlus } from 'react-icons/fi'; import { actionIconClasses, buttonClasses, + cardClasses, modalClasses, textClasses, textInputClasses, @@ -125,65 +126,67 @@ const BookmarkSettings = () => { - - - { - setNewGroup({ - ...newGroup, - categoryName: event.target.value, - }); - }} - /> - { - setNewGroup({ - ...newGroup, - filterName: event.target.value, - }); - }} - /> - - - - - + - - - + }} + > + Cancel + + + + @@ -253,7 +256,7 @@ const BookmarkSettings = () => { pos={isMobile ? undefined : 'absolute'} className={textInputClasses.settingsItem} classNames={textInputClasses} - autoFocus + autoFocus={!isMobile} placeholder='Search...' value={searchValue} onInput={(event: any) => { @@ -261,16 +264,23 @@ const BookmarkSettings = () => { }} /> Reorder} labelPosition='left' pos={'absolute'} right={isMobile ? '2rem' : '1rem'} - top={isMobile ? '9.5rem' : undefined} + top={isMobile ? '10rem' : undefined} onChange={(e) => { setDragging(e.target.checked); }} color={theme.primaryColor} - styles={{ label: { color: theme.primaryColor } }} + styles={{ + label: { + color: theme.primaryColor, + top: isMobile ? -22 : 0, + left: isMobile ? -8 : 0, + position: isMobile ? 'absolute' : undefined, + }, + }} /> {dragging ? ( @@ -352,7 +362,7 @@ const BookmarkSettings = () => { ) : ( - + {groups?.map((group: BookmarkGroup) => ( - - - { - setNewBookmark({ - ...newBookmark, - name: event.target.value, - }); - }} - /> - { - setNewBookmark({ - ...newBookmark, - category: event.target.value, - }); - }} - /> - - - { - setNewBookmark({ - ...newBookmark, - url: event.target.value, - }); - }} - /> - - - + - - - + }} + > + Cancel + + + + diff --git a/src/pages/settings/components/Messages/Messages.tsx b/src/pages/settings/components/Messages/Messages.tsx index 2d09426..21d562f 100644 --- a/src/pages/settings/components/Messages/Messages.tsx +++ b/src/pages/settings/components/Messages/Messages.tsx @@ -1,6 +1,7 @@ import { ActionIcon, Button, + Card, Divider, Grid, GridCol, @@ -20,6 +21,7 @@ import { FiHelpCircle, FiPlus } from 'react-icons/fi'; import { actionIconClasses, buttonClasses, + cardClasses, modalClasses, textClasses, textInputClasses, @@ -79,48 +81,51 @@ const MessageSettings = () => { - - { - setNewMessage(event.target.value); - }} - error={newMessageError} - /> - - - + - - - + }} + > + Cancel + + + + @@ -183,7 +188,7 @@ const MessageSettings = () => { pos={isMobile ? undefined : 'absolute'} className={textInputClasses.settingsItem} classNames={textInputClasses} - autoFocus + autoFocus={!isMobile} placeholder='Search...' value={searchValue} onInput={(event: any) => { diff --git a/src/pages/settings/components/Search/SearchProviders.tsx b/src/pages/settings/components/Search/SearchProviders.tsx index 7baf004..ab57007 100644 --- a/src/pages/settings/components/Search/SearchProviders.tsx +++ b/src/pages/settings/components/Search/SearchProviders.tsx @@ -2,6 +2,7 @@ import { ActionIcon, Box, Button, + Card, Divider, Grid, GridCol, @@ -20,6 +21,7 @@ import { FiHelpCircle, FiPlus } from 'react-icons/fi'; import { actionIconClasses, buttonClasses, + cardClasses, modalClasses, textClasses, textInputClasses, @@ -78,79 +80,81 @@ const SearchProviderSettings = () => { - - - + + + + + { + setNewProvider({ + ...newProvider, + name: event.target.value, + }); + }} + /> + { + setNewProvider({ + ...newProvider, + prefix: event.target.value, + }); + }} + /> + { setNewProvider({ ...newProvider, - name: event.target.value, + url: event.target.value, }); }} /> - { - setNewProvider({ - ...newProvider, - prefix: event.target.value, - }); + + + + + - - - + }} + > + Cancel + + + + @@ -211,7 +215,7 @@ const SearchProviderSettings = () => { pos={isMobile ? undefined : 'absolute'} className={textInputClasses.settingsItem} classNames={textInputClasses} - autoFocus + autoFocus={!isMobile} placeholder='Search...' value={searchValue} onInput={(event: any) => { diff --git a/src/pages/settings/components/Theming/ThemeModal.tsx b/src/pages/settings/components/Theming/ThemeModal.tsx index 6c5cd87..401ca40 100644 --- a/src/pages/settings/components/Theming/ThemeModal.tsx +++ b/src/pages/settings/components/Theming/ThemeModal.tsx @@ -221,7 +221,7 @@ function ThemeModal({ ) : ( - + Primary Color @@ -383,7 +383,7 @@ function ThemeModal({ - + + - - - + }} + > + Cancel + + + + @@ -193,7 +196,7 @@ const WolClientSettings = () => { pos={isMobile ? undefined : 'absolute'} className={textInputClasses.settingsItem} classNames={textInputClasses} - autoFocus + autoFocus={!isMobile} placeholder='Search...' value={searchValue} onInput={(event: any) => { @@ -204,16 +207,17 @@ const WolClientSettings = () => { {wolClients?.map((client: WolClient) => ( - + - { e.stopPropagation(); }} + justify='center' > - + diff --git a/src/styles/Text.module.css b/src/styles/Text.module.css index 4a65db9..2bb0cfb 100644 --- a/src/styles/Text.module.css +++ b/src/styles/Text.module.css @@ -113,6 +113,27 @@ } } +.autoScrollText { + &.root { + display: inline-block; + animation: carousel 8s ease-in-out infinite; + position: relative; + padding-inline: 1rem; + } +} + +@keyframes carousel { + 25% { + transform: translate(0, 0); + left: 0%; + } + 75%, + 100% { + transform: translate(-100%, 0); + left: 100%; + } +} + a { color: var(--color-text-pri); text-decoration: none; diff --git a/src/styles/TextInput.module.css b/src/styles/TextInput.module.css index 1d2f81e..f421b90 100644 --- a/src/styles/TextInput.module.css +++ b/src/styles/TextInput.module.css @@ -38,6 +38,9 @@ padding-left: .5rem; opacity: 1; } + ::placeholder { + color: var(--color-text-acc) !important; + } } } }