Skip to content

Commit 7cf3b7f

Browse files
committed
Add item property to StringItems type; remove ESLint config file; refactor layout classes in Notes, Home, and other components; update useFilteredData hook and related components for improved type safety
1 parent 237b3ff commit 7cf3b7f

File tree

21 files changed

+179
-166
lines changed

21 files changed

+179
-166
lines changed

.eslintrc.ts

Lines changed: 0 additions & 8 deletions
This file was deleted.

eslint.config.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,8 @@ export default tseslint.config([
2929
...react.configs['jsx-runtime'].rules,
3030
...reactHooks.configs.recommended.rules,
3131
'react/jsx-no-target-blank': 'off',
32-
'react-refresh/only-export-components': ['warn', { allowConstantExport: true }]
32+
'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
33+
'@typescript-eslint/no-explicit-any': 'off'
3334
}
3435
}
3536
])

src/Layout/Layout.tsx

Lines changed: 15 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,20 @@
11
import { Footer, Navbar } from '@/components'
2-
import AppRoutes from '@/Routes/Routes'
2+
import { useLocation } from 'react-router-dom'
3+
import Content from '@/Routes/Routes'
4+
5+
export default function Layout() {
6+
const location = useLocation()
7+
const isErrorRoute = location.pathname === '/404'
38

4-
export default function Layout({ isErrorRoute }: { isErrorRoute: boolean }) {
59
return (
6-
<main className="dark:text-foreground dark:bg-background relative flex-grow mx-auto m-0 p-0 min-h-screen items-center justify-center bg-cover bg-center bg-no-repeat bg-fixed dark:bg-maddons-bg bg-maddons-light">
7-
<div className="min-h-screen absolute top-0 left-0 right-0 bottom-0 dark:bg-custom-radial z-[1]"></div>
8-
<div className="relative z-[2] text-default-900 text-center">
9-
<header className="flex flex-row flex-nowrap items-center h-[var(--navbar-height)] px-0 justify-center sticky top-0 z-40 bg-transparent w-full gap-4">
10-
<Navbar />
11-
</header>
12-
<main className="flex flex-col items-center justify-center gap-4 py-8 md:py-10">
13-
<AppRoutes />
14-
</main>
15-
<footer className="bottom-0 left-0 right-0 p-2 dark:bg-black/80 text-default-500 shadow-2xl bg-default-50/80 border-t-1 border-white/5">
16-
{!isErrorRoute && <Footer />}
17-
</footer>
18-
</div>
19-
</main>
10+
<div className="relative z-[2]">
11+
<Navbar />
12+
<main className="container mx-auto max-w-7xl px-6 flex-grow pt-16">
13+
<Content />
14+
</main>
15+
<footer className="bottom-0 left-0 right-0 p-2 dark:bg-black/80 text-default-500 shadow-2xl bg-default-50/80 border-t-1 border-white/5 mt-8">
16+
{!isErrorRoute && <Footer />}
17+
</footer>
18+
</div>
2019
)
2120
}

src/NextUIProv.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { NextUIProvider } from '@nextui-org/react'
2+
import { ReactNode } from 'react'
3+
import { useHref, useNavigate } from 'react-router-dom'
4+
5+
export function NextUIProv({ children }: { children: ReactNode }) {
6+
const navigate = useNavigate()
7+
8+
return (
9+
<NextUIProvider navigate={navigate} useHref={useHref} className="bg-backgrounds-main">
10+
<div className="bg-backgrounds-main-shadows"></div>
11+
{children}
12+
</NextUIProvider>
13+
)
14+
}

src/assets/css/main.css

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -126,11 +126,18 @@
126126
}
127127

