diff --git a/app/api/teams/get-teams/route.jsx b/app/api/teams/get-teams/route.jsx new file mode 100644 index 0000000..7c4b80f --- /dev/null +++ b/app/api/teams/get-teams/route.jsx @@ -0,0 +1,14 @@ +import dbConnect from "../../../../lib/dbConnect"; +import { TeamModel } from "../../../../model/Team"; + +export async function GET() { + await dbConnect(); + + try { + const teams = await TeamModel.find(); + return new Response(JSON.stringify({ success: true, teams }), { status: 200 }); + } catch (error) { + console.error('Error fetching teams:', error); + return new Response(JSON.stringify({ success: false, message: 'Error fetching teams' }), { status: 500 }); + } +} \ No newline at end of file diff --git a/app/create-team/page.jsx b/app/create-team/page.jsx index 4d93442..125968a 100644 --- a/app/create-team/page.jsx +++ b/app/create-team/page.jsx @@ -5,13 +5,13 @@ import { useForm } from "react-hook-form" import { Button } from "../../@/components/ui/button" import { - Form, - FormControl, - FormDescription, - FormField, - FormItem, - FormLabel, - FormMessage, + Form, + FormControl, + FormDescription, + FormField, + FormItem, + FormLabel, + FormMessage, } from "../../@/components/ui/form" import { Input } from "../../@/components/ui/input" import { useState } from 'react'; @@ -22,8 +22,8 @@ import { useToast } from '../../@/components/ui/use-toast'; - - export default function CreateTeamForm() { + +export default function CreateTeamForm() { // const [image, setImage] = useState(''); const [teamname, setTeamname] = useState(''); @@ -49,14 +49,22 @@ import { useToast } from '../../@/components/ui/use-toast'; players: '', requests: '' }, - }); + shouldFocusError: false, + }); - const { reset } = form; + const { reset } = form; const onSubmit = async (data) => { try { - if(teamname !== '' && game !== '' && role !== '' && rank !== '' && server !== '' && language !== '' && players !== '' && requests !== '') { - const response = await axios.post('/api/teams/create-team', data); + if (teamname !== '' && game !== '' && role !== '' && rank !== '' && server !== '' && language !== '' && players !== '' && requests !== '') { + + const playersArray = players.split(',').map(player => player.trim()); + const dataWithPlayersArray = { + ...data, + players: playersArray, + }; + + const response = await axios.post('/api/teams/create-team', dataWithPlayersArray); toast({ title: 'Success', @@ -73,242 +81,226 @@ import { useToast } from '../../@/components/ui/use-toast'; setPlayers(''); setRequests(''); } - // const response = await axios.post('/api/teams/create-team', data); - - // toast({ - // title: 'Success', - // description: response.data.message, - // }); - - // reset(); - // setTeamname(''); - // setGame(''); - // setRole(''); - // setRank(''); - // setServer(''); - // setLanguage(''); - // setPlayers(''); - // setRequests(''); } catch (error) { - console.error('Error during create-team:', error); + console.error('Error during create-team:', error); - toast({ - title: 'Sign Up Failed', - description: errorMessage, - variant: 'destructive', - }); + toast({ + title: 'Sign Up Failed', + description: errorMessage, + variant: 'destructive', + }); } - }; + }; return (
-
-
-

- Create Team -

-

Create your team and start competing

-
-
- -
- ( - - Image - - - - - - )} - /> - ( - - Name - - { - field.onChange(e); - setTeamname(e.target.value); - }} +
+
+

+ Create Team +

+

Create your team and start competing

+
+ + +
+ ( + + Image + + + + + + )} /> - - - - )} - /> - ( - - Game - - { - field.onChange(e); - setGame(e.target.value); - }} + ( + + Team Name + + { + field.onChange(e); + setTeamname(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> - ( - - Role - - { - field.onChange(e); - setRole(e.target.value); - }} + ( + + Game + + { + field.onChange(e); + setGame(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> - ( - - Rank - - { - field.onChange(e); - setRank(e.target.value); - }} - /> - - - - )} - /> - ( - - Server - - { - field.onChange(e); - setServer(e.target.value); - }} + ( + + Role + + { + field.onChange(e); + setRole(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> - ( - - Language - - { - field.onChange(e); - setLanguage(e.target.value); - }} + ( + + Rank + + { + field.onChange(e); + setRank(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> - ( - - Players - - { - field.onChange(e); - setPlayers(e.target.value); - }} + ( + + Server + + { + field.onChange(e); + setServer(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> - ( - - Requests - - { - field.onChange(e); - setRequests(e.target.value); - }} + ( + + Language + + { + field.onChange(e); + setLanguage(e.target.value); + }} + /> + + + + )} /> - - - - )} - /> -
-
- -
- - -
+ ( + + Players + + { + field.onChange(e); + setPlayers(e.target.value); + }} + /> + + + + )} + /> + ( + + Requests + + { + field.onChange(e); + setRequests(e.target.value); + }} + /> + + + + )} + /> +
+
+ +
+ + +
); - } \ No newline at end of file +} \ No newline at end of file diff --git a/app/teams/page.jsx b/app/teams/page.jsx new file mode 100644 index 0000000..84facd0 --- /dev/null +++ b/app/teams/page.jsx @@ -0,0 +1,65 @@ +'use client' + +import React from 'react'; +import FiltersSidebar from '../../components/FiltersSidebar'; +import TeamCard from '../../components/TeamCard'; +import { useRouter } from 'next/navigation'; +import { useState, useEffect } from 'react'; +import axios from 'axios'; + + +const TeamFinder = () => { + + const router = useRouter(); + const [teams, setTeams] = useState([]); + + useEffect(() => { + const fetchTeams = async () => { + try { + const response = await axios.get('/api/teams/get-teams'); + if (response.data.success) { + setTeams(response.data.teams); + } else { + console.error('Failed to fetch teams:', response.data.message); + } + } catch (error) { + console.error('Error fetching teams:', error); + } + }; + + fetchTeams(); + }, []); + + + const NavigateToCreateTeam = () => { + router.push('/create-team'); + }; + + + return ( +
+

TEAM FINDER

+
+ +
+
+
+

Find Team

+ +
+
+ + + +
+
+ {teams.map((team, index) => ( + + ))} +
+
+
+ ); +}; + +export default TeamFinder; diff --git a/components/FiltersSidebar.jsx b/components/FiltersSidebar.jsx new file mode 100644 index 0000000..c04110f --- /dev/null +++ b/components/FiltersSidebar.jsx @@ -0,0 +1,30 @@ +import React from 'react'; + +const FiltersSidebar = () => { + return ( +
+

Filters

+
+ + +
+
+ + +
+
+ + +
+ +
+ ); +}; + +export default FiltersSidebar; \ No newline at end of file diff --git a/components/Navbar.jsx b/components/Navbar.jsx index aeaf362..9891ee5 100644 --- a/components/Navbar.jsx +++ b/components/Navbar.jsx @@ -107,7 +107,10 @@ const navLinks = [ title: "Games", href: "/games", }, - + { + title: "Teams", + href: "/teams", + }, { title: "Blogs", href: "/blogs", diff --git a/components/TeamCard.jsx b/components/TeamCard.jsx new file mode 100644 index 0000000..e7f53e6 --- /dev/null +++ b/components/TeamCard.jsx @@ -0,0 +1,58 @@ +import React from 'react'; + +const TeamCard = ({ team }) => { + return ( +
+
+
+
+ {`${team.name} +

{team.teamname}

+
+ +
+
+
+
+ Game + {team.game} +
+
+ Role + {team.role} +
+
+ Rank + {team.rank} +
+
+ Server + {team.server} +
+
+ Language + {team.language} +
+
+
+
+ Players + {team.players.join(', ')} +
+
+ Looking for + {team.requests} +
+
+
+ +
+
+ ); +}; + +export default TeamCard; \ No newline at end of file diff --git a/model/Schema/teamSchema.js b/model/Schema/teamSchema.js index 01d08b6..b0466e2 100644 --- a/model/Schema/teamSchema.js +++ b/model/Schema/teamSchema.js @@ -1,13 +1,12 @@ import { z } from 'zod'; export const teamSchema = z.object({ - teamname: z.string(), - game: z.string(), - role: z.string(), - rank: z.string(), - server: z.string(), - language: z.string(), - players: z.string(), - requests: z.string(), - -}); + teamname: z.string().min(4, { message: 'Team name must be at least 4 characters long' }), + game: z.string().min(4, { message: 'Game name must be at least 4 characters long' }), + role: z.string().min(4, { message: 'Role must be at least 4 characters long' }), + rank: z.string().min(4, { message: 'Rank must be at least 4 characters long' }), + server: z.string().min(4, { message: 'Server must be at least 4 characters long' }), + language: z.string().min(4, { message: 'Language must be at least 4 characters long' }), + players: z.string().min(4, { message: 'Players field must be at least 4 characters long' }), + requests: z.string().min(4, { message: 'Requests field must be at least 4 characters long' }), +}); \ No newline at end of file diff --git a/model/Team.js b/model/Team.js index 2db829c..1d267fa 100644 --- a/model/Team.js +++ b/model/Team.js @@ -8,8 +8,8 @@ const TeamSchema = new mongoose.Schema({ rank: { type: String, required: true }, server: { type: String, required: true }, language: { type: String, required: true }, - players: [{ type: String }], - requests: [{ type: String }] + players: [{ type: String, required: true }], + requests: { type: String, required: true } }); diff --git a/prisma/seed.js b/prisma/seed.js index 7117c86..358c7ff 100644 --- a/prisma/seed.js +++ b/prisma/seed.js @@ -170,7 +170,7 @@ async function main() { // seed Team (mongoose) const teamData = [ { - image: 'https://example.com/image1.jpg', + image: 'https://placehold.co/60', teamname: 'Epic Warriors', game: 'League of Legends', role: 'ADC', @@ -178,10 +178,10 @@ async function main() { server: 'NA', language: 'English', players: ['Player1', 'Player2'], - requests: ['No toxic behavior', 'Must have a mic'] + requests: 'No toxic behavior' }, { - image: 'https://example.com/image2.jpg', + image: 'https://placehold.co/60', teamname: 'Pro Gamers', game: 'CS:GO', role: 'In-Game Leader', @@ -189,7 +189,7 @@ async function main() { server: 'EU', language: 'English', players: ['Player3', 'Player4'], - requests: ['Good communication skills', 'Must be punctual'] + requests: 'Good communication skills and has to be punctual' } ];