Round 18: Seating Chart, Student Avatars, Newsletter, Badges, Deep Styling Polish
This commit is contained in:
1 parent
cba8a8e724
commit
0363a40ca0
18 files changed
+1838
-50
No files matched your search
@@ -0,0 +1,123 @@
|
||||
import { NextRequest, NextResponse } from 'next/server';
|
||||
import { db } from '@/lib/db';
|
||||
|
||||
// GET /api/newsletters/[id] — get single newsletter
|
||||
export async function GET(
|
||||
_req: NextRequest,
|
||||
{ params }: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const newsletter = await db.newsletter.findUnique({
|
||||
where: { id },
|
||||
include: {
|
||||
author: { select: { id: true, firstName: true, lastName: true } },
|
||||
},
|
||||
});
|
||||
|
||||
if (!newsletter || newsletter.deletedAt) {
|
||||
return NextResponse.json({ error: 'Newsletter not found' }, { status: 404 });
|
||||
}
|
||||
|
||||
return NextResponse.json(newsletter);
|
||||
} catch (error) {
|
||||
console.error('Error fetching newsletter:', error);
|
||||
return NextResponse.json({ error: 'Failed to fetch newsletter' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
// PUT /api/newsletters/[id] — update newsletter
|
||||
export async function PUT(
|
||||
req: NextRequest,
|
||||
{ params }: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const body = await req.json();
|
||||
|
||||
const existing = await db.newsletter.findUnique({ where: { id } });
|
||||
if (!existing || existing.deletedAt) {
|
||||
return NextResponse.json({ error: 'Newsletter not found' }, { status: 404 });
|
||||
}
|
||||
|
||||
const data: Record<string, unknown> = {};
|
||||
if (body.title !== undefined) data.title = body.title;
|
||||
if (body.content !== undefined) data.content = body.content;
|
||||
if (body.summary !== undefined) data.summary = body.summary;
|
||||
if (body.imageUrl !== undefined) data.imageUrl = body.imageUrl;
|
||||
if (body.category !== undefined) data.category = body.category;
|
||||
if (body.tags !== undefined) data.tags = JSON.stringify(body.tags);
|
||||
|
||||
const newsletter = await db.newsletter.update({
|
||||
where: { id },
|
||||
data,
|
||||
include: {
|
||||
author: { select: { id: true, firstName: true, lastName: true } },
|
||||
},
|
||||
});
|
||||
|
||||
return NextResponse.json(newsletter);
|
||||
} catch (error) {
|
||||
console.error('Error updating newsletter:', error);
|
||||
return NextResponse.json({ error: 'Failed to update newsletter' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
// POST /api/newsletters/[id] — publish/unpublish newsletter
|
||||
export async function POST(
|
||||
req: NextRequest,
|
||||
{ params }: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
const body = await req.json();
|
||||
|
||||
const existing = await db.newsletter.findUnique({ where: { id } });
|
||||
if (!existing || existing.deletedAt) {
|
||||
return NextResponse.json({ error: 'Newsletter not found' }, { status: 404 });
|
||||
}
|
||||
|
||||
const isPublished = body.action === 'publish' ? true : body.action === 'unpublish' ? false : !existing.isPublished;
|
||||
|
||||
const newsletter = await db.newsletter.update({
|
||||
where: { id },
|
||||
data: {
|
||||
isPublished,
|
||||
publishedAt: isPublished ? new Date() : null,
|
||||
},
|
||||
include: {
|
||||
author: { select: { id: true, firstName: true, lastName: true } },
|
||||
},
|
||||
});
|
||||
|
||||
return NextResponse.json(newsletter);
|
||||
} catch (error) {
|
||||
console.error('Error toggling newsletter publish:', error);
|
||||
return NextResponse.json({ error: 'Failed to toggle newsletter' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
// DELETE /api/newsletters/[id] — soft delete newsletter
|
||||
export async function DELETE(
|
||||
_req: NextRequest,
|
||||
{ params }: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await params;
|
||||
|
||||
const existing = await db.newsletter.findUnique({ where: { id } });
|
||||
if (!existing || existing.deletedAt) {
|
||||
return NextResponse.json({ error: 'Newsletter not found' }, { status: 404 });
|
||||
}
|
||||
|
||||
await db.newsletter.update({
|
||||
where: { id },
|
||||
data: { deletedAt: new Date() },
|
||||
});
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error('Error deleting newsletter:', error);
|
||||
return NextResponse.json({ error: 'Failed to delete newsletter' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,85 @@
|
||||
import { NextRequest, NextResponse } from 'next/server';
|
||||
import { db } from '@/lib/db';
|
||||
|
||||
// GET /api/newsletters — list newsletters
|
||||
export async function GET(req: NextRequest) {
|
||||
try {
|
||||
const { searchParams } = new URL(req.url);
|
||||
const schoolId = searchParams.get('schoolId');
|
||||
const published = searchParams.get('published');
|
||||
const category = searchParams.get('category');
|
||||
const limit = parseInt(searchParams.get('limit') || '20');
|
||||
const offset = parseInt(searchParams.get('offset') || '0');
|
||||
|
||||
if (!schoolId) {
|
||||
return NextResponse.json({ error: 'schoolId required' }, { status: 400 });
|
||||
}
|
||||
|
||||
const where: Record<string, unknown> = {
|
||||
schoolId,
|
||||
deletedAt: null,
|
||||
};
|
||||
|
||||
if (published === 'true') {
|
||||
where.isPublished = true;
|
||||
} else if (published === 'false') {
|
||||
where.isPublished = false;
|
||||
}
|
||||
|
||||
if (category) {
|
||||
where.category = category;
|
||||
}
|
||||
|
||||
const [newsletters, total] = await Promise.all([
|
||||
db.newsletter.findMany({
|
||||
where,
|
||||
orderBy: [{ publishedAt: 'desc' }, { createdAt: 'desc' }],
|
||||
skip: offset,
|
||||
take: limit,
|
||||
include: {
|
||||
author: { select: { id: true, firstName: true, lastName: true } },
|
||||
},
|
||||
}),
|
||||
db.newsletter.count({ where }),
|
||||
]);
|
||||
|
||||
return NextResponse.json({ newsletters, total });
|
||||
} catch (error) {
|
||||
console.error('Error fetching newsletters:', error);
|
||||
return NextResponse.json({ error: 'Failed to fetch newsletters' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
// POST /api/newsletters — create newsletter
|
||||
export async function POST(req: NextRequest) {
|
||||
try {
|
||||
const body = await req.json();
|
||||
const { schoolId, authorId, title, content, summary, imageUrl, category, tags, isDemo } = body;
|
||||
|
||||
if (!schoolId || !authorId || !title || !content) {
|
||||
return NextResponse.json({ error: 'schoolId, authorId, title, content required' }, { status: 400 });
|
||||
}
|
||||
|
||||
const newsletter = await db.newsletter.create({
|
||||
data: {
|
||||
schoolId,
|
||||
authorId,
|
||||
title,
|
||||
content,
|
||||
summary: summary || null,
|
||||
imageUrl: imageUrl || null,
|
||||
category: category || 'general',
|
||||
tags: tags ? JSON.stringify(tags) : null,
|
||||
isDemo: isDemo || false,
|
||||
},
|
||||
include: {
|
||||
author: { select: { id: true, firstName: true, lastName: true } },
|
||||
},
|
||||
});
|
||||
|
||||
return NextResponse.json(newsletter, { status: 201 });
|
||||
} catch (error) {
|
||||
console.error('Error creating newsletter:', error);
|
||||
return NextResponse.json({ error: 'Failed to create newsletter' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
@@ -23,6 +23,8 @@ export async function GET(
|
||||
lastName: true,
|
||||
dateOfBirth: true,
|
||||
externalId: true,
|
||||
avatarUrl: true,
|
||||
avatarInitials: true,
|
||||
createdAt: true,
|
||||
schoolId: true,
|
||||
school: { select: { id: true, name: true } },
|
||||
|
||||
@@ -143,6 +143,7 @@ export async function PUT(request: Request) {
|
||||
.optional()
|
||||
.transform((v) => (v ? new Date(v) : v === null ? null : undefined)),
|
||||
externalId: z.string().nullable().optional(),
|
||||
avatarUrl: z.string().nullable().optional(),
|
||||
});
|
||||
|
||||
const parsed = updateSchema.safeParse(body);
|
||||
|
||||
@@ -2509,4 +2509,281 @@
|
||||
.section-header-icon:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* ─── Gradient Card Background ─────────────────────────────────── */
|
||||
.gradient-card-bg {
|
||||
background: linear-gradient(135deg, oklch(0.97 0.02 155) 0%, oklch(0.98 0.01 175) 100%);
|
||||
border: 1px solid oklch(0.90 0.02 155);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.gradient-card-bg:hover {
|
||||
box-shadow: 0 4px 12px oklch(0.55 0.17 155 / 0.1);
|
||||
}
|
||||
.dark .gradient-card-bg {
|
||||
background: linear-gradient(135deg, oklch(0.18 0.02 260) 0%, oklch(0.16 0.01 155) 100%);
|
||||
border-color: oklch(0.30 0.02 260);
|
||||
}
|
||||
|
||||
/* ─── Sparkline Mini Chart ─────────────────────────────────────── */
|
||||
.sparkline-mini {
|
||||
display: inline-flex;
|
||||
align-items: flex-end;
|
||||
gap: 1px;
|
||||
height: 16px;
|
||||
}
|
||||
.sparkline-mini span {
|
||||
display: block;
|
||||
width: 2px;
|
||||
border-radius: 1px;
|
||||
background: oklch(0.55 0.17 155);
|
||||
transition: height 0.3s ease;
|
||||
}
|
||||
.dark .sparkline-mini span {
|
||||
background: oklch(0.65 0.17 155);
|
||||
}
|
||||
|
||||
/* ─── Grade Color Badges (German 1-6 System) ──────────────────── */
|
||||
.grade-badge-1 {
|
||||
background: linear-gradient(135deg, #10b981, #059669);
|
||||
color: white;
|
||||
border: 1px solid #059669;
|
||||
}
|
||||
.grade-badge-2 {
|
||||
background: linear-gradient(135deg, #14b8a6, #0d9488);
|
||||
color: white;
|
||||
border: 1px solid #0d9488;
|
||||
}
|
||||
.grade-badge-3 {
|
||||
background: linear-gradient(135deg, #f59e0b, #d97706);
|
||||
color: white;
|
||||
border: 1px solid #d97706;
|
||||
}
|
||||
.grade-badge-4 {
|
||||
background: linear-gradient(135deg, #f97316, #ea580c);
|
||||
color: white;
|
||||
border: 1px solid #ea580c;
|
||||
}
|
||||
.grade-badge-5 {
|
||||
background: linear-gradient(135deg, #f43f5e, #e11d48);
|
||||
color: white;
|
||||
border: 1px solid #e11d48;
|
||||
}
|
||||
.grade-badge-6 {
|
||||
background: linear-gradient(135deg, #dc2626, #b91c1c);
|
||||
color: white;
|
||||
border: 1px solid #b91c1c;
|
||||
}
|
||||
|
||||
/* ─── Mastery Level Badges ─────────────────────────────────────── */
|
||||
.mastery-badge-low {
|
||||
background: linear-gradient(135deg, #fda4af, #fb7185);
|
||||
color: #9f1239;
|
||||
border: 1px solid #fda4af;
|
||||
}
|
||||
.dark .mastery-badge-low {
|
||||
color: #fda4af;
|
||||
background: linear-gradient(135deg, rgba(253,164,175,0.15), rgba(251,113,133,0.15));
|
||||
border-color: rgba(251,113,133,0.3);
|
||||
}
|
||||
.mastery-badge-medium {
|
||||
background: linear-gradient(135deg, #fde68a, #fbbf24);
|
||||
color: #92400e;
|
||||
border: 1px solid #fde68a;
|
||||
}
|
||||
.dark .mastery-badge-medium {
|
||||
color: #fde68a;
|
||||
background: linear-gradient(135deg, rgba(253,230,138,0.15), rgba(251,191,36,0.15));
|
||||
border-color: rgba(251,191,36,0.3);
|
||||
}
|
||||
.mastery-badge-high {
|
||||
background: linear-gradient(135deg, #6ee7b7, #34d399);
|
||||
color: #065f46;
|
||||
border: 1px solid #6ee7b7;
|
||||
}
|
||||
.dark .mastery-badge-high {
|
||||
color: #6ee7b7;
|
||||
background: linear-gradient(135deg, rgba(110,231,183,0.15), rgba(52,211,153,0.15));
|
||||
border-color: rgba(52,211,153,0.3);
|
||||
}
|
||||
|
||||
/* ─── Newsletter Category Badge ────────────────────────────────── */
|
||||
.category-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.25rem;
|
||||
padding: 0.125rem 0.5rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.6875rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
.category-badge-general {
|
||||
background: oklch(0.95 0.01 260);
|
||||
color: oklch(0.35 0.02 260);
|
||||
}
|
||||
.dark .category-badge-general {
|
||||
background: oklch(0.22 0.02 260);
|
||||
color: oklch(0.75 0.02 260);
|
||||
}
|
||||
.category-badge-academic {
|
||||
background: #dbeafe;
|
||||
color: #1e40af;
|
||||
}
|
||||
.dark .category-badge-academic {
|
||||
background: rgba(59,130,246,0.15);
|
||||
color: #93c5fd;
|
||||
}
|
||||
.category-badge-sports {
|
||||
background: #dcfce7;
|
||||
color: #166534;
|
||||
}
|
||||
.dark .category-badge-sports {
|
||||
background: rgba(34,197,94,0.15);
|
||||
color: #86efac;
|
||||
}
|
||||
.category-badge-arts {
|
||||
background: #fae8ff;
|
||||
color: #86198f;
|
||||
}
|
||||
.dark .category-badge-arts {
|
||||
background: rgba(168,85,247,0.15);
|
||||
color: #d8b4fe;
|
||||
}
|
||||
.category-badge-events {
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
}
|
||||
.dark .category-badge-events {
|
||||
background: rgba(245,158,11,0.15);
|
||||
color: #fcd34d;
|
||||
}
|
||||
.category-badge-community {
|
||||
background: #ffe4e6;
|
||||
color: #9f1239;
|
||||
}
|
||||
.dark .category-badge-community {
|
||||
background: rgba(244,63,94,0.15);
|
||||
color: #fda4af;
|
||||
}
|
||||
|
||||
/* ─── Newsletter Preview Card ──────────────────────────────────── */
|
||||
.newsletter-card {
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s ease;
|
||||
border: 1px solid oklch(0.90 0.01 155);
|
||||
background: white;
|
||||
}
|
||||
.newsletter-card:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 8px 24px oklch(0.55 0.17 155 / 0.1);
|
||||
}
|
||||
.dark .newsletter-card {
|
||||
background: oklch(0.18 0.015 260);
|
||||
border-color: oklch(0.30 0.015 260);
|
||||
}
|
||||
|
||||
/* ─── Student Avatar Circle ────────────────────────────────────── */
|
||||
.avatar-circle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 9999px;
|
||||
font-weight: 600;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1;
|
||||
transition: all 0.2s ease;
|
||||
user-select: none;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.avatar-circle:hover {
|
||||
transform: scale(1.08);
|
||||
}
|
||||
|
||||
/* ─── Student Photo Circle ─────────────────────────────────────── */
|
||||
.avatar-photo {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 9999px;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s ease;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.avatar-photo img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.avatar-photo:hover {
|
||||
transform: scale(1.08);
|
||||
box-shadow: 0 0 0 2px oklch(0.55 0.17 155);
|
||||
}
|
||||
|
||||
/* ─── Animated Section Underline ───────────────────────────────── */
|
||||
.animated-underline {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.animated-underline::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg, #10b981, #14b8a6);
|
||||
border-radius: 1px;
|
||||
transition: width 0.4s ease;
|
||||
}
|
||||
.animated-underline:hover::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* ─── Count-up Animation ───────────────────────────────────────── */
|
||||
@keyframes count-up-fade {
|
||||
0% { opacity: 0; transform: translateY(8px); }
|
||||
100% { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.animate-count-up {
|
||||
animation: count-up-fade 0.6s ease-out forwards;
|
||||
}
|
||||
|
||||
/* ─── Leaf Animation ───────────────────────────────────────────── */
|
||||
@keyframes leaf-sway {
|
||||
0%, 100% { transform: rotate(0deg); }
|
||||
25% { transform: rotate(5deg); }
|
||||
75% { transform: rotate(-5deg); }
|
||||
}
|
||||
.animate-leaf-sway {
|
||||
animation: leaf-sway 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* ─── Staggered Card Entrance ──────────────────────────────────── */
|
||||
@keyframes card-entrance {
|
||||
0% { opacity: 0; transform: translateY(12px) scale(0.97); }
|
||||
100% { opacity: 1; transform: translateY(0) scale(1); }
|
||||
}
|
||||
.animate-card-entrance {
|
||||
animation: card-entrance 0.4s ease-out forwards;
|
||||
}
|
||||
|
||||
/* ─── Gradient Border for Class Cards ──────────────────────────── */
|
||||
.gradient-border-card {
|
||||
position: relative;
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.gradient-border-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 3px;
|
||||
background: linear-gradient(90deg, #10b981, #14b8a6);
|
||||
border-radius: 0.75rem 0.75rem 0 0;
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user