128128
@layer components {
129-
.layer {
130-
@apply justify-center inline-block max-w-4xl text-start;
129+
.bg-inputs {
130+
@apply flex flex-shrink gap-4 w-fit p-4 mx-auto flex-col lg:flex-row rounded-md border-small border-primary-200/40 bg-background/60 shadow-medium backdrop-blur-md mb-2;
131+
}
132+
.bg-inputs-double {
133+
@apply flex lg:flex-row justify-end flex-shrink gap-4 w-fit p-4 mx-auto flex-col rounded-md border-small border-primary-200/40 bg-background/60 shadow-medium backdrop-blur-md mb-2;
131134
}
132135

133-
.bg-inputs {
134-
@apply flex flex-shrink gap-4 w-auto p-4 mx-auto flex-col lg:flex-row rounded-md border-small border-primary-200/40 bg-background/60 shadow-medium backdrop-blur-md mb-2;
136+
.bg-backgrounds-main {
137+
@apply dark:text-foreground dark:bg-background relative flex-grow mx-auto m-0 p-0 min-h-screen items-center justify-center bg-cover bg-center bg-no-repeat bg-fixed dark:bg-maddons-bg bg-maddons-light;
138+
}
139+
140+
.bg-backgrounds-main-shadows {
141+
@apply min-h-screen absolute top-0 left-0 right-0 bottom-0 dark:bg-custom-radial z-[1];
135142
}
136143
}

src/components/Footer/Footer.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export default function Footer() {
3939
<li key={`${item}-${index}`}>
4040
<Link
4141
color="foreground"
42-
className="outline-none text-small no-underline hover:opacity-80 active:opacity-disabled transition-opacity text-default-400"
42+
className="outline-none text-small no-underline hover:opacity-80 active:opacity-disabled transition-opacity text-default-500"
4343
href={item.href}
4444
onPress={() =>
4545
window.scrollTo({ top: 0, behavior: 'smooth' })

src/components/ItemList/ItemList.tsx

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,19 @@ import { Card, CardBody, Image, Button, Tooltip, Chip, Avatar, Divider } from '@
22
import { AnimatePresence } from 'framer-motion'
33
import { classIcon } from '@/utils/classIcon'
44
import { FlameIcon, GroupIcon } from '@/assets/Icons'
5+
import { StringItems } from '@/types'
56

67
interface ItemListProps {
7-
data: any[]
8-
onOpenDetails: (item: any) => void
8+
data: StringItems[]
9+
onOpenDetails: (item: StringItems) => void
910
handleCopyToClipboard: (content: string) => void
1011
itemToShow: number
1112
}
1213

1314
const ItemList = ({ data, onOpenDetails, handleCopyToClipboard, itemToShow }: ItemListProps) => (
1415
<div className="flex flex-wrap gap-4 content-center items-center justify-center">
1516
<AnimatePresence>
16-
{data.slice(0, itemToShow).map((item) => (
17+
{data.slice(0, itemToShow).map((item: StringItems) => (
1718
<div
1819
key={`${item.uuid}-${item.title}`}
1920
className="transition-transform duration-300 ease-in-out hover:scale-105"
@@ -42,7 +43,11 @@ const ItemList = ({ data, onOpenDetails, handleCopyToClipboard, itemToShow }: It
4243
radius="sm"
4344
size="sm"
4445
variant="shadow"
45-
onPress={() => handleCopyToClipboard(item.content)}
46+
onPress={() =>
47+
handleCopyToClipboard(
48+
item.content || 'Dont have content'
49+
)
50+
}
4651
>
4752
Copy
4853
</Button>

src/components/Navbar/Navbar.tsx

Lines changed: 96 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -24,98 +24,107 @@ export default function AppNavbar() {
2424
const location = useLocation()
2525

2626
return (
27-
<Navbar
28-
shouldHideOnScroll
29-
isMenuOpen={isMenuOpen}
30-
onMenuOpenChange={setIsMenuOpen}
31-
className="w-full max-w-[1080px] h-full rounded-full border-small dark:border-primary-200/40 dark:bg-background/60 shadow-medium backdrop-blur-md mt-2"
32-
>
33-
<NavbarContent>
34-
<NavbarMenuToggle
35-
aria-label={isMenuOpen ? 'Close menu' : 'Open menu'}
36-
className="sm:hidden"
37-
/>
38-
<NavbarBrand as="li" className="gap-3 max-w-fit">
27+
<div className="flex flex-row flex-nowrap justify-center sticky top-0 z-40">
28+
<Navbar
29+
shouldHideOnScroll
30+
isMenuOpen={isMenuOpen}
31+
onMenuOpenChange={setIsMenuOpen}
32+
className="w-full max-w-[1080px] h-full rounded-full border-small dark:border-primary-200/40 dark:bg-background/60 shadow-medium backdrop-blur-md mt-2 "
33+
>
34+
<NavbarContent>
35+
<NavbarMenuToggle
36+
aria-label={isMenuOpen ? 'Close menu' : 'Open menu'}
37+
className="sm:hidden"
38+
/>
39+
<NavbarBrand as="li" className="gap-3 max-w-fit">
40+
<Link
41+
color="foreground"
42+
className="flex items-center justify-start"
43+
href="/home"
44+
>
45+
<Avatar
46+
src="/logo.svg"
47+
alt="Maddons logo"
48+
className="w-8 h-8 object-contain bg-transparent"
49+
/>
50+
<p className="text-tiny ml-0 mr-1 font-bold uppercase text-inherit md:text-base">
51+
addon Manager
52+
</p>
53+
<Chip
54+
color="primary"
55+
variant="flat"
56+
size="sm"
57+
className="hidden sm:flex"
58+
>
59+
on Dev👩🏽‍💻
60+
</Chip>
61+
</Link>
62+
</NavbarBrand>
63+
</NavbarContent>
64+
<NavbarContent className="hidden gap-4 sm:flex" justify="center">
65+
{siteConfig.navItems.map((item, index) => (
66+
<NavbarItem key={`${item.href}-${index}`}>
67+
<Link
68+
color={
69+
location.pathname === item.href ? 'foreground' : 'foreground'
70+
}
71+
href={item.href}
72+
className={`${
73+
location.pathname === item.href
74+
? 'text-default-500 font-semibold'
75+
: ''
76+
}`}
77+
onPress={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
78+
>
79+
{item.label}
80+
</Link>
81+
</NavbarItem>
82+
))}
83+
<Resources items={siteConfig.navItemsAccord} />
3984
<Link
85+
href="https://maddonsmanager.featurebase.app/"
86+
isExternal
87+
showAnchorIcon
4088
color="foreground"
41-
className="flex items-center justify-start"
42-
href="/home"
4389
>
44-
<Avatar
45-
src="/logo.svg"
46-
alt="Maddons logo"
47-
className="w-8 h-8 object-contain bg-transparent"
48-
/>
49-
<p className="text-tiny ml-0 mr-1 font-bold uppercase text-inherit md:text-base">
50-
addon Manager
51-
</p>
52-
<Chip color="primary" variant="flat" size="sm" className="hidden sm:flex">
53-
on Dev👩🏽‍💻
54-
</Chip>
90+
Request
5591
</Link>
56-
</NavbarBrand>
57-
</NavbarContent>
58-
<NavbarContent className="hidden gap-4 sm:flex" justify="center">
59-
{siteConfig.navItems.map((item, index) => (
60-
<NavbarItem key={`${item.href}-${index}`}>
61-
<Link
62-
color={location.pathname === item.href ? 'foreground' : 'foreground'}
63-
href={item.href}
64-
className={`${
65-
location.pathname === item.href
66-
? 'text-default-500 font-semibold'
67-
: ''
68-
}`}
69-
onPress={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
70-
>
71-
{item.label}
92+
</NavbarContent>
93+
<NavbarContent justify="end">
94+
<NavbarItem className=" gap-2 flex">
95+
<Link isExternal aria-label="Discord" href={siteConfig.links.discord}>
96+
<DiscordIcon className="text-default-500" />
7297
</Link>
73-
</NavbarItem>
74-
))}
75-
<Resources items={siteConfig.navItemsAccord} />
76-
<Link
77-
href="https://maddonsmanager.featurebase.app/"
78-
isExternal
79-
showAnchorIcon
80-
color="foreground"
81-
>
82-
Request
83-
</Link>
84-
</NavbarContent>
85-
<NavbarContent justify="end">
86-
<NavbarItem className=" gap-2 flex">
87-
<Link isExternal aria-label="Discord" href={siteConfig.links.discord}>
88-
<DiscordIcon className="text-default-500" />
89-
</Link>
90-
<Link isExternal aria-label="Twitter" href={siteConfig.links.twitter}>
91-
<TwitterIcon className="w-5 h-5 text-default-500" />
92-
</Link>
93-
<Link isExternal aria-label="Github" href={siteConfig.links.github}>
94-
<GithubIcon className="w-5 h-5 text-default-500" />
95-
</Link>
96-
<Divider orientation="vertical" className="h-auto mr-4 ml-2" />
97-
<ThemeSwitch />
98-
</NavbarItem>
99-
</NavbarContent>
100-
<NavbarMenu className="top-[calc(var(--navbar-height)/2)] mx-auto mt-9 max-h-[40vh] max-w-[80vw] rounded-large border-small border-primary-200/20 bg-background/60 py-6 shadow-medium backdrop-blur-md">
101-
{siteConfig.navMenuItems.map((item, index) => (
102-
<NavbarMenuItem key={`${item}-${index}`}>
103-
<Link
104-
color={location.pathname === item.href ? 'primary' : 'foreground'}
105-
className={`${
106-
location.pathname === item.href
107-
? 'text-default-500 font-medium'
108-
: ''
109-
}`}
110-
href={item.href}
111-
size="lg"
112-
onPress={() => setIsMenuOpen(false)}
113-
>
114-
{item.label}
98+
<Link isExternal aria-label="Twitter" href={siteConfig.links.twitter}>
99+
<TwitterIcon className="w-5 h-5 text-default-500" />
100+
</Link>
101+
<Link isExternal aria-label="Github" href={siteConfig.links.github}>
102+
<GithubIcon className="w-5 h-5 text-default-500" />
115103
</Link>
116-
</NavbarMenuItem>
117-
))}
118-
</NavbarMenu>
119-
</Navbar>
104+
<Divider orientation="vertical" className="h-auto mr-4 ml-2" />
105+
<ThemeSwitch />
106+
</NavbarItem>
107+
</NavbarContent>
108+
<NavbarMenu className="top-[calc(var(--navbar-height)/2)] mx-auto mt-9 max-h-[40vh] max-w-[80vw] rounded-large border-small border-primary-200/20 bg-background/60 py-6 shadow-medium backdrop-blur-md">
109+
{siteConfig.navMenuItems.map((item, index) => (
110+
<NavbarMenuItem key={`${item}-${index}`}>
111+
<Link
112+
color={location.pathname === item.href ? 'primary' : 'foreground'}
113+
className={`${
114+
location.pathname === item.href
115+
? 'text-default-500 font-medium'
116+
: ''
117+
}`}
118+
href={item.href}
119+
size="lg"
120+
onPress={() => setIsMenuOpen(false)}
121+
>
122+
{item.label}
123+
</Link>
124+
</NavbarMenuItem>
125+
))}
126+
</NavbarMenu>
127+
</Navbar>
128+
</div>
120129
)
121130
}

src/components/ProfilesDetails/ProfilesDetails.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ const ProfilesDetails = ({ data, isOpen, onOpenChange }: ProfilesDetailsProps) =
114114
</div>
115115
<Divider className="my-2" />
116116
<h2 className="text-lg font-extrabold">Description</h2>
117-
<article className="markdown-body p-1 !bg-transparent justify-center inline-block max-w-4xl text-start">
117+
<article className="markdown-body p-1 !bg-transparent">
118118
<ReactMarkdown
119119
remarkPlugins={[remarkGfm]}
120120
rehypePlugins={[rehypeRaw]}

src/components/SelectNotes/SelectNotes.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { Autocomplete, AutocompleteItem } from '@nextui-org/react'
22

33
interface SelectNotesProps {
44
selectedNotes: 'app' | 'web'
5-
setSelectedNotes: (notes: 'app' | 'web') => void
5+
setSelectedNotes: (key: 'app' | 'web') => void
66
}
77

88
const SelectNotes = ({ selectedNotes, setSelectedNotes }: SelectNotesProps) => {
@@ -12,9 +12,7 @@ const SelectNotes = ({ selectedNotes, setSelectedNotes }: SelectNotesProps) => {
1212
label="Notes"
1313
isVirtualized
1414
selectedKey={selectedNotes}
15-
onSelectionChange={(key: React.Key | null) =>
16-
setSelectedNotes(key as 'app' | 'web')
17-
}
15+
onSelectionChange={(key) => setSelectedNotes(key as 'app' | 'web')}
1816
size="md"
1917
className="w-auto max-w-fit font-bold text-default-900"
2018
variant="underlined"

0 commit comments

Comments
 (0)