From 0d6909bd25cc268f95f658202a03c749a83f9cc3 Mon Sep 17 00:00:00 2001 From: Ulf Gebhardt Date: Sat, 2 Nov 2024 22:43:20 +0100 Subject: [PATCH 1/3] install prettier --- .eslintrc.js | 18 +++---- .prettierrc.json | 14 ++++++ package-lock.json | 122 ++++++++++++++++++++++++++++++++++++++++++++-- package.json | 3 ++ 4 files changed, 144 insertions(+), 13 deletions(-) create mode 100644 .prettierrc.json diff --git a/.eslintrc.js b/.eslintrc.js index 2295461..4a92ecd 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -158,15 +158,15 @@ module.exports = { // '@typescript-eslint/no-floating-promises': ['error', { ignoreVoid: true }], // 'no-void': ['error', { allowAsStatement: true }], // }, - // }, - // { - // files: ['!*.json'], - // plugins: ['prettier'], - // extends: ['plugin:prettier/recommended'], - // rules: { - // 'prettier/prettier': 'error', - // }, - }, + }, + { + files: ['!*.json'], + plugins: ['prettier'], + extends: ['plugin:prettier/recommended'], + rules: { + 'prettier/prettier': 'error', + } + }, { files: ['*.json'], plugins: ['json'], diff --git a/.prettierrc.json b/.prettierrc.json new file mode 100644 index 0000000..1db2a8c --- /dev/null +++ b/.prettierrc.json @@ -0,0 +1,14 @@ +{ + "printWidth": 100, + "tabWidth": 2, + "useTabs": false, + "semi": false, + "singleQuote": true, + "quoteProps": "as-needed", + "jsxSingleQuote": true, + "trailingComma": "all", + "bracketSpacing": true, + "bracketSameLine": false, + "arrowParens": "always", + "endOfLine": "auto" +} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index c0efde4..6b861ac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,12 +39,15 @@ "autoprefixer": "^10.4.14", "daisyui": "^4.6.1", "eslint": "^8.24.0", + "eslint-config-prettier": "^9.1.0", "eslint-config-standard": "^17.1.0", "eslint-plugin-json": "^3.1.0", + "eslint-plugin-prettier": "^5.2.1", "eslint-plugin-react": "^7.31.8", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-yml": "^1.14.0", "postcss": "^8.4.21", + "prettier": "^3.3.3", "react": "^18.2.0", "react-dom": "^18.2.0", "rollup": "^2.75.7", @@ -253,6 +256,19 @@ "node": ">= 8" } }, + "node_modules/@pkgr/core": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.1.1.tgz", + "integrity": "sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^12.20.0 || ^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/unts" + } + }, "node_modules/@popperjs/core": { "version": "2.11.8", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", @@ -2010,6 +2026,19 @@ "node": ">=10" } }, + "node_modules/eslint-config-prettier": { + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz", + "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==", + "dev": true, + "license": "MIT", + "bin": { + "eslint-config-prettier": "bin/cli.js" + }, + "peerDependencies": { + "eslint": ">=7.0.0" + } + }, "node_modules/eslint-config-standard": { "version": "17.1.0", "resolved": "https://registry.npmjs.org/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz", @@ -2235,6 +2264,37 @@ "node": ">=10" } }, + "node_modules/eslint-plugin-prettier": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.2.1.tgz", + "integrity": "sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==", + "dev": true, + "license": "MIT", + "dependencies": { + "prettier-linter-helpers": "^1.0.0", + "synckit": "^0.9.1" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint-plugin-prettier" + }, + "peerDependencies": { + "@types/eslint": ">=8.0.0", + "eslint": ">=8.0.0", + "eslint-config-prettier": "*", + "prettier": ">=3.0.0" + }, + "peerDependenciesMeta": { + "@types/eslint": { + "optional": true + }, + "eslint-config-prettier": { + "optional": true + } + } + }, "node_modules/eslint-plugin-promise": { "version": "6.6.0", "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.6.0.tgz", @@ -2638,6 +2698,13 @@ "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", "dev": true }, + "node_modules/fast-diff": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", + "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", + "dev": true, + "license": "Apache-2.0" + }, "node_modules/fast-glob": { "version": "3.2.12", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz", @@ -5613,6 +5680,35 @@ "node": ">= 0.8.0" } }, + "node_modules/prettier": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz", + "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==", + "dev": true, + "license": "MIT", + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, + "node_modules/prettier-linter-helpers": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz", + "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-diff": "^1.1.2" + }, + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/promise.series": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/promise.series/-/promise.series-0.2.0.tgz", @@ -6538,6 +6634,23 @@ "node": ">=10.13.0" } }, + "node_modules/synckit": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.9.2.tgz", + "integrity": "sha512-vrozgXDQwYO72vHjUb/HnFbQx1exDjoKzqx23aXEg2a9VIg2TSFZ8FmeZpTjUCFMYw7mpX4BE2SFu8wI7asYsw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@pkgr/core": "^0.1.0", + "tslib": "^2.6.2" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/unts" + } + }, "node_modules/tailwindcss": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.1.tgz", @@ -6671,10 +6784,11 @@ } }, "node_modules/tslib": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz", - "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==", - "dev": true + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", + "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, + "license": "0BSD" }, "node_modules/tsutils": { "version": "3.21.0", diff --git a/package.json b/package.json index 5b585e0..ecf7ffd 100644 --- a/package.json +++ b/package.json @@ -27,12 +27,15 @@ "autoprefixer": "^10.4.14", "daisyui": "^4.6.1", "eslint": "^8.24.0", + "eslint-config-prettier": "^9.1.0", "eslint-config-standard": "^17.1.0", "eslint-plugin-json": "^3.1.0", + "eslint-plugin-prettier": "^5.2.1", "eslint-plugin-react": "^7.31.8", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-yml": "^1.14.0", "postcss": "^8.4.21", + "prettier": "^3.3.3", "react": "^18.2.0", "react-dom": "^18.2.0", "rollup": "^2.75.7", From 6ae276bedfc50fe3f000a12d2b685683f26b312d Mon Sep 17 00:00:00 2001 From: Ulf Gebhardt Date: Sat, 2 Nov 2024 22:45:29 +0100 Subject: [PATCH 2/3] autofixes --- .eslintrc.js | 40 +- postcss.config.js | 4 +- rollup.config.js | 26 +- src/Components/AppShell/AppShell.tsx | 30 +- src/Components/AppShell/Content.tsx | 5 +- src/Components/AppShell/ContextWrapper.tsx | 16 +- src/Components/AppShell/NavBar.tsx | 237 +++++++---- src/Components/AppShell/SetAssetsApi.tsx | 6 +- src/Components/AppShell/SideBar.tsx | 194 +++++---- src/Components/AppShell/SidebarSubmenu.tsx | 94 +++-- src/Components/AppShell/Sitemap.tsx | 6 +- src/Components/AppShell/hooks/useAssets.tsx | 16 +- src/Components/Auth/LoginPage.tsx | 81 ++-- src/Components/Auth/RequestPasswordPage.tsx | 61 +-- src/Components/Auth/SetNewPasswordPage.tsx | 56 ++- src/Components/Auth/SignupPage.tsx | 80 ++-- src/Components/Auth/useAuth.tsx | 58 ++- src/Components/Gaming/Modal.tsx | 39 +- src/Components/Gaming/Quests.tsx | 104 +++-- src/Components/Gaming/hooks/useQuests.tsx | 17 +- src/Components/Input/Autocomplete.tsx | 46 ++- src/Components/Input/ComboBoxInput.tsx | 20 +- src/Components/Input/SelectBox.tsx | 82 ++-- src/Components/Input/TextAreaInput.tsx | 69 ++-- src/Components/Input/TextInput.tsx | 71 ++-- src/Components/Map/ItemForm.tsx | 34 +- src/Components/Map/ItemView.tsx | 12 +- src/Components/Map/Layer.tsx | 381 +++++++++++++----- src/Components/Map/Permissions.tsx | 14 +- .../Map/Subcomponents/AddButton.tsx | 96 +++-- .../Map/Subcomponents/Controls/Control.tsx | 21 +- .../Subcomponents/Controls/FilterControl.tsx | 111 +++-- .../Controls/GratitudeControl.tsx | 42 +- .../Subcomponents/Controls/LayerControl.tsx | 89 ++-- .../Subcomponents/Controls/LocateControl.tsx | 53 ++- .../Subcomponents/Controls/QuestControl.tsx | 34 +- .../Subcomponents/Controls/SearchControl.tsx | 363 +++++++++++------ .../Subcomponents/Controls/SidebarControl.tsx | 43 +- .../Subcomponents/Controls/TagsControl.tsx | 29 +- .../Map/Subcomponents/ItemFormPopup.tsx | 162 +++++--- .../ItemPopupComponents/HeaderView.tsx | 251 ++++++++---- .../ItemPopupComponents/PopupButton.tsx | 26 +- .../PopupCheckboxInput.tsx | 26 +- .../PopupStartEndInput.tsx | 39 +- .../PopupTextAreaInput.tsx | 25 +- .../ItemPopupComponents/PopupTextInput.tsx | 27 +- .../ItemPopupComponents/StartEndView.tsx | 66 ++- .../ItemPopupComponents/TextView.tsx | 174 ++++---- .../Map/Subcomponents/ItemViewPopup.tsx | 72 ++-- .../Map/Subcomponents/SelectPosition.tsx | 24 +- src/Components/Map/Tags.tsx | 20 +- src/Components/Map/UtopiaMap.tsx | 8 +- src/Components/Map/UtopiaMapInner.tsx | 139 ++++--- src/Components/Map/hooks/useClusterRef.tsx | 22 +- src/Components/Map/hooks/useFilter.tsx | 195 ++++----- src/Components/Map/hooks/useItems.tsx | 104 +++-- src/Components/Map/hooks/useLayers.tsx | 31 +- src/Components/Map/hooks/useLeafletRefs.tsx | 69 ++-- src/Components/Map/hooks/usePermissions.tsx | 77 ++-- .../Map/hooks/useSelectPosition.tsx | 69 ++-- src/Components/Map/hooks/useTags.tsx | 104 ++--- .../Map/hooks/useWindowDimension.tsx | 8 +- src/Components/Map/setItemLocation.tsx | 4 +- src/Components/Profile/ProfileForm.tsx | 116 ++++-- src/Components/Profile/ProfileView.tsx | 151 ++++--- .../Profile/Subcomponents/ActionsButton.tsx | 150 +++++-- .../Profile/Subcomponents/AvatarWidget.tsx | 170 +++++--- .../Profile/Subcomponents/ColorPicker.tsx | 14 +- .../Profile/Subcomponents/ContactInfo.tsx | 131 +++--- .../Profile/Subcomponents/FormHeader.tsx | 63 ++- .../Subcomponents/LinkedItemsHeaderView.tsx | 110 +++-- .../Profile/Subcomponents/PlusButton.tsx | 48 ++- .../Subcomponents/ProfileSubHeader.tsx | 34 +- .../Profile/Subcomponents/RelationCard.tsx | 20 +- .../Profile/Subcomponents/SocialShareBar.tsx | 21 +- .../Subcomponents/SocialShareButton.tsx | 68 ++-- .../Profile/Subcomponents/TagsWidget.tsx | 74 +++- .../Profile/Templates/OnepagerForm.tsx | 262 ++++++------ .../Profile/Templates/OnepagerView.tsx | 91 +++-- .../Profile/Templates/SimpleForm.tsx | 12 +- .../Profile/Templates/SimpleView.tsx | 6 +- src/Components/Profile/Templates/TabsForm.tsx | 274 ++++++++----- src/Components/Profile/Templates/TabsView.tsx | 262 ++++++++---- src/Components/Profile/UserSettings.tsx | 67 +-- src/Components/Profile/itemFunctions.ts | 191 +++++---- src/Components/Templates/AttestationForm.tsx | 146 ++++--- src/Components/Templates/CardPage.tsx | 31 +- src/Components/Templates/CircleLayout.tsx | 21 +- src/Components/Templates/DateUserInfo.tsx | 28 +- src/Components/Templates/DialogModal.tsx | 66 +-- src/Components/Templates/EmojiPicker.tsx | 81 +++- src/Components/Templates/ItemCard.tsx | 47 ++- src/Components/Templates/MapOverlayPage.tsx | 37 +- src/Components/Templates/MarketView.tsx | 67 +-- src/Components/Templates/MoonCalendar.tsx | 48 +-- .../Templates/OverlayItemsIndexPage.tsx | 183 ++++++--- src/Components/Templates/SelectUser.tsx | 89 ++-- src/Components/Templates/TagView.tsx | 33 +- src/Components/Templates/TitleCard.tsx | 52 ++- src/Components/Typography/ErrorText.tsx | 6 +- src/Components/Typography/Subtitle.tsx | 6 +- src/Utils/FormatTags.ts | 4 +- src/Utils/GetValue.ts | 2 +- src/Utils/MarkerIconFactory.ts | 26 +- src/Utils/Moon.ts | 4 +- src/Utils/RandomColor.ts | 52 ++- src/Utils/ReplaceURLs.ts | 7 +- src/Utils/ReverseGeocoder.ts | 34 +- src/Utils/TimeAgo.ts | 10 +- src/index.tsx | 44 +- src/types.ts | 196 ++++----- tailwind.config.js | 55 ++- 112 files changed, 5199 insertions(+), 3033 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 4a92ecd..9ba7d4c 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,7 +2,7 @@ module.exports = { env: { browser: true, - es2021: true + es2021: true, }, extends: [ 'standard', @@ -13,12 +13,12 @@ module.exports = { // 'plugin:import/typescript', // 'plugin:promise/recommended', // 'plugin:security/recommended-legacy', - 'plugin:react/recommended' + 'plugin:react/recommended', ], parserOptions: { ecmaVersion: 'latest', parser: '@typescript-eslint/parser', - sourceType: 'module' + sourceType: 'module', }, plugins: [ // '@typescript-eslint', @@ -27,7 +27,7 @@ module.exports = { // 'security', // 'no-catch-all', 'react', - 'react-hooks' + 'react-hooks', ], settings: { // 'import/resolver': { @@ -35,13 +35,13 @@ module.exports = { // node: true, // }, react: { - version: 'detect' - } + version: 'detect', + }, }, rules: { 'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks 'react-hooks/exhaustive-deps': 'warn', // Checks effect dependencies - 'react/react-in-jsx-scope': 'off' // Disable requirement for React import + 'react/react-in-jsx-scope': 'off', // Disable requirement for React import // 'no-catch-all/no-catch-all': 'error', // 'no-console': 'error', // 'no-debugger': 'error', @@ -139,7 +139,7 @@ module.exports = { overrides: [ { files: ['*.ts', '*.tsx'], - parser: '@typescript-eslint/parser' + parser: '@typescript-eslint/parser', // parserOptions: { // tsconfigRootDir: __dirname, // project: ['./tsconfig.json', '**/tsconfig.json'], @@ -158,19 +158,19 @@ module.exports = { // '@typescript-eslint/no-floating-promises': ['error', { ignoreVoid: true }], // 'no-void': ['error', { allowAsStatement: true }], // }, + }, + { + files: ['!*.json'], + plugins: ['prettier'], + extends: ['plugin:prettier/recommended'], + rules: { + 'prettier/prettier': 'error', }, - { - files: ['!*.json'], - plugins: ['prettier'], - extends: ['plugin:prettier/recommended'], - rules: { - 'prettier/prettier': 'error', - } - }, + }, { files: ['*.json'], plugins: ['json'], - extends: ['plugin:json/recommended-with-comments'] + extends: ['plugin:json/recommended-with-comments'], }, // { // files: ['*.{test,spec}.[tj]s'], @@ -206,7 +206,7 @@ module.exports = { files: ['*.yaml', '*.yml'], parser: 'yaml-eslint-parser', plugins: ['yml'], - extends: ['plugin:yml/prettier'] - } - ] + extends: ['plugin:yml/prettier'], + }, + ], } diff --git a/postcss.config.js b/postcss.config.js index a3f5603..3b33f36 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -2,6 +2,6 @@ module.exports = { plugins: { tailwindcss: {}, - autoprefixer: {} - } + autoprefixer: {}, + }, } diff --git a/rollup.config.js b/rollup.config.js index e868bf4..c3b8374 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -9,14 +9,30 @@ export default { format: 'esm', exports: 'named', sourcemap: true, - strict: false - } + strict: false, + }, ], plugins: [ postcss({ - plugins: [] + plugins: [], }), - typescript() + typescript(), + ], + external: [ + 'react', + 'react-dom', + 'leaflet', + 'react-leaflet', + 'react-toastify', + 'react-string-replace', + 'react-toastify/dist/ReactToastify.css', + 'tw-elements', + 'react-router-dom', + 'react-leaflet-cluster', + '@tanstack/react-query', + 'tributejs', + 'prop-types', + 'leaflet/dist/leaflet.css', + '@heroicons/react/20/solid', ], - external: ['react', 'react-dom', 'leaflet', 'react-leaflet', 'react-toastify', 'react-string-replace', 'react-toastify/dist/ReactToastify.css', 'tw-elements', 'react-router-dom', 'react-leaflet-cluster', '@tanstack/react-query', 'tributejs', 'prop-types', 'leaflet/dist/leaflet.css', '@heroicons/react/20/solid'] } diff --git a/src/Components/AppShell/AppShell.tsx b/src/Components/AppShell/AppShell.tsx index be31706..5827a2b 100644 --- a/src/Components/AppShell/AppShell.tsx +++ b/src/Components/AppShell/AppShell.tsx @@ -4,16 +4,26 @@ import { SetAssetsApi } from './SetAssetsApi' import { AssetsApi } from '../../types' import { ContextWrapper } from './ContextWrapper' -export function AppShell ({ appName, children, assetsApi, userType }: { appName: string, children: React.ReactNode, assetsApi: AssetsApi, userType: string }) { +export function AppShell({ + appName, + children, + assetsApi, + userType, +}: { + appName: string + children: React.ReactNode + assetsApi: AssetsApi + userType: string +}) { return ( - -
- - -
- {children} -
-
- + +
+ + +
+ {children} +
+
+ ) } diff --git a/src/Components/AppShell/Content.tsx b/src/Components/AppShell/Content.tsx index f462518..92fce76 100644 --- a/src/Components/AppShell/Content.tsx +++ b/src/Components/AppShell/Content.tsx @@ -1,14 +1,13 @@ import * as React from 'react' type ContentProps = { - children?: React.ReactNode; + children?: React.ReactNode } -export function Content ({ children } : ContentProps) { +export function Content({ children }: ContentProps) { return (
{children}
- ) } diff --git a/src/Components/AppShell/ContextWrapper.tsx b/src/Components/AppShell/ContextWrapper.tsx index ddb5469..9cae273 100644 --- a/src/Components/AppShell/ContextWrapper.tsx +++ b/src/Components/AppShell/ContextWrapper.tsx @@ -31,11 +31,7 @@ export const ContextWrapper = ({ children }) => { // Case 1: Only the Router is missing, but ContextWrapper is already provided if (!location && isWrapped) { - return ( - - {children} - - ) + return {children} } // Case 2: Neither Router nor ContextWrapper is present @@ -43,9 +39,7 @@ export const ContextWrapper = ({ children }) => { return ( - - {children} - + {children} ) @@ -80,7 +74,8 @@ export const Wrappers = ({ children }) => { - { pauseOnFocusLoss draggable pauseOnHover - theme="light" /> + theme='light' + /> {children} diff --git a/src/Components/AppShell/NavBar.tsx b/src/Components/AppShell/NavBar.tsx index d276e3f..7524939 100644 --- a/src/Components/AppShell/NavBar.tsx +++ b/src/Components/AppShell/NavBar.tsx @@ -6,21 +6,23 @@ import { useEffect, useRef, useState } from 'react' import { useItems } from '../Map/hooks/useItems' import { Item } from '../../types' -export default function NavBar ({ appName, userType }: { appName: string, userType: string }) { +export default function NavBar({ appName, userType }: { appName: string; userType: string }) { const { isAuthenticated, user, logout } = useAuth() - const [userProfile, setUserProfile] = useState({}as Item) + const [userProfile, setUserProfile] = useState({} as Item) const items = useItems() useEffect(() => { - const profile = user && items.find(i => (i.user_created?.id === user.id) && i.layer?.itemType.name === userType) - profile ? setUserProfile(profile) : setUserProfile({ id: crypto.randomUUID(), name: user?.first_name, text: '' }) - // eslint-disable-next-line react-hooks/exhaustive-deps + const profile = + user && + items.find((i) => i.user_created?.id === user.id && i.layer?.itemType.name === userType) + profile + ? setUserProfile(profile) + : setUserProfile({ id: crypto.randomUUID(), name: user?.first_name, text: '' }) + // eslint-disable-next-line react-hooks/exhaustive-deps }, [user, items]) - useEffect(() => { - - }, [userProfile]) + useEffect(() => {}, [userProfile]) const nameRef = useRef(null) const [nameWidth, setNameWidth] = useState(0) @@ -38,95 +40,156 @@ export default function NavBar ({ appName, userType }: { appName: string, userTy }, [location]) const onLogout = () => { - toast.promise( - logout(), - { - success: { - render () { - return 'Bye bye' - }, - // other options - icon: 'πŸ‘‹' + toast.promise(logout(), { + success: { + render() { + return 'Bye bye' }, - error: { - render ({ data }) { - return `${data}` - } + // other options + icon: 'πŸ‘‹', + }, + error: { + render({ data }) { + return `${data}` }, - pending: 'logging out ..' - }) + }, + pending: 'logging out ..', + }) } if (showNav) { return ( - <> -
- -
-
-

{appName}

- -
-
- - {isAuthenticated - ?
- - { userProfile?.image &&
-
- -
-
} -
{userProfile.name || user?.first_name}
- -
- - + <> +
+ +
+
+ +

+ {appName} +

+ +
- :
-
-
- Login -
- -
- Sign Up -
+ {isAuthenticated ? ( +
+ + {userProfile?.image && ( +
+
+ +
+
+ )} +
{userProfile.name || user?.first_name}
+ +
+ + +
-
- -
    -
  • Login
    • -
  • Sign Up
    • -
+ ) : ( +
+
+ +
Login
+ + + +
Sign Up
+ +
+
+ +
    +
  • + Login +
    • +
  • + Sign Up +
    • +
+
- -
- } -
- - + )} +
+ ) - } else return (<>) + } else return <> } diff --git a/src/Components/AppShell/SetAssetsApi.tsx b/src/Components/AppShell/SetAssetsApi.tsx index e4874d4..d1a69d3 100644 --- a/src/Components/AppShell/SetAssetsApi.tsx +++ b/src/Components/AppShell/SetAssetsApi.tsx @@ -2,7 +2,7 @@ import { useSetAssetApi } from './hooks/useAssets' import { AssetsApi } from '../../types' import { useEffect } from 'react' -export const SetAssetsApi = ({ assetsApi }:{assetsApi: AssetsApi}) => { +export const SetAssetsApi = ({ assetsApi }: { assetsApi: AssetsApi }) => { const setAssetsApi = useSetAssetApi() useEffect(() => { @@ -10,7 +10,5 @@ export const SetAssetsApi = ({ assetsApi }:{assetsApi: AssetsApi}) => { // eslint-disable-next-line react-hooks/exhaustive-deps }, [assetsApi]) - return ( - <> - ) + return <> } diff --git a/src/Components/AppShell/SideBar.tsx b/src/Components/AppShell/SideBar.tsx index d4509e0..d2f475f 100644 --- a/src/Components/AppShell/SideBar.tsx +++ b/src/Components/AppShell/SideBar.tsx @@ -1,23 +1,20 @@ import { useRef, useState, useEffect } from 'react' import { NavLink, useLocation } from 'react-router-dom' -import { - Sidenav, - initTE -} from 'tw-elements' +import { Sidenav, initTE } from 'tw-elements' import SidebarSubmenu from './SidebarSubmenu' import ChevronRightIcon from '@heroicons/react/24/outline/ChevronRightIcon' import * as React from 'react' type route = { - path: string; + path: string // eslint-disable-next-line no-undef - icon: JSX.Element; - name: string; - submenu?: route; + icon: JSX.Element + name: string + submenu?: route blank?: boolean } -export function SideBar ({ routes, bottomRoutes }: { routes: route[], bottomRoutes?: route[] }) { +export function SideBar({ routes, bottomRoutes }: { routes: route[]; bottomRoutes?: route[] }) { // prevent react18 from calling useEffect twice const init = useRef(false) @@ -34,9 +31,7 @@ export function SideBar ({ routes, bottomRoutes }: { routes: route[], bottomRout useEffect(() => { if (!init.current) { initTE({ Sidenav }) - const instance = Sidenav.getInstance( - document.getElementById('sidenav') - ) + const instance = Sidenav.getInstance(document.getElementById('sidenav')) setInstance(instance) instance.toggleSlim() init.current = true @@ -55,84 +50,117 @@ export function SideBar ({ routes, bottomRoutes }: { routes: route[], bottomRout return (