From 2c003f64dd5986271e7bb9b27f61c62deb4b242e Mon Sep 17 00:00:00 2001 From: Nicolas Meienberger Date: Mon, 18 Mar 2024 18:45:41 +0100 Subject: [PATCH] refactor(category-select): change from react-select to @radix for dark mode support --- package.json | 1 - pnpm-lock.yaml | 214 +----------------- public/mockServiceWorker.js | 19 +- .../CategorySelector/CategorySelector.tsx | 117 ++-------- src/client/components/ui/Select/Select.tsx | 80 ++++--- 5 files changed, 90 insertions(+), 341 deletions(-) diff --git a/package.json b/package.json index c1dbb52d..de37ea14 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,6 @@ "react-hot-toast": "^2.4.1", "react-markdown": "^9.0.1", "react-query": "^3.39.3", - "react-select": "^5.8.0", "react-tooltip": "^5.26.3", "redaxios": "^0.5.1", "redis": "^4.6.13", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 70dacd29..64ac8ab2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -128,9 +128,6 @@ importers: react-query: specifier: ^3.39.3 version: 3.39.3(react-dom@18.2.0)(react@18.2.0) - react-select: - specifier: ^5.8.0 - version: 5.8.0(@types/react@18.2.66)(react-dom@18.2.0)(react@18.2.0) react-tooltip: specifier: ^5.26.3 version: 5.26.3(react-dom@18.2.0)(react@18.2.0) @@ -936,95 +933,6 @@ packages: dev: false optional: true - /@emotion/babel-plugin@11.10.6: - resolution: {integrity: sha512-p2dAqtVrkhSa7xz1u/m9eHYdLi+en8NowrmXeF/dKtJpU8lCWli8RUAati7NcSl0afsBott48pdnANuD0wh9QQ==} - dependencies: - '@babel/helper-module-imports': 7.22.15 - '@babel/runtime': 7.23.2 - '@emotion/hash': 0.9.0 - '@emotion/memoize': 0.8.0 - '@emotion/serialize': 1.1.1 - babel-plugin-macros: 3.1.0 - convert-source-map: 1.9.0 - escape-string-regexp: 4.0.0 - find-root: 1.1.0 - source-map: 0.5.7 - stylis: 4.1.3 - dev: false - - /@emotion/cache@11.10.5: - resolution: {integrity: sha512-dGYHWyzTdmK+f2+EnIGBpkz1lKc4Zbj2KHd4cX3Wi8/OWr5pKslNjc3yABKH4adRGCvSX4VDC0i04mrrq0aiRA==} - dependencies: - '@emotion/memoize': 0.8.0 - '@emotion/sheet': 1.2.1 - '@emotion/utils': 1.2.0 - '@emotion/weak-memoize': 0.3.0 - stylis: 4.1.3 - dev: false - - /@emotion/hash@0.9.0: - resolution: {integrity: sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==} - dev: false - - /@emotion/memoize@0.8.0: - resolution: {integrity: sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA==} - dev: false - - /@emotion/react@11.10.6(@types/react@18.2.66)(react@18.2.0): - resolution: {integrity: sha512-6HT8jBmcSkfzO7mc+N1L9uwvOnlcGoix8Zn7srt+9ga0MjREo6lRpuVX0kzo6Jp6oTqDhREOFsygN6Ew4fEQbw==} - peerDependencies: - '@types/react': '*' - react: '>=16.8.0' - peerDependenciesMeta: - '@types/react': - optional: true - dependencies: - '@babel/runtime': 7.23.2 - '@emotion/babel-plugin': 11.10.6 - '@emotion/cache': 11.10.5 - '@emotion/serialize': 1.1.1 - '@emotion/use-insertion-effect-with-fallbacks': 1.0.0(react@18.2.0) - '@emotion/utils': 1.2.0 - '@emotion/weak-memoize': 0.3.0 - '@types/react': 18.2.66 - hoist-non-react-statics: 3.3.2 - react: 18.2.0 - dev: false - - /@emotion/serialize@1.1.1: - resolution: {integrity: sha512-Zl/0LFggN7+L1liljxXdsVSVlg6E/Z/olVWpfxUTxOAmi8NU7YoeWeLfi1RmnB2TATHoaWwIBRoL+FvAJiTUQA==} - dependencies: - '@emotion/hash': 0.9.0 - '@emotion/memoize': 0.8.0 - '@emotion/unitless': 0.8.0 - '@emotion/utils': 1.2.0 - csstype: 3.1.3 - dev: false - - /@emotion/sheet@1.2.1: - resolution: {integrity: sha512-zxRBwl93sHMsOj4zs+OslQKg/uhF38MB+OMKoCrVuS0nyTkqnau+BM3WGEoOptg9Oz45T/aIGs1qbVAsEFo3nA==} - dev: false - - /@emotion/unitless@0.8.0: - resolution: {integrity: sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==} - dev: false - - /@emotion/use-insertion-effect-with-fallbacks@1.0.0(react@18.2.0): - resolution: {integrity: sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A==} - peerDependencies: - react: '>=16.8.0' - dependencies: - react: 18.2.0 - dev: false - - /@emotion/utils@1.2.0: - resolution: {integrity: sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw==} - dev: false - - /@emotion/weak-memoize@0.3.0: - resolution: {integrity: sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg==} - dev: false - /@ericcornelissen/bash-parser@0.5.2: resolution: {integrity: sha512-4pIMTa1nEFfMXitv7oaNEWOdM+zpOZavesa5GaiWTgda6Zk32CFGxjUp/iIaN0PwgUW1yTq/fztSjbpE8SLGZQ==} engines: {node: '>=4'} @@ -4105,10 +4013,6 @@ packages: dependencies: undici-types: 5.26.5 - /@types/parse-json@4.0.0: - resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==} - dev: false - /@types/pg@8.11.2: resolution: {integrity: sha512-G2Mjygf2jFMU/9hCaTYxJrwdObdcnuQde1gndooZSOHsNSaCehAuwc7EIuSA34Do8Jx2yZ19KtvW8P0j4EuUXw==} dependencies: @@ -4128,12 +4032,6 @@ packages: dependencies: '@types/react': 18.2.66 - /@types/react-transition-group@4.4.5: - resolution: {integrity: sha512-juKD/eiSM3/xZYzjuzH6ZwpP+/lejltmiS3QEzV/vmb/Q8+HfDmxu+Baga8UEMGBqV88Nbg4l2hY/K2DkyaLLA==} - dependencies: - '@types/react': 18.2.66 - dev: false - /@types/react@18.2.66: resolution: {integrity: sha512-OYTmMI4UigXeFMF/j4uv0lBBEbongSgptPrHBxqME44h9+yNov+oL6Z3ocJKo0WyXR84sQUNeyIp9MRfckvZpg==} dependencies: @@ -4872,15 +4770,6 @@ packages: '@types/babel__traverse': 7.18.3 dev: true - /babel-plugin-macros@3.1.0: - resolution: {integrity: sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==} - engines: {node: '>=10', npm: '>=6'} - dependencies: - '@babel/runtime': 7.23.2 - cosmiconfig: 7.1.0 - resolve: 1.22.8 - dev: false - /babel-preset-current-node-syntax@1.0.1(@babel/core@7.24.0): resolution: {integrity: sha512-M7LQ0bxarkxQoN+vz5aJPsLBn77n8QgTFmo8WK0/44auK2xlCXrYcUxHFxgU7qW5Yzw/CjmLRK2uJzaCd7LvqQ==} peerDependencies: @@ -5081,6 +4970,7 @@ packages: /callsites@3.1.0: resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==} engines: {node: '>=6'} + dev: true /camelcase@5.3.1: resolution: {integrity: sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==} @@ -5333,10 +5223,6 @@ packages: express-session: 1.18.0 dev: false - /convert-source-map@1.9.0: - resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==} - dev: false - /convert-source-map@2.0.0: resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==} @@ -5367,17 +5253,6 @@ packages: vary: 1.1.2 dev: false - /cosmiconfig@7.1.0: - resolution: {integrity: sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==} - engines: {node: '>=10'} - dependencies: - '@types/parse-json': 4.0.0 - import-fresh: 3.3.0 - parse-json: 5.2.0 - path-type: 4.0.0 - yaml: 1.10.2 - dev: false - /cpu-features@0.0.9: resolution: {integrity: sha512-AKjgn2rP2yJyfbepsmLfiYcmtNn/2eUvocUyM/09yB0YDiz39HteK/5/T4Onf0pmdYDMgkBoGvRLvEguzyL7wQ==} engines: {node: '>=10.0.0'} @@ -5702,13 +5577,6 @@ packages: resolution: {integrity: sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==} dev: true - /dom-helpers@5.2.1: - resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==} - dependencies: - '@babel/runtime': 7.23.2 - csstype: 3.1.3 - dev: false - /domexception@4.0.0: resolution: {integrity: sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==} engines: {node: '>=12'} @@ -5919,6 +5787,7 @@ packages: resolution: {integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==} dependencies: is-arrayish: 0.2.1 + dev: true /es-abstract@1.22.5: resolution: {integrity: sha512-oW69R+4q2wG+Hc3KZePPZxOiisRIqfKBVo/HLx94QcJeWGU/8sZhCvc829rd1kS366vlJbzBfXf9yWwf0+Ko7w==} @@ -6191,6 +6060,7 @@ packages: /escape-string-regexp@4.0.0: resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==} engines: {node: '>=10'} + dev: true /escape-string-regexp@5.0.0: resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==} @@ -6819,10 +6689,6 @@ packages: engines: {node: '>=0.10.0'} dev: true - /find-root@1.1.0: - resolution: {integrity: sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==} - dev: false - /find-up@4.1.0: resolution: {integrity: sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==} engines: {node: '>=8'} @@ -7392,6 +7258,7 @@ packages: dependencies: parent-module: 1.0.1 resolve-from: 4.0.0 + dev: true /import-local@3.1.0: resolution: {integrity: sha512-ASB07uLtnDs1o6EHjKpX34BKYDSqnFerfTOJL2HvMqF70LnxpjkzDB8J44oT9pu4AMPkQwf8jl6szgvNd2tRIg==} @@ -7488,6 +7355,7 @@ packages: /is-arrayish@0.2.1: resolution: {integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==} + dev: true /is-arrayish@0.3.2: resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==} @@ -8331,6 +8199,7 @@ packages: /json-parse-even-better-errors@2.3.1: resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==} + dev: true /json-parse-even-better-errors@3.0.1: resolution: {integrity: sha512-aatBvbL26wVUCLmbWdCpeu9iF5wOyWpagiKkInA+kfws3sWdBrTnsvN2CKcyCYyUrc7rebNBlK6+kteg7ksecg==} @@ -8528,6 +8397,7 @@ packages: /lines-and-columns@1.2.4: resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==} + dev: true /load-json-file@6.2.0: resolution: {integrity: sha512-gUD/epcRms75Cw8RT1pUdHugZYM5ce64ucs2GEISABwkRsOQr0q2wm/MV2TKThycIe5e0ytRweW2RZxclogCdQ==} @@ -8909,10 +8779,6 @@ packages: tslib: 2.6.2 dev: true - /memoize-one@6.0.0: - resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==} - dev: false - /merge-stream@2.0.0: resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==} dev: true @@ -9856,6 +9722,7 @@ packages: engines: {node: '>=6'} dependencies: callsites: 3.1.0 + dev: true /parse-json@5.2.0: resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==} @@ -9865,6 +9732,7 @@ packages: error-ex: 1.3.2 json-parse-even-better-errors: 2.3.1 lines-and-columns: 1.2.4 + dev: true /parse-ms@4.0.0: resolution: {integrity: sha512-TXfryirbmq34y8QBwgqCVLi+8oA3oWx2eAnSn62ITyEhEYaWRlVZ2DvMM9eZbMs/RfxPu/PK/aBLyGj4IrqMHw==} @@ -9932,6 +9800,7 @@ packages: /path-type@4.0.0: resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==} engines: {node: '>=8'} + dev: true /pathe@1.1.2: resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==} @@ -10382,27 +10251,6 @@ packages: use-sidecar: 1.1.2(@types/react@18.2.66)(react@18.2.0) dev: false - /react-select@5.8.0(@types/react@18.2.66)(react-dom@18.2.0)(react@18.2.0): - resolution: {integrity: sha512-TfjLDo58XrhP6VG5M/Mi56Us0Yt8X7xD6cDybC7yoRMUNm7BGO7qk8J0TLQOua/prb8vUOtsfnXZwfm30HGsAA==} - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - dependencies: - '@babel/runtime': 7.23.2 - '@emotion/cache': 11.10.5 - '@emotion/react': 11.10.6(@types/react@18.2.66)(react@18.2.0) - '@floating-ui/dom': 1.2.9 - '@types/react-transition-group': 4.4.5 - memoize-one: 6.0.0 - prop-types: 15.8.1 - react: 18.2.0 - react-dom: 18.2.0(react@18.2.0) - react-transition-group: 4.4.5(react-dom@18.2.0)(react@18.2.0) - use-isomorphic-layout-effect: 1.1.2(@types/react@18.2.66)(react@18.2.0) - transitivePeerDependencies: - - '@types/react' - dev: false - /react-style-singleton@2.2.1(@types/react@18.2.66)(react@18.2.0): resolution: {integrity: sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g==} engines: {node: '>=10'} @@ -10432,20 +10280,6 @@ packages: react-dom: 18.2.0(react@18.2.0) dev: false - /react-transition-group@4.4.5(react-dom@18.2.0)(react@18.2.0): - resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==} - peerDependencies: - react: '>=16.6.0' - react-dom: '>=16.6.0' - dependencies: - '@babel/runtime': 7.23.2 - dom-helpers: 5.2.1 - loose-envify: 1.4.0 - prop-types: 15.8.1 - react: 18.2.0 - react-dom: 18.2.0(react@18.2.0) - dev: false - /react@18.2.0: resolution: {integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==} engines: {node: '>=0.10.0'} @@ -10635,6 +10469,7 @@ packages: /resolve-from@4.0.0: resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==} engines: {node: '>=4'} + dev: true /resolve-from@5.0.0: resolution: {integrity: sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==} @@ -10969,11 +10804,6 @@ packages: source-map: 0.6.1 dev: true - /source-map@0.5.7: - resolution: {integrity: sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==} - engines: {node: '>=0.10.0'} - dev: false - /source-map@0.6.1: resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==} engines: {node: '>=0.10.0'} @@ -11249,10 +11079,6 @@ packages: client-only: 0.0.1 react: 18.2.0 - /stylis@4.1.3: - resolution: {integrity: sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA==} - dev: false - /summary@2.1.0: resolution: {integrity: sha512-nMIjMrd5Z2nuB2RZCKJfFMjgS3fygbeyGk9PxPPaJR1RIcyN9yn4A63Isovzm3ZtQuEkLBVgMdPup8UeLH7aQw==} dev: true @@ -11800,19 +11626,6 @@ packages: react: 18.2.0 dev: false - /use-isomorphic-layout-effect@1.1.2(@types/react@18.2.66)(react@18.2.0): - resolution: {integrity: sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==} - peerDependencies: - '@types/react': '*' - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - '@types/react': - optional: true - dependencies: - '@types/react': 18.2.66 - react: 18.2.0 - dev: false - /use-sidecar@1.1.2(@types/react@18.2.66)(react@18.2.0): resolution: {integrity: sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw==} engines: {node: '>=10'} @@ -12334,11 +12147,6 @@ packages: /yallist@4.0.0: resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==} - /yaml@1.10.2: - resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} - engines: {node: '>= 6'} - dev: false - /yargs-parser@21.1.1: resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==} engines: {node: '>=12'} diff --git a/public/mockServiceWorker.js b/public/mockServiceWorker.js index 0acd8ff4..2c5bfc0e 100644 --- a/public/mockServiceWorker.js +++ b/public/mockServiceWorker.js @@ -2,13 +2,14 @@ /* tslint:disable */ /** - * Mock Service Worker (2.2.2). + * Mock Service Worker. * @see https://github.com/mswjs/msw * - Please do NOT modify this file. * - Please do NOT serve this file on production. */ -const INTEGRITY_CHECKSUM = '223d191a56023cd36aa88c802961b911' +const PACKAGE_VERSION = '2.2.6' +const INTEGRITY_CHECKSUM = '26357c79639bfa20d64c0efca2a87423' const IS_MOCKED_RESPONSE = Symbol('isMockedResponse') const activeClientIds = new Set() @@ -48,7 +49,10 @@ self.addEventListener('message', async function (event) { case 'INTEGRITY_CHECK_REQUEST': { sendToClient(client, { type: 'INTEGRITY_CHECK_RESPONSE', - payload: INTEGRITY_CHECKSUM, + payload: { + packageVersion: PACKAGE_VERSION, + checksum: INTEGRITY_CHECKSUM, + }, }) break } @@ -202,13 +206,6 @@ async function getResponse(event, client, requestId) { return passthrough() } - // Bypass requests with the explicit bypass header. - // Such requests can be issued by "ctx.fetch()". - const mswIntention = request.headers.get('x-msw-intention') - if (['bypass', 'passthrough'].includes(mswIntention)) { - return passthrough() - } - // Notify the client that a request has been intercepted. const requestBuffer = await request.arrayBuffer() const clientMessage = await sendToClient( @@ -240,7 +237,7 @@ async function getResponse(event, client, requestId) { return respondWithMock(clientMessage.data) } - case 'MOCK_NOT_FOUND': { + case 'PASSTHROUGH': { return passthrough() } } diff --git a/src/app/(dashboard)/app-store/components/CategorySelector/CategorySelector.tsx b/src/app/(dashboard)/app-store/components/CategorySelector/CategorySelector.tsx index 3687e3ed..03a1bcb1 100644 --- a/src/app/(dashboard)/app-store/components/CategorySelector/CategorySelector.tsx +++ b/src/app/(dashboard)/app-store/components/CategorySelector/CategorySelector.tsx @@ -1,114 +1,45 @@ -import { Icon } from '@tabler/icons-react'; -import React from 'react'; -import Select, { SingleValue, OptionProps, ControlProps, components } from 'react-select'; +import React, { useState } from 'react'; +import { Select, SelectItem, SelectValue, SelectContent, SelectTrigger } from '@/components/ui/Select'; import { useTranslations } from 'next-intl'; import { AppCategory } from '@runtipi/shared'; -import { useUIStore } from '@/client/state/uiStore'; import { iconForCategory } from '../../helpers/table.helpers'; -const { Option, Control } = components; - -interface IProps { +interface Props { onSelect: (value?: AppCategory) => void; className?: string; initialValue?: AppCategory; } -type OptionsType = { value: AppCategory; label: string; icon: Icon }; - -const IconOption = (props: OptionProps) => { - const { data } = props; - const { icon: CategoryIcon, label } = data; - return ( - - ); -}; - -const ControlComponent = (props: ControlProps) => { - const { children, ...rest } = props; - const { getValue } = props; - - const value = getValue()[0]; - - if (value?.icon) { - return ( - - - {children} - - ); - } - - return {children}; -}; - -export const CategorySelector: React.FC = ({ onSelect, className, initialValue }) => { +export const CategorySelector = ({ onSelect, className, initialValue }: Props) => { const t = useTranslations(); - const { darkMode } = useUIStore(); - const options: OptionsType[] = iconForCategory.map((category) => ({ + const options = iconForCategory.map((category) => ({ value: category.id, label: t(`APP_CATEGORY_${category.id.toUpperCase() as Uppercase}`), icon: category.icon, })); - const [value, setValue] = React.useState(options.find((o) => o.value === initialValue) || null); + const [value, setValue] = useState(initialValue); - const handleChange = (option: SingleValue) => { - setValue(option as OptionsType); - onSelect(option?.value); + const handleChange = (option: AppCategory) => { + setValue(option); + onSelect(option); }; - const color = darkMode ? '#fff' : '#1a2234'; - const bgColor = darkMode ? '#1a2234' : '#fff'; - const borderColor = darkMode ? '#243049' : '#e5e5e5'; - return ( - - isClearable - className={className} - value={value} - styles={{ - menu: (provided: object) => ({ - ...provided, - backgroundColor: bgColor, - color, - }), - control: (provided: object) => ({ - ...provided, - backgroundColor: bgColor, - color, - borderColor, - }), - option: (provided: object, state: { isFocused: boolean }) => ({ - ...provided, - backgroundColor: state.isFocused ? '#243049' : bgColor, - color: state.isFocused ? '#fff' : color, - }), - singleValue: (provided: object) => ({ - ...provided, - color, - fontSize: '0.8rem', - }), - placeholder: (provided: object) => ({ - ...provided, - color: '#a5a9b1', - fontSize: '0.8rem', - }), - }} - components={{ - Option: IconOption, - Control: ControlComponent, - }} - onChange={handleChange} - defaultValue={[]} - name="categories" - options={options} - placeholder={t('APP_STORE_CATEGORY_PLACEHOLDER')} - /> + ); }; diff --git a/src/client/components/ui/Select/Select.tsx b/src/client/components/ui/Select/Select.tsx index 2efa0daa..56a28f6a 100644 --- a/src/client/components/ui/Select/Select.tsx +++ b/src/client/components/ui/Select/Select.tsx @@ -10,37 +10,49 @@ type TriggerProps = { error?: string; }; -const Select: React.FC & { label?: string; error?: string; className?: string }> = ({ children, error, className, ...props }) => { +const Select: React.FC & { label?: string; error?: string; className?: string }> = ({ + children, + error, + className, + ...props +}) => { return {children}; }; const SelectValue = SelectPrimitive.Value; // Button -const SelectTrigger = React.forwardRef, React.ComponentPropsWithoutRef & TriggerProps>( - ({ className, error, label, children, ...props }, ref) => ( - - ), -); +const SelectTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & TriggerProps +>(({ className, error, label, children, value, ...props }, ref) => ( + +)); SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; -const SelectContent = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, children, ...props }, ref) => ( +const SelectContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( @@ -55,16 +67,18 @@ const SelectContent = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, children, ...props }, ref) => ( - - {children} - - - - - - -)); +const SelectItem = React.forwardRef, React.ComponentPropsWithoutRef>( + ({ className, children, ...props }, ref) => ( + + {children} + + + + + + + ), +); SelectItem.displayName = SelectPrimitive.Item.displayName; export { Select, SelectValue, SelectTrigger, SelectContent, SelectItem };