From 35ef3b25eb8cb2bdbc2bf5b97298ca66ba76ba51 Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Tue, 13 Dec 2022 14:38:09 +0100 Subject: [PATCH 01/11] chore: add eslint plugins --- package.json | 6 ++ yarn.lock | 162 ++++++++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 166 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 66a213d6..6d16ba3a 100644 --- a/package.json +++ b/package.json @@ -46,9 +46,15 @@ "@typescript-eslint/eslint-plugin": "5.46.0", "@typescript-eslint/parser": "5.46.0", "eslint": "^8.26.0", + "eslint-config-airbnb": "^19.0.4", + "eslint-config-airbnb-typescript": "^17.0.0", "eslint-config-mantine": "^2.0.0", "eslint-config-next": "12.3.4", "eslint-config-sznm": "^1.0.0", + "eslint-plugin-import": "^2.26.0", + "eslint-plugin-jsx-a11y": "^6.6.1", + "eslint-plugin-react": "^7.31.11", + "eslint-plugin-react-hooks": "^4.6.0", "husky": "^8.0.0", "prisma": "^4.5.0", "semantic-release": "^19.0.5", diff --git a/yarn.lock b/yarn.lock index 14200977..4fb2dee9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1618,6 +1618,17 @@ array-includes@^3.1.4, array-includes@^3.1.5: get-intrinsic "^1.1.1" is-string "^1.0.7" +array-includes@^3.1.6: + version "3.1.6" + resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.6.tgz#9e9e720e194f198266ba9e18c29e6a9b0e4b225f" + integrity sha512-sgTbLvL6cNnw24FnbaDyjmvddQ2ML8arZsgaJhoABMoplz/4QRhtrYS+alr1BUM1Bwp6dhx8vVCBSLG+StwOFw== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + get-intrinsic "^1.1.3" + is-string "^1.0.7" + array-union@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d" @@ -1643,6 +1654,27 @@ array.prototype.flatmap@^1.3.0: es-abstract "^1.19.2" es-shim-unscopables "^1.0.0" +array.prototype.flatmap@^1.3.1: + version "1.3.1" + resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.1.tgz#1aae7903c2100433cb8261cd4ed310aab5c4a183" + integrity sha512-8UGn9O1FDVvMNB0UlLv4voxRMze7+FpHyF5mSMRjWHUMlpoDViniy05870VlxhfgTnLbpuwTzvD76MTtWxB/mQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + es-shim-unscopables "^1.0.0" + +array.prototype.tosorted@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/array.prototype.tosorted/-/array.prototype.tosorted-1.1.1.tgz#ccf44738aa2b5ac56578ffda97c03fd3e23dd532" + integrity sha512-pZYPXPRl2PqWcsUs6LOMn+1f1532nEoPTYowBtqLwAW+W8vSVhkIGnmOX1t/UQjD6YGI0vcD2B1U7ZFGQH9jnQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + es-shim-unscopables "^1.0.0" + get-intrinsic "^1.1.3" + arrify@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" @@ -2387,6 +2419,37 @@ es-abstract@^1.19.0, es-abstract@^1.19.1, es-abstract@^1.19.2, es-abstract@^1.19 string.prototype.trimstart "^1.0.5" unbox-primitive "^1.0.2" +es-abstract@^1.20.4: + version "1.20.5" + resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.20.5.tgz#e6dc99177be37cacda5988e692c3fa8b218e95d2" + integrity sha512-7h8MM2EQhsCA7pU/Nv78qOXFpD8Rhqd12gYiSJVkrH9+e8VuA8JlPJK/hQjjlLv6pJvx/z1iRFKzYb0XT/RuAQ== + dependencies: + call-bind "^1.0.2" + es-to-primitive "^1.2.1" + function-bind "^1.1.1" + function.prototype.name "^1.1.5" + get-intrinsic "^1.1.3" + get-symbol-description "^1.0.0" + gopd "^1.0.1" + has "^1.0.3" + has-property-descriptors "^1.0.0" + has-symbols "^1.0.3" + internal-slot "^1.0.3" + is-callable "^1.2.7" + is-negative-zero "^2.0.2" + is-regex "^1.1.4" + is-shared-array-buffer "^1.0.2" + is-string "^1.0.7" + is-weakref "^1.0.2" + object-inspect "^1.12.2" + object-keys "^1.1.1" + object.assign "^4.1.4" + regexp.prototype.flags "^1.4.3" + safe-regex-test "^1.0.0" + string.prototype.trimend "^1.0.6" + string.prototype.trimstart "^1.0.6" + unbox-primitive "^1.0.2" + es-shim-unscopables@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.0.0.tgz#702e632193201e3edf8713635d083d378e510241" @@ -2532,7 +2595,7 @@ eslint-plugin-import@^2.26.0: resolve "^1.22.0" tsconfig-paths "^3.14.1" -eslint-plugin-jsx-a11y@^6.5.1: +eslint-plugin-jsx-a11y@^6.5.1, eslint-plugin-jsx-a11y@^6.6.1: version "6.6.1" resolved "https://registry.yarnpkg.com/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.6.1.tgz#93736fc91b83fdc38cc8d115deedfc3091aef1ff" integrity sha512-sXgFVNHiWffBq23uiS/JaP6eVR622DqwB4yTzKvGZGcPq6/yZ3WmOZfuBks/vHWo9GaFOqC2ZK4i6+C35knx7Q== @@ -2558,7 +2621,7 @@ eslint-plugin-prettier@^4.0.0: dependencies: prettier-linter-helpers "^1.0.0" -eslint-plugin-react-hooks@^4.5.0: +eslint-plugin-react-hooks@^4.5.0, eslint-plugin-react-hooks@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz#4c3e697ad95b77e93f8646aaa1630c1ba607edd3" integrity sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g== @@ -2583,6 +2646,27 @@ eslint-plugin-react@^7.29.4, eslint-plugin-react@^7.31.7: semver "^6.3.0" string.prototype.matchall "^4.0.7" +eslint-plugin-react@^7.31.11: + version "7.31.11" + resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.31.11.tgz#011521d2b16dcf95795df688a4770b4eaab364c8" + integrity sha512-TTvq5JsT5v56wPa9OYHzsrOlHzKZKjV+aLgS+55NJP/cuzdiQPC7PfYoUjMoxlffKtvijpk7vA/jmuqRb9nohw== + dependencies: + array-includes "^3.1.6" + array.prototype.flatmap "^1.3.1" + array.prototype.tosorted "^1.1.1" + doctrine "^2.1.0" + estraverse "^5.3.0" + jsx-ast-utils "^2.4.1 || ^3.0.0" + minimatch "^3.1.2" + object.entries "^1.1.6" + object.fromentries "^2.0.6" + object.hasown "^1.1.2" + object.values "^1.1.6" + prop-types "^15.8.1" + resolve "^2.0.0-next.3" + semver "^6.3.0" + string.prototype.matchall "^4.0.8" + eslint-plugin-sonarjs@^0.13.0: version "0.13.0" resolved "https://registry.yarnpkg.com/eslint-plugin-sonarjs/-/eslint-plugin-sonarjs-0.13.0.tgz#c34d140cc90abaaed38f5a5201a2ccdebe398862" @@ -3073,6 +3157,13 @@ globby@^11.0.0, globby@^11.0.1, globby@^11.1.0: merge2 "^1.4.1" slash "^3.0.0" +gopd@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c" + integrity sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA== + dependencies: + get-intrinsic "^1.1.3" + graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.10, graceful-fs@^4.2.4, graceful-fs@^4.2.6: version "4.2.10" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c" @@ -4522,6 +4613,15 @@ object.entries@^1.1.5: define-properties "^1.1.3" es-abstract "^1.19.1" +object.entries@^1.1.6: + version "1.1.6" + resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.6.tgz#9737d0e5b8291edd340a3e3264bb8a3b00d5fa23" + integrity sha512-leTPzo4Zvg3pmbQ3rDK69Rl8GQvIqMWubrkxONG9/ojtFE2rD9fjMKfSI5BxW3osRH1m6VdzmqK8oAY9aT4x5w== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + object.fromentries@^2.0.5: version "2.0.5" resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.5.tgz#7b37b205109c21e741e605727fe8b0ad5fa08251" @@ -4531,6 +4631,15 @@ object.fromentries@^2.0.5: define-properties "^1.1.3" es-abstract "^1.19.1" +object.fromentries@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.6.tgz#cdb04da08c539cffa912dcd368b886e0904bfa73" + integrity sha512-VciD13dswC4j1Xt5394WR4MzmAQmlgN72phd/riNp9vtD7tp4QQWJ0R4wvclXcafgcYK8veHRed2W6XeGBvcfg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + object.hasown@^1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/object.hasown/-/object.hasown-1.1.1.tgz#ad1eecc60d03f49460600430d97f23882cf592a3" @@ -4539,6 +4648,14 @@ object.hasown@^1.1.1: define-properties "^1.1.4" es-abstract "^1.19.5" +object.hasown@^1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/object.hasown/-/object.hasown-1.1.2.tgz#f919e21fad4eb38a57bc6345b3afd496515c3f92" + integrity sha512-B5UIT3J1W+WuWIU55h0mjlwaqxiE5vYENJXIXZ4VFe05pNYrkKuK0U/6aFcb0pKywYJh7IhfoqUfKVmrJJHZHw== + dependencies: + define-properties "^1.1.4" + es-abstract "^1.20.4" + object.values@^1.1.5: version "1.1.5" resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.5.tgz#959f63e3ce9ef108720333082131e4a459b716ac" @@ -4548,6 +4665,15 @@ object.values@^1.1.5: define-properties "^1.1.3" es-abstract "^1.19.1" +object.values@^1.1.6: + version "1.1.6" + resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.6.tgz#4abbaa71eba47d63589d402856f908243eea9b1d" + integrity sha512-FVVTkD1vENCsAcwNs9k6jea2uHC/X0+JcjG8YA60FN5CMaJmG95wT9jek/xX9nornqGRrBkKtzuAu2wuHpKqvw== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + once@^1.3.0, once@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1" @@ -5444,6 +5570,20 @@ string.prototype.matchall@^4.0.7: regexp.prototype.flags "^1.4.1" side-channel "^1.0.4" +string.prototype.matchall@^4.0.8: + version "4.0.8" + resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-4.0.8.tgz#3bf85722021816dcd1bf38bb714915887ca79fd3" + integrity sha512-6zOCOcJ+RJAQshcTvXPHoxoQGONa3e/Lqx90wUA+wEzX78sg5Bo+1tQo4N0pohS0erG9qtCqJDjNCQBjeWVxyg== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + get-intrinsic "^1.1.3" + has-symbols "^1.0.3" + internal-slot "^1.0.3" + regexp.prototype.flags "^1.4.3" + side-channel "^1.0.4" + string.prototype.trimend@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.5.tgz#914a65baaab25fbdd4ee291ca7dde57e869cb8d0" @@ -5453,6 +5593,15 @@ string.prototype.trimend@^1.0.5: define-properties "^1.1.4" es-abstract "^1.19.5" +string.prototype.trimend@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.6.tgz#c4a27fa026d979d79c04f17397f250a462944533" + integrity sha512-JySq+4mrPf9EsDBEDYMOb/lM7XQLulwg5R/m1r0PXEFqrV0qHvl58sdTilSXtKOflCsK2E8jxf+GKC0T07RWwQ== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + string.prototype.trimstart@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.5.tgz#5466d93ba58cfa2134839f81d7f42437e8c01fef" @@ -5462,6 +5611,15 @@ string.prototype.trimstart@^1.0.5: define-properties "^1.1.4" es-abstract "^1.19.5" +string.prototype.trimstart@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.6.tgz#e90ab66aa8e4007d92ef591bbf3cd422c56bdcf4" + integrity sha512-omqjMDaY92pbn5HOX7f9IccLA+U1tA9GvtU4JrodiXFfYB7jPzzHpRzpglLAjtUV6bB557zwClJezTqnAiYnQA== + dependencies: + call-bind "^1.0.2" + define-properties "^1.1.4" + es-abstract "^1.20.4" + string_decoder@^1.1.1: version "1.3.0" resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.3.0.tgz#42f114594a46cf1a8e30b0a84f56c78c3edac21e" From 1f35d8b6998045a771ebf54e5c2eb36ef5513fd7 Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Sat, 22 Apr 2023 12:52:33 +0200 Subject: [PATCH 02/11] feat: add hubmenu and fetch hubs --- package.json | 6 ++-- pages/[[...hubPaths]].tsx | 5 +++ ui/components/AddLinkCard.tsx | 4 +-- ui/components/AddLinkGroupCard.tsx | 4 +-- ui/components/Header.tsx | 8 ++--- ui/components/HubModals/FooterLinkAddCard.tsx | 4 +-- ui/components/HubModals/FooterLinkCard.tsx | 4 +-- ui/components/LinkCard.tsx | 6 ++-- ui/components/LinkModals/EditLinkModal.tsx | 4 +-- ui/sections/HubMenu/HubMenu.tsx | 31 ++++++++++++++++ ui/sections/HubMenu/index.tsx | 3 ++ ui/sections/LinkSection/AccordionControl.tsx | 4 +-- yarn.lock | 36 +++++++------------ 13 files changed, 74 insertions(+), 45 deletions(-) create mode 100644 ui/sections/HubMenu/HubMenu.tsx create mode 100644 ui/sections/HubMenu/index.tsx diff --git a/package.json b/package.json index 0dc92b46..936e2eba 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "@mantine/next": "^6.0.0", "@mantine/notifications": "^6.0.0", "@prisma/client": "^4.5.0", + "@tabler/icons-react": "^2.17.0", "@tanstack/react-query": "^4.12.0", "@tanstack/react-query-devtools": "^4.12.0", "axios": "^1.1.3", @@ -32,8 +33,7 @@ "prettier": "^2.6.2", "react": "18.2.0", "react-dom": "18.2.0", - "react-scroll": "^1.8.8", - "tabler-icons-react": "^1.55.0" + "react-scroll": "^1.8.8" }, "devDependencies": { "@babel/core": "^7.19.6", @@ -89,4 +89,4 @@ } ] } -} \ No newline at end of file +} diff --git a/pages/[[...hubPaths]].tsx b/pages/[[...hubPaths]].tsx index f151e290..2157a6cb 100644 --- a/pages/[[...hubPaths]].tsx +++ b/pages/[[...hubPaths]].tsx @@ -5,10 +5,12 @@ import { useRouter } from "next/router"; import { useHubOneContext } from "../lib/context/HubOneContext"; import { getHubWithPath } from "../lib/requests/hub/getHub"; +import { getHubs } from "../lib/requests/hub/getHubs"; import { useFetchByHubId } from "../lib/useQueries"; import { Footer } from "../ui/components/Footer"; import { HeaderBar } from "../ui/components/Header"; import Hero from "../ui/sections/Hero"; +import HubMenu from "../ui/sections/HubMenu"; import LinkSection from "../ui/sections/LinkSection"; export default function Home() { @@ -34,6 +36,8 @@ export default function Home() { useFetchByHubId("linkgroups", hubId, config(setLinkGroups)); useFetchByHubId("footerlinks", hubId, config(setFooterLinks)); + const { data: hubs } = useQuery(["hubs"], () => getHubs()); + if (isLoading) { return (
+ {hubs && }
); diff --git a/ui/components/AddLinkCard.tsx b/ui/components/AddLinkCard.tsx index 4929e845..0f0ce29f 100644 --- a/ui/components/AddLinkCard.tsx +++ b/ui/components/AddLinkCard.tsx @@ -1,7 +1,7 @@ import { Card, createStyles, Stack, Text } from "@mantine/core"; +import { IconPlus } from "@tabler/icons-react"; import { motion } from "framer-motion"; import { useState } from "react"; -import { Plus } from "tabler-icons-react"; import AddLinkModal from "./LinkModals"; @@ -48,7 +48,7 @@ function AddLinkCard({ justify="center" sx={() => ({ height: "inherit" })} > - + Add Link diff --git a/ui/components/AddLinkGroupCard.tsx b/ui/components/AddLinkGroupCard.tsx index bd078bf8..08786739 100644 --- a/ui/components/AddLinkGroupCard.tsx +++ b/ui/components/AddLinkGroupCard.tsx @@ -1,7 +1,7 @@ import { Card, createStyles, Group, Text } from "@mantine/core"; +import { IconPlus } from "@tabler/icons-react"; import { motion } from "framer-motion"; import { useState } from "react"; -import { Plus } from "tabler-icons-react"; import AddLinkGroupModal from "./LinkGroupModals"; @@ -34,7 +34,7 @@ function AddLinkGroupCard({ hubId }: { hubId: number }) { height: "100%", })} > - + Add Link Group diff --git a/ui/components/Header.tsx b/ui/components/Header.tsx index 8be90706..7af6321c 100644 --- a/ui/components/Header.tsx +++ b/ui/components/Header.tsx @@ -13,9 +13,9 @@ import { useMantineTheme, } from "@mantine/core"; import { useToggle } from "@mantine/hooks"; +import { IconPlus, IconSettings, IconX } from "@tabler/icons-react"; import { useState } from "react"; import { Link as ScrollLink } from "react-scroll"; -import { X, Settings, Plus } from "tabler-icons-react"; import { useHubOneContext } from "../../lib/context/HubOneContext"; @@ -117,7 +117,7 @@ export function HeaderBar() { - + {hub.hubLogo ? ( ) : ( @@ -139,7 +139,7 @@ export function HeaderBar() { {editMode ? ( setEditModalOpened(true)} > - + ) : ( diff --git a/ui/sections/HubMenu/HubMenu.tsx b/ui/sections/HubMenu/HubMenu.tsx index ee13f993..3f01688a 100644 --- a/ui/sections/HubMenu/HubMenu.tsx +++ b/ui/sections/HubMenu/HubMenu.tsx @@ -9,51 +9,69 @@ import { rem, } from "@mantine/core"; import type { Hub } from "@prisma/client"; -import { - IconAppsFilled, - IconBoxMultiple, - IconPhoto, - IconPlus, -} from "@tabler/icons-react"; +import { IconAppsFilled, IconPlus } from "@tabler/icons-react"; +import { useRouter } from "next/router"; import { useState } from "react"; import HubLogo from "../../components/HubLogo"; +import AddHubModal from "../../components/HubModals/AddHubModal"; export default function HubMenu({ hubs }: { hubs: Hub[] }) { + const router = useRouter(); const [opened, setOpened] = useState(false); + const [addModalOpened, setAddModalOpened] = useState(false); + return ( - - - - - - - - - - - Hub Menu - - - {hubs.map((hub) => ( - - - - {hub.hubName} - - - ))} - - - }>Create New Hub - - + <> + + + + + + + + + + + Hub Menu + + + {hubs.map((hub) => ( + { + router.push(hub.hubPath); + }} + > + + + + {hub.hubName} + + + + ))} + + + setAddModalOpened(true)} + icon={} + > + Create New Hub + + + + + ); } From 49d410e7b73e076d2c710aff131b05f99cfb1a82 Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Mon, 24 Apr 2023 00:30:15 +0200 Subject: [PATCH 05/11] fix: fix logo size --- ui/components/Header.tsx | 6 +++++- ui/components/HubLogo/DefaultHubLogo.tsx | 1 + ui/components/HubLogo/HubLogo.tsx | 2 +- ui/sections/HubMenu/HubMenu.tsx | 7 +++++-- 4 files changed, 12 insertions(+), 4 deletions(-) diff --git a/ui/components/Header.tsx b/ui/components/Header.tsx index 6a481e3e..700fe4bc 100644 --- a/ui/components/Header.tsx +++ b/ui/components/Header.tsx @@ -2,6 +2,7 @@ import { ActionIcon, Burger, Button, + Center, Container, createStyles, Group, @@ -9,6 +10,7 @@ import { Image, MediaQuery, Paper, + rem, Transition, useMantineTheme, } from "@mantine/core"; @@ -118,7 +120,9 @@ export function HeaderBar() { - +
+ +
diff --git a/ui/components/HubLogo/DefaultHubLogo.tsx b/ui/components/HubLogo/DefaultHubLogo.tsx index 5d181124..cbf0480d 100644 --- a/ui/components/HubLogo/DefaultHubLogo.tsx +++ b/ui/components/HubLogo/DefaultHubLogo.tsx @@ -13,6 +13,7 @@ export default function DefaultHubLogo({ ({ minWidth: "32px", + width: "100%", padding: "6px", borderRadius: theme.radius.md, backgroundImage: theme.fn.gradient({ diff --git a/ui/components/HubLogo/HubLogo.tsx b/ui/components/HubLogo/HubLogo.tsx index e028e238..1ff7c90e 100644 --- a/ui/components/HubLogo/HubLogo.tsx +++ b/ui/components/HubLogo/HubLogo.tsx @@ -5,7 +5,7 @@ import DefaultHubLogo from "./DefaultHubLogo"; export default function HubLogo({ hub }: { hub: Hub }) { return hub.hubLogo ? ( - + ) : ( ); diff --git a/ui/sections/HubMenu/HubMenu.tsx b/ui/sections/HubMenu/HubMenu.tsx index 3f01688a..6cd4539a 100644 --- a/ui/sections/HubMenu/HubMenu.tsx +++ b/ui/sections/HubMenu/HubMenu.tsx @@ -1,5 +1,6 @@ import { Affix, + Center, Menu, SimpleGrid, Stack, @@ -18,7 +19,7 @@ import AddHubModal from "../../components/HubModals/AddHubModal"; export default function HubMenu({ hubs }: { hubs: Hub[] }) { const router = useRouter(); - const [opened, setOpened] = useState(false); + const [opened, setOpened] = useState(true); const [addModalOpened, setAddModalOpened] = useState(false); return ( @@ -50,7 +51,9 @@ export default function HubMenu({ hubs }: { hubs: Hub[] }) { }} > - +
+ +
Date: Mon, 24 Apr 2023 00:47:39 +0200 Subject: [PATCH 06/11] fix: use the same create modal across the app --- lib/context/HubOneContext.tsx | 10 +++ pages/[[...hubPaths]].tsx | 17 ++++- ui/components/Header.tsx | 7 +- ui/sections/HubMenu/HubMenu.tsx | 109 ++++++++++++++++---------------- 4 files changed, 80 insertions(+), 63 deletions(-) diff --git a/lib/context/HubOneContext.tsx b/lib/context/HubOneContext.tsx index dc2abbd4..e2b45b03 100644 --- a/lib/context/HubOneContext.tsx +++ b/lib/context/HubOneContext.tsx @@ -8,6 +8,7 @@ export type Settings = { links: Link[]; linkGroups: LinkGroup[]; footerLinks: FooterLink[]; + createModalOpened: boolean; }; const defaultSettings: Settings = { @@ -16,6 +17,7 @@ const defaultSettings: Settings = { links: [], linkGroups: [], footerLinks: [], + createModalOpened: false, }; const HubOneContext = React.createContext({ @@ -25,6 +27,7 @@ const HubOneContext = React.createContext({ setLinks: (link: Link[]) => {}, setLinkGroups: (linkGroups: LinkGroup[]) => {}, setFooterLinks: (footerLinks: FooterLink[]) => {}, + setCreateModalOpened: (createModalOpened: boolean) => {}, }); export const useHubOneContext = () => { @@ -66,6 +69,12 @@ export const HubOneContextProvider = ({ footerLinks, })); }; + const setCreateModalOpened = (createModalOpened: boolean) => { + setState((prevState) => ({ + ...prevState, + createModalOpened, + })); + }; const initState = { ...defaultSettings, @@ -74,6 +83,7 @@ export const HubOneContextProvider = ({ setLinks, setLinkGroups, setFooterLinks, + setCreateModalOpened, }; const [state, setState] = useState(initState); diff --git a/pages/[[...hubPaths]].tsx b/pages/[[...hubPaths]].tsx index 2157a6cb..888eb7fa 100644 --- a/pages/[[...hubPaths]].tsx +++ b/pages/[[...hubPaths]].tsx @@ -9,14 +9,21 @@ import { getHubs } from "../lib/requests/hub/getHubs"; import { useFetchByHubId } from "../lib/useQueries"; import { Footer } from "../ui/components/Footer"; import { HeaderBar } from "../ui/components/Header"; +import AddHubModal from "../ui/components/HubModals/AddHubModal"; import Hero from "../ui/sections/Hero"; import HubMenu from "../ui/sections/HubMenu"; import LinkSection from "../ui/sections/LinkSection"; export default function Home() { const router = useRouter(); - const { setHub, setLinks, setLinkGroups, setFooterLinks } = - useHubOneContext(); + const { + setHub, + setLinks, + setLinkGroups, + setFooterLinks, + createModalOpened, + setCreateModalOpened, + } = useHubOneContext(); // use `|| [""]` for root hub that has no set path by the router const hubPaths = (router.query.hubPaths as string[]) || [""]; const { @@ -26,8 +33,8 @@ export default function Home() { } = useQuery(["hubs", hubPaths[0]], () => getHubWithPath(hubPaths[0]), { onSuccess: setHub, }); - const hubId = Number(hub?.id); + const hubId = Number(hub?.id); const config = (onSuccess: (data: T) => void) => ({ enabled: !!hubId, onSuccess, @@ -87,6 +94,10 @@ export default function Home() { {hubs && }
+ ); } diff --git a/ui/components/Header.tsx b/ui/components/Header.tsx index 700fe4bc..ac8584d0 100644 --- a/ui/components/Header.tsx +++ b/ui/components/Header.tsx @@ -74,12 +74,12 @@ const useStyles = createStyles((theme) => ({ export function HeaderBar() { const { classes } = useStyles(); - const { hub, linkGroups, footerLinks } = useHubOneContext(); + const { hub, linkGroups, footerLinks, setCreateModalOpened } = + useHubOneContext(); const theme = useMantineTheme(); const [opened, toggleOpened] = useToggle(); const { editMode } = useHubOneContext(); const [editModalOpened, setEditModalOpened] = useState(false); - const [addModalOpened, setAddModalOpened] = useState(false); const items = linkGroups?.map((linkGroup) => { return ( setAddModalOpened(true)} + onClick={() => setCreateModalOpened(true)} > Create New Hub @@ -170,7 +170,6 @@ export function HeaderBar() { )} - {hub.id && ( - - - - - - - - - - - Hub Menu - - - {hubs.map((hub) => ( - { - router.push(hub.hubPath); - }} - > - -
- -
- - {hub.hubName} - - - - ))} - - - setAddModalOpened(true)} - icon={} - > - Create New Hub - - - - - + + + + + + + + + + + Hub Menu + + + {hubs.map((hub) => ( + { + router.push(hub.hubPath); + }} + > + +
+ +
+ + {hub.hubName} + + + + ))} + + + setCreateModalOpened(true)} + icon={} + > + Create New Hub + + + ); } From 0a3ddee37d7f0cdafc768e7a1eb603f62351dca2 Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Mon, 24 Apr 2023 01:05:01 +0200 Subject: [PATCH 07/11] refactor: rename AddHubModal to CreateHubModal --- pages/[[...hubPaths]].tsx | 2 +- ui/components/Header.tsx | 3 +-- .../CreateHubModal.tsx} | 11 +++++------ ui/components/HubModals/CreateHubModal/index.tsx | 3 +++ .../HubModals/{ => EditHubModal}/EditHubModal.tsx | 4 ++-- .../{ => EditHubModal}/FooterLinkAddCard.tsx | 2 +- .../HubModals/{ => EditHubModal}/FooterLinkCard.tsx | 2 +- ui/components/HubModals/{ => EditHubModal}/index.ts | 0 8 files changed, 14 insertions(+), 13 deletions(-) rename ui/components/HubModals/{AddHubModal.tsx => CreateHubModal/CreateHubModal.tsx} (78%) create mode 100644 ui/components/HubModals/CreateHubModal/index.tsx rename ui/components/HubModals/{ => EditHubModal}/EditHubModal.tsx (94%) rename ui/components/HubModals/{ => EditHubModal}/FooterLinkAddCard.tsx (95%) rename ui/components/HubModals/{ => EditHubModal}/FooterLinkCard.tsx (98%) rename ui/components/HubModals/{ => EditHubModal}/index.ts (100%) diff --git a/pages/[[...hubPaths]].tsx b/pages/[[...hubPaths]].tsx index 888eb7fa..98619bc7 100644 --- a/pages/[[...hubPaths]].tsx +++ b/pages/[[...hubPaths]].tsx @@ -9,7 +9,7 @@ import { getHubs } from "../lib/requests/hub/getHubs"; import { useFetchByHubId } from "../lib/useQueries"; import { Footer } from "../ui/components/Footer"; import { HeaderBar } from "../ui/components/Header"; -import AddHubModal from "../ui/components/HubModals/AddHubModal"; +import AddHubModal from "../ui/components/HubModals/CreateHubModal/CreateHubModal"; import Hero from "../ui/sections/Hero"; import HubMenu from "../ui/sections/HubMenu"; import LinkSection from "../ui/sections/LinkSection"; diff --git a/ui/components/Header.tsx b/ui/components/Header.tsx index ac8584d0..f8663e68 100644 --- a/ui/components/Header.tsx +++ b/ui/components/Header.tsx @@ -22,8 +22,7 @@ import { Link as ScrollLink } from "react-scroll"; import { useHubOneContext } from "../../lib/context/HubOneContext"; import HubLogo from "./HubLogo"; -import EditHubModal from "./HubModals"; -import AddHubModal from "./HubModals/AddHubModal"; +import EditHubModal from "./HubModals/EditHubModal"; const HEADER_HEIGHT = 60; diff --git a/ui/components/HubModals/AddHubModal.tsx b/ui/components/HubModals/CreateHubModal/CreateHubModal.tsx similarity index 78% rename from ui/components/HubModals/AddHubModal.tsx rename to ui/components/HubModals/CreateHubModal/CreateHubModal.tsx index a65e09aa..514a92fc 100644 --- a/ui/components/HubModals/AddHubModal.tsx +++ b/ui/components/HubModals/CreateHubModal/CreateHubModal.tsx @@ -2,11 +2,10 @@ import { Modal } from "@mantine/core"; import { useForm } from "@mantine/form"; import type { Hub } from "@prisma/client"; -import { usePost } from "../../../lib/useQueries"; +import { usePost } from "../../../../lib/useQueries"; +import HubFormFields from "../HubFormFields"; -import HubFormFields from "./HubFormFields"; - -function EditHubModal({ +function CreateHubModal({ opened, setOpened, }: { @@ -32,7 +31,7 @@ function EditHubModal({ setOpened(false)} - title="Create a new hub" + title="Create a New Hub" >
@@ -41,4 +40,4 @@ function EditHubModal({ ); } -export default EditHubModal; +export default CreateHubModal; diff --git a/ui/components/HubModals/CreateHubModal/index.tsx b/ui/components/HubModals/CreateHubModal/index.tsx new file mode 100644 index 00000000..45eeb606 --- /dev/null +++ b/ui/components/HubModals/CreateHubModal/index.tsx @@ -0,0 +1,3 @@ +import CreateHubModal from "./CreateHubModal"; + +export default CreateHubModal; diff --git a/ui/components/HubModals/EditHubModal.tsx b/ui/components/HubModals/EditHubModal/EditHubModal.tsx similarity index 94% rename from ui/components/HubModals/EditHubModal.tsx rename to ui/components/HubModals/EditHubModal/EditHubModal.tsx index 28737a03..6be67e59 100644 --- a/ui/components/HubModals/EditHubModal.tsx +++ b/ui/components/HubModals/EditHubModal/EditHubModal.tsx @@ -2,11 +2,11 @@ import { Modal, Stack, Tabs } from "@mantine/core"; import { useForm } from "@mantine/form"; import type { FooterLink, Hub } from "@prisma/client"; -import { useUpdate } from "../../../lib/useQueries"; +import { useUpdate } from "../../../../lib/useQueries"; +import HubFormFields from "../HubFormFields"; import FooterLinkAddCard from "./FooterLinkAddCard"; import FooterLinkCard from "./FooterLinkCard"; -import HubFormFields from "./HubFormFields"; function EditHubModal({ opened, diff --git a/ui/components/HubModals/FooterLinkAddCard.tsx b/ui/components/HubModals/EditHubModal/FooterLinkAddCard.tsx similarity index 95% rename from ui/components/HubModals/FooterLinkAddCard.tsx rename to ui/components/HubModals/EditHubModal/FooterLinkAddCard.tsx index c6b19177..16b20e1b 100644 --- a/ui/components/HubModals/FooterLinkAddCard.tsx +++ b/ui/components/HubModals/EditHubModal/FooterLinkAddCard.tsx @@ -3,7 +3,7 @@ import type { FooterLink } from "@prisma/client"; import { IconPlus } from "@tabler/icons-react"; import { motion } from "framer-motion"; -import { usePost } from "../../../lib/useQueries"; +import { usePost } from "../../../../lib/useQueries"; function FooterLinkAddCard({ hubId }: { hubId: number }) { const { classes } = useStyles(); diff --git a/ui/components/HubModals/FooterLinkCard.tsx b/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx similarity index 98% rename from ui/components/HubModals/FooterLinkCard.tsx rename to ui/components/HubModals/EditHubModal/FooterLinkCard.tsx index d77e5b98..64862d81 100644 --- a/ui/components/HubModals/FooterLinkCard.tsx +++ b/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx @@ -13,7 +13,7 @@ import { IconTrash } from "@tabler/icons-react"; import { motion } from "framer-motion"; import { useEffect, useState } from "react"; -import { useDelete, useUpdate } from "../../../lib/useQueries"; +import { useDelete, useUpdate } from "../../../../lib/useQueries"; function FooterLinkCard({ id, title, link, hubId }: FooterLink) { const { classes } = useStyles(); diff --git a/ui/components/HubModals/index.ts b/ui/components/HubModals/EditHubModal/index.ts similarity index 100% rename from ui/components/HubModals/index.ts rename to ui/components/HubModals/EditHubModal/index.ts From 1b4b7473632206d5144d9d1fc5b01fdf37cac3de Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Mon, 24 Apr 2023 01:20:03 +0200 Subject: [PATCH 08/11] fix: remove footer link updating when edit modal opened --- .../HubModals/EditHubModal/FooterLinkCard.tsx | 21 +++---------------- 1 file changed, 3 insertions(+), 18 deletions(-) diff --git a/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx b/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx index 64862d81..75d3867a 100644 --- a/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx +++ b/ui/components/HubModals/EditHubModal/FooterLinkCard.tsx @@ -7,11 +7,10 @@ import { Text, TextInput, } from "@mantine/core"; -import { useDebouncedValue } from "@mantine/hooks"; import type { FooterLink } from "@prisma/client"; import { IconTrash } from "@tabler/icons-react"; import { motion } from "framer-motion"; -import { useEffect, useState } from "react"; +import { useState } from "react"; import { useDelete, useUpdate } from "../../../../lib/useQueries"; @@ -21,11 +20,7 @@ function FooterLinkCard({ id, title, link, hubId }: FooterLink) { const deleteItem = useDelete("footerlinks"); const updateItem = useUpdate("footerlinks"); const [state, setState] = useState({ title, link }); - const [debouncedState] = useDebouncedValue(state, 50); - useEffect(() => { - updateItem({ id, hubId, ...debouncedState }); - }, [debouncedState, hubId, id, updateItem]); return ( { + onBlur={() => { + updateItem({ id, hubId, ...state }); setIsEditing(false); }} > @@ -62,11 +58,6 @@ function FooterLinkCard({ id, title, link, hubId }: FooterLink) { ) => { e.stopPropagation(); }} - onKeyDown={(e) => { - if (e.code === "Enter") { - setIsEditing(false); - } - }} /> { e.stopPropagation(); }} - // eslint-disable-next-line sonarjs/no-identical-functions - onKeyDown={(e) => { - if (e.code === "Enter") { - setIsEditing(false); - } - }} /> ) : ( From 6afd1ec58a15cb40a6b43f76770a68329dbcc6ba Mon Sep 17 00:00:00 2001 From: IhsenBouallegue Date: Mon, 24 Apr 2023 01:22:56 +0200 Subject: [PATCH 09/11] fix: fetch hubs, links and linkgroups by id order --- pages/api/v1/hubs/index.ts | 6 +++++- pages/api/v1/linkgroups/index.ts | 7 ++++++- pages/api/v1/links/index.ts | 7 ++++++- 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/pages/api/v1/hubs/index.ts b/pages/api/v1/hubs/index.ts index e445c9fc..991f2b0d 100644 --- a/pages/api/v1/hubs/index.ts +++ b/pages/api/v1/hubs/index.ts @@ -5,7 +5,11 @@ import { prisma } from "../../../../lib/prisma"; // GET export async function handleGET(res: NextApiResponse) { try { - const items = await prisma.hub.findMany(); + const items = await prisma.hub.findMany({ + orderBy: { + id: "asc", + }, + }); res.json(items); } catch (error) { res.status(500).json({ error }); diff --git a/pages/api/v1/linkgroups/index.ts b/pages/api/v1/linkgroups/index.ts index dcce1869..b53ebd2d 100644 --- a/pages/api/v1/linkgroups/index.ts +++ b/pages/api/v1/linkgroups/index.ts @@ -7,7 +7,12 @@ async function handleGET(res: NextApiResponse, hubId: number) { try { let items; if (hubId && !Number.isNaN(hubId)) { - items = await prisma.linkGroup.findMany({ where: { hubId } }); + items = await prisma.linkGroup.findMany({ + where: { hubId }, + orderBy: { + id: "asc", + }, + }); } else { items = await prisma.linkGroup.findMany(); } diff --git a/pages/api/v1/links/index.ts b/pages/api/v1/links/index.ts index a05e05b9..6bae93fa 100644 --- a/pages/api/v1/links/index.ts +++ b/pages/api/v1/links/index.ts @@ -7,7 +7,12 @@ async function handleGET(res: NextApiResponse, hubId: number) { try { let items; if (hubId && !Number.isNaN(hubId)) { - items = await prisma.link.findMany({ where: { hubId } }); + items = await prisma.link.findMany({ + where: { hubId }, + orderBy: { + id: "asc", + }, + }); } else { items = await prisma.link.findMany(); } From 10ca5a85e4a3ba1454eaf3cb065128f501c99197 Mon Sep 17 00:00:00 2001 From: Ihsen Date: Wed, 26 Apr 2023 14:33:17 +0200 Subject: [PATCH 10/11] fix: update the correct hub in edit hub modal --- ui/components/Header.tsx | 44 ++++++++----------- .../HubModals/EditHubModal/EditHubModal.tsx | 25 ++++++----- ui/sections/HubMenu/HubMenu.tsx | 9 ++-- 3 files changed, 37 insertions(+), 41 deletions(-) diff --git a/ui/components/Header.tsx b/ui/components/Header.tsx index f8663e68..516f7e2d 100644 --- a/ui/components/Header.tsx +++ b/ui/components/Header.tsx @@ -73,31 +73,28 @@ const useStyles = createStyles((theme) => ({ export function HeaderBar() { const { classes } = useStyles(); - const { hub, linkGroups, footerLinks, setCreateModalOpened } = - useHubOneContext(); + const { hub, linkGroups, setCreateModalOpened } = useHubOneContext(); const theme = useMantineTheme(); const [opened, toggleOpened] = useToggle(); const { editMode } = useHubOneContext(); const [editModalOpened, setEditModalOpened] = useState(false); - const items = linkGroups?.map((linkGroup) => { - return ( - ( + + - - ); - }); + {linkGroup.title} + + + )); return (
{hub.id && ( - + )}
); diff --git a/ui/components/HubModals/EditHubModal/EditHubModal.tsx b/ui/components/HubModals/EditHubModal/EditHubModal.tsx index 6be67e59..a97b901f 100644 --- a/ui/components/HubModals/EditHubModal/EditHubModal.tsx +++ b/ui/components/HubModals/EditHubModal/EditHubModal.tsx @@ -1,7 +1,9 @@ import { Modal, Stack, Tabs } from "@mantine/core"; import { useForm } from "@mantine/form"; -import type { FooterLink, Hub } from "@prisma/client"; +import type { Hub } from "@prisma/client"; +import { useEffect } from "react"; +import { useHubOneContext } from "../../../../lib/context/HubOneContext"; import { useUpdate } from "../../../../lib/useQueries"; import HubFormFields from "../HubFormFields"; @@ -11,18 +13,13 @@ import FooterLinkCard from "./FooterLinkCard"; function EditHubModal({ opened, setOpened, - footerLinks, - id, - hubName, - hubLogo, - hubPath, - primaryColor, - secondaryColor, }: { opened: boolean; setOpened: (open: boolean) => void; - footerLinks: FooterLink[]; -} & Hub) { +}) { + const { hub, footerLinks } = useHubOneContext(); + const { id, hubName, hubLogo, hubPath, primaryColor, secondaryColor } = hub; + const form = useForm({ initialValues: { id, @@ -38,6 +35,9 @@ function EditHubModal({ update(values); setOpened(false); }; + useEffect(() => { + if (hubPath !== form.getInputProps("hubPath").value) form.setValues(hub); + }, [form, hub, hubPath]); return ( ( ))} diff --git a/ui/sections/HubMenu/HubMenu.tsx b/ui/sections/HubMenu/HubMenu.tsx index a5c12a8a..97b59372 100644 --- a/ui/sections/HubMenu/HubMenu.tsx +++ b/ui/sections/HubMenu/HubMenu.tsx @@ -19,17 +19,17 @@ import HubLogo from "../../components/HubLogo"; export default function HubMenu({ hubs }: { hubs: Hub[] }) { const router = useRouter(); - const [opened, setOpened] = useState(true); - // const [addModalOpened, setAddModalOpened] = useState(false); + const [opened, setOpened] = useState(false); const { setCreateModalOpened } = useHubOneContext(); + return ( @@ -45,6 +45,7 @@ export default function HubMenu({ hubs }: { hubs: Hub[] }) { {hubs.map((hub) => ( { router.push(hub.hubPath); }} From ecec1fbd4488b812148f1756e5a6bb91b5b9d27f Mon Sep 17 00:00:00 2001 From: Ihsen Date: Wed, 26 Apr 2023 15:05:02 +0200 Subject: [PATCH 11/11] fix: break word instead of break all in hubmenu --- ui/sections/HubMenu/HubMenu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/sections/HubMenu/HubMenu.tsx b/ui/sections/HubMenu/HubMenu.tsx index 97b59372..52416624 100644 --- a/ui/sections/HubMenu/HubMenu.tsx +++ b/ui/sections/HubMenu/HubMenu.tsx @@ -55,7 +55,7 @@ export default function HubMenu({ hubs }: { hubs: Hub[] }) {