mirror of
https://github.com/mudabbir-ahmad/peworkshop.git
synced 2026-10-07 19:50:20 +00:00
fixed a bit
This commit is contained in:
1 parent
a0fb2b9970
commit
25fe268ed6
3 files changed
+150
-142
No files matched your search
@@ -25,7 +25,7 @@ export default function TeamPage({ params }) {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
credentials: "include", // Important for auth
|
||||
credentials: "include",
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
@@ -74,78 +74,155 @@ export default function TeamPage({ params }) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="team-page-container">
|
||||
<div className="navbar">
|
||||
<div className="team-info">
|
||||
<div className="team-name">Team Name: {team.name}</div>
|
||||
<div className="team-code">Team Join Code: {team.code}</div>
|
||||
<div className="team-page">
|
||||
<div className="header">
|
||||
<Link href="/team-selection" className="back-button">
|
||||
←
|
||||
</Link>
|
||||
<div className="team-name">{team.name}</div>
|
||||
<div className="team-code">{team.code}</div>
|
||||
<div className="timer">00:00</div>
|
||||
</div>
|
||||
|
||||
<div className="content-container">
|
||||
<div className="add-users-button">Add Users</div>
|
||||
|
||||
<div className="users-container">
|
||||
{teamMembers.map((member, index) => (
|
||||
<div key={member.id} className="user-card">
|
||||
User #{index + 1}
|
||||
</div>
|
||||
))}
|
||||
|
||||
<div className="add-user-icon">
|
||||
<div className="plus-icon">+</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="team-members">
|
||||
{teamMembers.map((member) => (
|
||||
<div
|
||||
key={member.id}
|
||||
className={`member-card ${
|
||||
member.id === session?.user?.id ? "current-user" : ""
|
||||
}`}
|
||||
>
|
||||
{member.username}
|
||||
</div>
|
||||
))}
|
||||
<div className="navbar">
|
||||
<div className="nav-item">
|
||||
<div className="nav-icon">🏠</div>
|
||||
</div>
|
||||
<div className="nav-item">
|
||||
<div className="nav-icon">📊</div>
|
||||
</div>
|
||||
<div className="nav-item">
|
||||
<div className="nav-icon">🏆</div>
|
||||
</div>
|
||||
<div className="nav-item">
|
||||
<div className="nav-icon">👤</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style jsx>{`
|
||||
.team-page-container {
|
||||
.team-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.navbar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
.team-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.team-name {
|
||||
font-size: 24px;
|
||||
|
||||
.header {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
padding: 15px 10px;
|
||||
background-color: #c8b6a6;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.back-button {
|
||||
font-size: 24px;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.team-name,
|
||||
.team-code {
|
||||
font-size: 18px;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
color: black;
|
||||
}
|
||||
.team-members {
|
||||
|
||||
.timer {
|
||||
text-align: right;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
flex: 1;
|
||||
background-color: #8ecae6;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.member-card {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
margin: 5px 0;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
background-color: #f9f9f9;
|
||||
text-align: center;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.member-card.current-user {
|
||||
background-color: #d3d3d3;
|
||||
|
||||
.add-users-button {
|
||||
background-color: #e9c46a;
|
||||
color: black;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
margin: 10px 0;
|
||||
border-radius: 15px;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.users-container {
|
||||
flex: 1;
|
||||
background-color: #f6bd60;
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
background-color: #c8b6a6;
|
||||
color: black;
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.add-user-icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.plus-icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-color: #c8b6a6;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 20px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 15px 0;
|
||||
background-color: #c8b6a6;
|
||||
}
|
||||
|
||||
.nav-icon {
|
||||
font-size: 24px;
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
|
||||
@@ -1,105 +1,30 @@
|
||||
// app/api/teams/[teamId]/route.js
|
||||
// app/(main)/team/[teamId]/route.js
|
||||
import { queryOne, query } from "../../../../lib/db";
|
||||
import { getServerSession } from "next-auth/next";
|
||||
import { authOptions } from "../../../api/auth/[...nextauth]/route";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export async function GET(request, context) {
|
||||
const session = await getServerSession(authOptions);
|
||||
|
||||
if (!session) {
|
||||
return new Response(JSON.stringify({ error: "Unauthorised" }), {
|
||||
status: 401,
|
||||
});
|
||||
// Redirect to login page instead of returning JSON
|
||||
return redirect("/login");
|
||||
}
|
||||
|
||||
try {
|
||||
const { teamId } = await context.params; // Await the params
|
||||
const { teamId } = context.params;
|
||||
|
||||
// Convert teamId to number for proper comparison
|
||||
const requestedTeamId = parseInt(teamId, 10);
|
||||
const userTeamId = parseInt(session.user.teamId, 10);
|
||||
// Instead of returning JSON, we should let the page component handle rendering
|
||||
// This route.js file should only be used for API endpoints, not page rendering
|
||||
|
||||
// Log for debugging
|
||||
console.log("Requested team:", requestedTeamId);
|
||||
console.log("User team:", userTeamId);
|
||||
console.log("User role:", session.user.role);
|
||||
|
||||
// Ensure the user is requesting their own team or is an admin
|
||||
if (userTeamId !== requestedTeamId && session.user.role !== "admin") {
|
||||
return new Response(
|
||||
JSON.stringify({ error: "Not authorized to view this team" }),
|
||||
{ status: 403 }
|
||||
);
|
||||
}
|
||||
|
||||
const team = await queryOne(
|
||||
"SELECT id, name, code FROM teams WHERE id = ?",
|
||||
[requestedTeamId]
|
||||
);
|
||||
|
||||
if (!team) {
|
||||
return new Response(JSON.stringify({ error: "Team not found" }), {
|
||||
status: 404,
|
||||
});
|
||||
}
|
||||
|
||||
const members = await query(
|
||||
"SELECT id, username FROM users WHERE team_id = ?",
|
||||
[requestedTeamId]
|
||||
);
|
||||
|
||||
return new Response(JSON.stringify({ team, members }), { status: 200 });
|
||||
// Redirect to the page component
|
||||
return redirect(`/team/${teamId}`);
|
||||
} catch (error) {
|
||||
console.error("Team fetch error:", error);
|
||||
return new Response(
|
||||
JSON.stringify({ error: "Failed to fetch team details" }),
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export async function PATCH(request, context) {
|
||||
const session = await getServerSession(authOptions);
|
||||
|
||||
if (!session) {
|
||||
return new Response(JSON.stringify({ error: "Unauthorised" }), {
|
||||
status: 401,
|
||||
});
|
||||
}
|
||||
|
||||
try {
|
||||
const { teamId } = await context.params; // Await the params
|
||||
const requestedTeamId = parseInt(teamId, 10);
|
||||
const { userId } = await request.json(); // Parse the request body
|
||||
|
||||
// Log for debugging
|
||||
console.log("Requested team:", requestedTeamId);
|
||||
console.log("User role:", session.user.role);
|
||||
|
||||
// Ensure the user is an admin or the user themselves
|
||||
if (session.user.role !== "admin" && session.user.id !== userId) {
|
||||
return new Response(
|
||||
JSON.stringify({ error: "Not authorized to change this team" }),
|
||||
{ status: 403 }
|
||||
);
|
||||
}
|
||||
|
||||
// Update the user's team
|
||||
await queryOne("UPDATE users SET teamId = ? WHERE id = ?", [
|
||||
requestedTeamId,
|
||||
userId,
|
||||
]);
|
||||
|
||||
// Update the session with the new teamId
|
||||
session.user.teamId = requestedTeamId;
|
||||
|
||||
return new Response(
|
||||
JSON.stringify({ success: "Team updated successfully" }),
|
||||
{ status: 200 }
|
||||
);
|
||||
} catch (error) {
|
||||
console.error("Team update error:", error);
|
||||
return new Response(JSON.stringify({ error: "Failed to update team" }), {
|
||||
status: 500,
|
||||
});
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user