Skip to content

Commit f85d0fa

Browse files
devashish2024devashish2024
committed
add categories + search for configs
1 parent 4758ad7 commit f85d0fa

File tree

8 files changed

+143
-104
lines changed

8 files changed

+143
-104
lines changed

‎components/Sections/configs/ConfigCard.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export default async function ConfigCard({ config }: { config: Config }) {
3939

4040
return (
4141
<div>
42-
<Card className="cursor-pointer hover:bg-slate-100/60 transition-colors flex flex-col">
42+
<Card className="cursor-pointer hover:bg-slate-100/60 transition-colors flex flex-col h-full">
4343
<CardContent className="flex-grow space-y-2 p-4">
4444
<CardTitle className="text-lg">{config.title}</CardTitle>
4545
<div className="flex flex-wrap gap-2 -ml-1">

‎components/Sections/configs/Configs.tsx

Lines changed: 17 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,22 @@
1-
import ConfigsGrid from './ConfigsGrid';
2-
import SkeletonCard from './SkeletonCard';
3-
import { Suspense } from 'react';
1+
import prisma from "@/lib/db";
2+
import ConfigsGrid from "./ConfigsGrid";
43

5-
export default function Configs() {
6-
return (
7-
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 auto-rows-fr">
8-
<Suspense fallback={<Fallback />}>
9-
<ConfigsGrid />
10-
</Suspense>
11-
</div>
12-
);
13-
}
4+
export default async function Configs() {
5+
const configs = await prisma.config.findMany({
6+
select: {
7+
id: true,
8+
title: true,
9+
description: true,
10+
categories: true,
11+
config: true,
12+
user: true,
13+
},
14+
orderBy: {
15+
createdAt: 'desc',
16+
},
17+
});
1418

15-
function Fallback() {
1619
return (
17-
<>
18-
{Array(6)
19-
.fill(null)
20-
.map((_, index: number) => (
21-
<SkeletonCard key={index} />
22-
))}
23-
</>
20+
<ConfigsGrid configs={configs} />
2421
);
2522
}

‎components/Sections/configs/ConfigsGrid.tsx

Lines changed: 87 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,97 @@
1+
'use client'
2+
13
import NewConfigCard from './NewConfig';
24
import prisma from '@/lib/db';
35
import ConfigCard from './ConfigCard';
6+
import { Input } from '@/components/ui/input';
7+
import SearchCategoryMenu from './SearchCategoryMenu';
8+
import SkeletonCard from './SkeletonCard';
9+
import { Suspense, useState } from 'react';
10+
import { faXmarkCircle } from '@fortawesome/free-solid-svg-icons';
11+
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
12+
13+
export default function ConfigsGrid({ configs }: { configs: any }) {
14+
const [category, setCategory] = useState('All');
15+
const [filter, setFilter] = useState('');
16+
17+
const updateCategory = (value: string) => {
18+
setCategory(value);
19+
}
20+
21+
const updateFilter = (e: any) => {
22+
setFilter(e.target.value);
23+
}
24+
25+
const filteredConfigs = configs.filter(({ title, description, categories, user }: any) => {
26+
const matchesCategory =
27+
category === 'All' ||
28+
categories.map((cate: string) => cate.toLowerCase()).includes(category.toLowerCase());
29+
const matchesSearchQuery =
30+
title.toLowerCase().includes(filter.toLowerCase()) ||
31+
description
32+
.toLowerCase()
33+
.includes(filter.toLowerCase());
34+
categories.map((cat: string) => cat.toLowerCase())
35+
.includes(filter.toLowerCase());
36+
return matchesCategory && matchesSearchQuery;
37+
})
438

5-
export default async function ConfigsGrid() {
6-
const configs = await prisma.config.findMany({
7-
select: {
8-
id: true,
9-
title: true,
10-
description: true,
11-
categories: true,
12-
config: true,
13-
user: true,
14-
},
15-
orderBy: {
16-
createdAt: 'desc',
17-
},
18-
});
1939

2040
return (
21-
<>
22-
<NewConfigCard />
41+
<div>
42+
<div className="flex mb-4 gap-4">
43+
<SearchCategoryMenu value={category} onChange={updateCategory} />
44+
<Input
45+
type="text"
46+
placeholder="Filter Configs"
47+
value={filter}
48+
onChange={updateFilter}
49+
/>
50+
</div>
51+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 auto-rows-fr">
52+
<Suspense fallback={<Fallback />}>
53+
{filteredConfigs.length === 0 ? (
54+
<div className="flex flex-col col-span-full text-center py-10 gap-2">
55+
<FontAwesomeIcon
56+
icon={faXmarkCircle}
57+
className="size-8 text-black left-0 right-0 mx-auto"
58+
/>
59+
<h2 className="text-2xl font-semibold text-gray-600 font-sans tracking-tight">
60+
No scripts found
61+
</h2>
62+
<div className="flex justify-center">
63+
<p className="text-gray-500 text-center max-w-4xl">
64+
Try adjusting your search or filters to find what you&apos;re
65+
looking for.
66+
</p>
67+
</div>
68+
</div>
69+
) : (
70+
<>
71+
<NewConfigCard />
72+
{
73+
filteredConfigs.map((config: any) => (
74+
<ConfigCard key={config.id} config={config} />
75+
))
76+
}
77+
</>
78+
)}
79+
</Suspense>
80+
</div>
81+
</div>
82+
);
83+
}
84+
2385

24-
{configs.map((config) => (
25-
<ConfigCard key={config.id} config={config} />
26-
))}
86+
87+
function Fallback() {
88+
return (
89+
<>
90+
{Array(6)
91+
.fill(null)
92+
.map((_, index: number) => (
93+
<SkeletonCard key={index} />
94+
))}
2795
</>
2896
);
2997
}

‎components/Sections/configs/SearchCategoryMenu.tsx

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import {
2+
Select,
3+
SelectContent,
4+
SelectItem,
5+
SelectTrigger,
6+
SelectValue,
7+
} from '@/components/ui/select';
8+
9+
const SearchCategoryMenu = ({ value, onChange }: any) => {
10+
return (
11+
<Select onValueChange={onChange} value={value}>
12+
<SelectTrigger className="w-[200px] md:w-[280px]">
13+
<SelectValue placeholder="All" />
14+
</SelectTrigger>
15+
<SelectContent>
16+
<SelectItem value="All">All</SelectItem>
17+
<SelectItem value="official">Official</SelectItem>
18+
<SelectItem value="bypasses">Bypasses</SelectItem>
19+
<SelectItem value="ghost">Ghost</SelectItem>
20+
<SelectItem value="legit">Legit</SelectItem>
21+
<SelectItem value="blatent">Blatent</SelectItem>
22+
</SelectContent>
23+
</Select>
24+
);
25+
};
26+
27+
export default SearchCategoryMenu;

‎components/Sections/scripts/Scripts.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -41,16 +41,16 @@ export default function Scripts() {
4141

4242
const filteredScripts = scripts
4343
? Object.entries(scripts).filter(([title, scriptData]: any) => {
44-
const matchesCategory =
45-
selectedCategory === 'All' ||
46-
scriptData.category === selectedCategory.toLowerCase();
47-
const matchesSearchQuery =
48-
title.toLowerCase().includes(searchQuery.toLowerCase()) ||
49-
scriptData.description
50-
.toLowerCase()
51-
.includes(searchQuery.toLowerCase());
52-
return matchesCategory && matchesSearchQuery;
53-
})
44+
const matchesCategory =
45+
selectedCategory === 'All' ||
46+
scriptData.category === selectedCategory.toLowerCase();
47+
const matchesSearchQuery =
48+
title.toLowerCase().includes(searchQuery.toLowerCase()) ||
49+
scriptData.description
50+
.toLowerCase()
51+
.includes(searchQuery.toLowerCase());
52+
return matchesCategory && matchesSearchQuery;
53+
})
5454
: [];
5555

5656
if (selectedCategory === 'All') {

‎components/ui/Nav/index.tsx

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,14 @@
1-
'use client';
2-
31
import { Nav } from '@/components/ui/Nav/Nav';
42
import { Title } from '@/components/ui/Nav/Title';
53
import { Links } from '@/components/ui/Nav/Links';
64
import MobileMenu from './MobileMenu';
7-
import { useEffect, useState } from 'react';
85

96
export default function Header() {
10-
const [isTop, setIsTop] = useState(true);
11-
12-
useEffect(() => {
13-
return () => {
14-
if (typeof window != null) {
15-
window.addEventListener('scroll', () => {
16-
console.log(window.scrollY);
17-
setIsTop(window.scrollY <= 70 && window.location.pathname === '/');
18-
});
19-
}
20-
setIsTop(window.scrollY <= 70 && window.location.pathname === '/');
21-
};
22-
}, []);
237
return (
248
<div
259
className="tracking-tight text-white sticky top-0 z-[99999] transition-transform duration-200"
2610
style={{
27-
background: isTop ? 'black' : "url('/textures/obsidian.png') repeat",
11+
background: "black",
2812
imageRendering: 'pixelated',
2913
}}
3014
>

‎prisma/migrations/20240911185314_edits/migration.sql

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

‎prisma/migrations/migration_lock.toml

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

0 commit comments

Comments
 (0)