{categoryStyle && (
diff --git a/frontend/app/[locale]/page.tsx b/frontend/app/[locale]/page.tsx
index e14bdcac..6c9abbfa 100644
--- a/frontend/app/[locale]/page.tsx
+++ b/frontend/app/[locale]/page.tsx
@@ -1,6 +1,9 @@
import { getTranslations } from 'next-intl/server';
-import HeroSection from '@/components/home/HeroSection';
+import FeaturesHeroSection from '@/components/home/FeaturesHeroSection';
+import HomePageScroll from '@/components/home/HomePageScroll';
+import WelcomeHeroSection from '@/components/home/WelcomeHeroSection';
+import Footer from '@/components/shared/Footer';
export async function generateMetadata({
params,
@@ -59,8 +62,20 @@ export async function generateMetadata({
export default function Home() {
return (
- <>
-
+
);
}
diff --git a/frontend/app/[locale]/quiz/[slug]/page.tsx b/frontend/app/[locale]/quiz/[slug]/page.tsx
index 47145586..5e3305f1 100644
--- a/frontend/app/[locale]/quiz/[slug]/page.tsx
+++ b/frontend/app/[locale]/quiz/[slug]/page.tsx
@@ -5,10 +5,10 @@ import { getTranslations } from 'next-intl/server';
import { QuizContainer } from '@/components/quiz/QuizContainer';
import { categoryTabStyles } from '@/data/categoryStyles';
-import { cn } from '@/lib/utils';
import { stripCorrectAnswers } from '@/db/queries/quiz';
import { getQuizBySlug, getQuizQuestionsRandomized } from '@/db/queries/quiz';
import { getCurrentUser } from '@/lib/auth';
+import { cn } from '@/lib/utils';
type MetadataProps = { params: Promise<{ locale: string; slug: string }> };
@@ -52,9 +52,10 @@ export default async function QuizPage({
notFound();
}
- const categoryStyle = quiz.categorySlug
- ? categoryTabStyles[quiz.categorySlug as keyof typeof categoryTabStyles]
- : null;
+ const categoryStyle =
+ quiz.categorySlug && quiz.categorySlug in categoryTabStyles
+ ? categoryTabStyles[quiz.categorySlug as keyof typeof categoryTabStyles]
+ : null;
const parsedSeed = seedParam ? Number.parseInt(seedParam, 10) : Number.NaN;
const seed = Number.isFinite(parsedSeed)
diff --git a/frontend/app/[locale]/shop/products/[slug]/page.tsx b/frontend/app/[locale]/shop/products/[slug]/page.tsx
index 5b83cc12..fab252c9 100644
--- a/frontend/app/[locale]/shop/products/[slug]/page.tsx
+++ b/frontend/app/[locale]/shop/products/[slug]/page.tsx
@@ -2,7 +2,7 @@ import { ArrowLeft } from 'lucide-react';
import { Metadata } from 'next';
import Image from 'next/image';
import { notFound } from 'next/navigation';
-import { getTranslations } from 'next-intl/server';
+import { getMessages, getTranslations } from 'next-intl/server';
import { AddToCartButton } from '@/components/shop/AddToCartButton';
import { getPublicProductBySlug } from '@/db/queries/shop/products';
@@ -54,6 +54,9 @@ export default async function ProductPage({
'text-lg',
'items-center gap-2'
);
+ const messages = await getMessages();
+ const productDescriptions =
+ (messages as any).shop?.productDescriptions ?? {};
const badge = product?.badge as string | undefined;
const badgeLabel =
badge && badge !== 'NONE'
@@ -131,9 +134,18 @@ export default async function ProductPage({
)}
- {product.description && (
-
diff --git a/frontend/app/api/questions/[category]/route.ts b/frontend/app/api/questions/[category]/route.ts
index 76470c04..2e82a697 100644
--- a/frontend/app/api/questions/[category]/route.ts
+++ b/frontend/app/api/questions/[category]/route.ts
@@ -37,7 +37,7 @@ export async function GET(
const page = Math.max(1, Number(searchParams.get('page') ?? DEFAULT_PAGE));
const limit = Math.min(
- 50,
+ 100,
Math.max(1, Number(searchParams.get('limit') ?? DEFAULT_LIMIT))
);
const offset = (page - 1) * limit;
diff --git a/frontend/app/api/shop/internal/monobank/janitor/route.ts b/frontend/app/api/shop/internal/monobank/janitor/route.ts
new file mode 100644
index 00000000..38eaf80a
--- /dev/null
+++ b/frontend/app/api/shop/internal/monobank/janitor/route.ts
@@ -0,0 +1,466 @@
+import crypto from 'node:crypto';
+
+import { sql } from 'drizzle-orm';
+import { NextRequest, NextResponse } from 'next/server';
+import { z } from 'zod';
+
+import { db } from '@/db';
+import { logError, logInfo, logWarn } from '@/lib/logging';
+import { guardNonBrowserOnly } from '@/lib/security/origin';
+import {
+ runMonobankJanitorJob1,
+ runMonobankJanitorJob2,
+ runMonobankJanitorJob3,
+ runMonobankJanitorJob4,
+} from '@/lib/services/orders/monobank-janitor';
+
+const ROUTE_PATH = '/api/shop/internal/monobank/janitor' as const;
+const JOB_PREFIX = 'monobank-janitor:' as const;
+const JOB_NAMES = ['job1', 'job2', 'job3', 'job4'] as const;
+const JOB_NAME_SET = new Set(JOB_NAMES);
+
+type JobName = (typeof JOB_NAMES)[number];
+
+const JOB_NAME_RE = /^[a-z0-9-]{1,32}$/;
+
+const janitorPayloadSchema = z
+ .object({
+ job: z
+ .string()
+ .regex(JOB_NAME_RE)
+ .refine(value => JOB_NAME_SET.has(value), { message: 'Invalid job' }),
+ dryRun: z.boolean().optional(),
+ limit: z.number().int().optional(),
+ })
+ .strict();
+
+type GateRow = { next_allowed_at: unknown };
+
+function noStoreJson(
+ body: unknown,
+ requestId: string,
+ init?: { status?: number; headers?: HeadersInit }
+) {
+ const res = NextResponse.json(body, {
+ status: init?.status ?? 200,
+ headers: init?.headers,
+ });
+ res.headers.set('Cache-Control', 'no-store');
+ res.headers.set('X-Request-Id', requestId);
+ return res;
+}
+
+function timingSafeEqual(a: string, b: string): boolean {
+ const aBuf = Buffer.from(a, 'utf8');
+ const bBuf = Buffer.from(b, 'utf8');
+ const maxLen = Math.max(aBuf.length, bBuf.length, 1);
+
+ const aPadded = Buffer.alloc(maxLen);
+ const bPadded = Buffer.alloc(maxLen);
+ aBuf.copy(aPadded);
+ bBuf.copy(bPadded);
+
+ const equalPadded = crypto.timingSafeEqual(aPadded, bPadded);
+ return equalPadded && aBuf.length === bBuf.length;
+}
+
+function readConfiguredInternalSecret(): string | null {
+ const preferred = (process.env.INTERNAL_JANITOR_SECRET ?? '').trim();
+ if (preferred) return preferred;
+
+ const fallback = (process.env.INTERNAL_SECRET ?? '').trim();
+ if (fallback) return fallback;
+
+ return null;
+}
+
+function requireInternalJanitorAuth(args: {
+ request: NextRequest;
+ requestId: string;
+ baseMeta: Record;
+}): NextResponse | null {
+ const configured = readConfiguredInternalSecret();
+ if (!configured) {
+ logError('internal_monobank_janitor_auth_misconfigured', undefined, {
+ ...args.baseMeta,
+ code: 'INTERNAL_SECRET_MISCONFIG',
+ });
+ return noStoreJson(
+ {
+ success: false,
+ code: 'SERVER_MISCONFIG',
+ message: 'Internal auth is not configured',
+ requestId: args.requestId,
+ },
+ args.requestId,
+ { status: 500 }
+ );
+ }
+
+ const provided =
+ (args.request.headers.get('x-internal-janitor-secret') ?? '').trim() ||
+ (args.request.headers.get('x-internal-secret') ?? '').trim();
+
+ if (!provided || !timingSafeEqual(provided, configured)) {
+ return noStoreJson(
+ {
+ success: false,
+ code: 'UNAUTHORIZED',
+ message: 'Unauthorized',
+ requestId: args.requestId,
+ },
+ args.requestId,
+ { status: 401 }
+ );
+ }
+
+ return null;
+}
+
+function invalidPayload(
+ requestId: string,
+ message: string
+): NextResponse {
+ return noStoreJson(
+ {
+ success: false,
+ code: 'INVALID_PAYLOAD',
+ message,
+ requestId,
+ },
+ requestId,
+ { status: 400 }
+ );
+}
+
+function normalizeDate(x: unknown): Date | null {
+ if (!x) return null;
+ if (x instanceof Date) return Number.isNaN(x.getTime()) ? null : x;
+ const d = new Date(String(x));
+ return Number.isNaN(d.getTime()) ? null : d;
+}
+
+function getMinIntervalSeconds(): number {
+ if (process.env.NODE_ENV === 'test') return 0;
+
+ const fallback = process.env.NODE_ENV === 'production' ? 300 : 60;
+ const parsed = Number(process.env.INTERNAL_JANITOR_MIN_INTERVAL_SECONDS);
+ const base = Number.isFinite(parsed) ? Math.floor(parsed) : fallback;
+ return Math.max(0, Math.min(3600, base));
+}
+
+async function acquireJobSlot(params: {
+ jobName: string;
+ minIntervalSeconds: number;
+ runId: string;
+}) {
+ const res = await db.execute(sql`
+ INSERT INTO internal_job_state (job_name, next_allowed_at, last_run_id, updated_at)
+ VALUES (
+ ${params.jobName},
+ now() + make_interval(secs => ${params.minIntervalSeconds}),
+ ${params.runId}::uuid,
+ now()
+ )
+ ON CONFLICT (job_name) DO UPDATE
+ SET next_allowed_at = now() + make_interval(secs => ${params.minIntervalSeconds}),
+ last_run_id = ${params.runId}::uuid,
+ updated_at = now()
+ WHERE internal_job_state.next_allowed_at <= now()
+ RETURNING next_allowed_at
+ `);
+
+ const rows = (res as any).rows ?? [];
+ if (rows.length > 0) return { ok: true as const };
+
+ const res2 = await db.execute(sql`
+ SELECT next_allowed_at
+ FROM internal_job_state
+ WHERE job_name = ${params.jobName}
+ LIMIT 1
+ `);
+
+ const rows2 = (res2 as any).rows ?? [];
+ const nextAllowedAt = normalizeDate(rows2[0]?.next_allowed_at);
+ return { ok: false as const, nextAllowedAt };
+}
+
+function parsePayloadErrorMessage(error: z.ZodError): string {
+ for (const issue of error.issues) {
+ if (issue.path[0] === 'job') return 'Invalid job';
+ }
+ return 'Invalid payload';
+}
+
+export async function POST(request: NextRequest) {
+ const requestId =
+ request.headers.get('x-request-id')?.trim() || crypto.randomUUID();
+ const baseMeta = {
+ requestId,
+ route: ROUTE_PATH,
+ method: 'POST',
+ jobName: 'monobank-janitor',
+ };
+
+ const blocked = guardNonBrowserOnly(request);
+ if (blocked) {
+ blocked.headers.set('X-Request-Id', requestId);
+ logWarn('internal_monobank_janitor_origin_blocked', {
+ ...baseMeta,
+ code: 'ORIGIN_BLOCKED',
+ });
+ return blocked;
+ }
+
+ const authResponse = requireInternalJanitorAuth({
+ request,
+ requestId,
+ baseMeta,
+ });
+ if (authResponse) {
+ if (authResponse.status === 401) {
+ logWarn('internal_monobank_janitor_auth_rejected', {
+ ...baseMeta,
+ code: 'UNAUTHORIZED',
+ });
+ }
+ return authResponse;
+ }
+
+ const contentType = (request.headers.get('content-type') ?? '').toLowerCase();
+ if (!contentType.includes('application/json')) {
+ return invalidPayload(requestId, 'Content-Type must be application/json');
+ }
+
+ let rawBody: unknown;
+ try {
+ rawBody = await request.json();
+ } catch {
+ return invalidPayload(requestId, 'Invalid JSON body');
+ }
+
+ const parsed = janitorPayloadSchema.safeParse(rawBody);
+ if (!parsed.success) {
+ return invalidPayload(requestId, parsePayloadErrorMessage(parsed.error));
+ }
+
+ const job = parsed.data.job as JobName;
+ const dryRun = parsed.data.dryRun ?? false;
+ const limit = Math.max(1, Math.min(500, parsed.data.limit ?? 100));
+
+ logInfo('internal_monobank_janitor_request_accepted', {
+ ...baseMeta,
+ code: 'JANITOR_REQUEST_ACCEPTED',
+ job,
+ dryRun,
+ limit,
+ });
+
+ const runId = crypto.randomUUID();
+ const gateKey = `${JOB_PREFIX}${job}`;
+ const minIntervalSeconds = getMinIntervalSeconds();
+
+ try {
+ const gate = await acquireJobSlot({
+ jobName: gateKey,
+ minIntervalSeconds,
+ runId,
+ });
+
+ if (!gate.ok) {
+ const retryAfterSeconds = gate.nextAllowedAt
+ ? Math.max(
+ 1,
+ Math.ceil((gate.nextAllowedAt.getTime() - Date.now()) / 1000)
+ )
+ : Math.max(1, minIntervalSeconds || 1);
+
+ logWarn('internal_monobank_janitor_rate_limited', {
+ ...baseMeta,
+ code: 'JANITOR_RATE_LIMITED',
+ job,
+ dryRun,
+ limit,
+ gateKey,
+ runId,
+ retryAfterSeconds,
+ });
+
+ return noStoreJson(
+ {
+ success: false,
+ code: 'RATE_LIMITED',
+ retryAfterSeconds,
+ requestId,
+ },
+ requestId,
+ {
+ status: 429,
+ headers: { 'Retry-After': String(retryAfterSeconds) },
+ }
+ );
+ }
+
+ if (job === 'job1') {
+ const result = await runMonobankJanitorJob1({
+ dryRun,
+ limit,
+ requestId,
+ runId,
+ baseMeta,
+ });
+
+ return noStoreJson(
+ {
+ success: true,
+ job,
+ dryRun,
+ limit,
+ processed: result.processed,
+ applied: result.applied,
+ noop: result.noop,
+ failed: result.failed,
+ requestId,
+ },
+ requestId,
+ { status: 200 }
+ );
+ }
+
+ if (job === 'job2') {
+ const result = await runMonobankJanitorJob2({
+ dryRun,
+ limit,
+ requestId,
+ runId,
+ baseMeta,
+ });
+
+ return noStoreJson(
+ {
+ success: true,
+ job,
+ dryRun,
+ limit,
+ processed: result.processed,
+ applied: result.applied,
+ noop: result.noop,
+ failed: result.failed,
+ requestId,
+ },
+ requestId,
+ { status: 200 }
+ );
+ }
+
+ if (job === 'job3') {
+ const result = await runMonobankJanitorJob3({
+ dryRun,
+ limit,
+ requestId,
+ runId,
+ baseMeta,
+ });
+
+ return noStoreJson(
+ {
+ success: true,
+ job,
+ dryRun,
+ limit,
+ processed: result.processed,
+ applied: result.applied,
+ noop: result.noop,
+ failed: result.failed,
+ requestId,
+ },
+ requestId,
+ { status: 200 }
+ );
+ }
+
+ if (job === 'job4') {
+ const result = await runMonobankJanitorJob4({
+ dryRun,
+ limit,
+ requestId,
+ runId,
+ baseMeta,
+ });
+
+ return noStoreJson(
+ {
+ success: true,
+ job,
+ dryRun,
+ limit,
+ processed: result.processed,
+ applied: result.applied,
+ noop: result.noop,
+ failed: result.failed,
+ report: result.report,
+ requestId,
+ },
+ requestId,
+ { status: 200 }
+ );
+ }
+
+ logInfo('internal_monobank_janitor_not_implemented', {
+ ...baseMeta,
+ code: 'JANITOR_NOT_IMPLEMENTED',
+ job,
+ dryRun,
+ limit,
+ gateKey,
+ runId,
+ });
+
+ return noStoreJson(
+ {
+ success: false,
+ code: 'JANITOR_NOT_IMPLEMENTED',
+ job,
+ dryRun,
+ limit,
+ requestId,
+ },
+ requestId,
+ { status: 501 }
+ );
+ } catch (error) {
+ const err = error as { code?: unknown; status?: unknown } | null;
+ if (err?.code === 'MONO_WEBHOOK_MODE_NOT_STORE') {
+ return noStoreJson(
+ {
+ success: false,
+ code: 'MONO_WEBHOOK_MODE_NOT_STORE',
+ requestId,
+ },
+ requestId,
+ { status: 409 }
+ );
+ }
+
+ logError('internal_monobank_janitor_failed', error, {
+ ...baseMeta,
+ code: 'INTERNAL_ERROR',
+ job,
+ dryRun,
+ limit,
+ gateKey,
+ runId,
+ });
+
+ return noStoreJson(
+ {
+ success: false,
+ code: 'INTERNAL_ERROR',
+ message: 'Internal error',
+ requestId,
+ },
+ requestId,
+ { status: 500 }
+ );
+ }
+}
diff --git a/frontend/app/globals.css b/frontend/app/globals.css
index 7ab59b5f..7d97ed10 100644
--- a/frontend/app/globals.css
+++ b/frontend/app/globals.css
@@ -277,6 +277,19 @@
.animate-dash-flow {
animation: dash-flow 2s linear infinite;
}
+
+ /* 3D Flip Card */
+ .perspective-1000 {
+ perspective: 1000px;
+ }
+
+ .preserve-3d {
+ transform-style: preserve-3d;
+ }
+
+ .backface-hidden {
+ backface-visibility: hidden;
+ }
}
@keyframes float {
diff --git a/frontend/app/layout.tsx b/frontend/app/layout.tsx
index 529bb7c0..3028e0b4 100644
--- a/frontend/app/layout.tsx
+++ b/frontend/app/layout.tsx
@@ -1,10 +1,9 @@
import './globals.css';
-import type { Metadata } from 'next';
-import { Geist, Geist_Mono } from 'next/font/google';
import { Analytics } from '@vercel/analytics/next';
import { SpeedInsights } from '@vercel/speed-insights/next';
-import './globals.css';
+import type { Metadata } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
const siteUrl = process.env.NEXT_PUBLIC_SITE_URL ?? 'https://devlovers.net';
@@ -51,13 +50,13 @@ export const metadata: Metadata = {
};
const geistSans = Geist({
+ subsets: ['latin', 'cyrillic'],
variable: '--font-geist-sans',
- subsets: ['latin'],
});
const geistMono = Geist_Mono({
+ subsets: ['latin', 'cyrillic'],
variable: '--font-geist-mono',
- subsets: ['latin'],
});
export default function RootLayout({
diff --git a/frontend/components/about/HeroSection.tsx b/frontend/components/about/HeroSection.tsx
index df3487df..29f3f263 100644
--- a/frontend/components/about/HeroSection.tsx
+++ b/frontend/components/about/HeroSection.tsx
@@ -16,7 +16,7 @@ export function HeroSection({ stats }: { stats?: PlatformStats }) {
questionsSolved: '850+',
githubStars: '120+',
activeUsers: '200+',
- linkedinFollowers: '1.3k+',
+ linkedinFollowers: '1.5k+',
};
return (
diff --git a/frontend/components/dashboard/ExplainedTermsCard.tsx b/frontend/components/dashboard/ExplainedTermsCard.tsx
index 6cb480b3..a9e10ef8 100644
--- a/frontend/components/dashboard/ExplainedTermsCard.tsx
+++ b/frontend/components/dashboard/ExplainedTermsCard.tsx
@@ -2,7 +2,7 @@
import { BookOpen, ChevronDown, GripVertical, RotateCcw, X } from 'lucide-react';
import { useTranslations } from 'next-intl';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
import AIWordHelper from '@/components/q&a/AIWordHelper';
import { getCachedTerms } from '@/lib/ai/explainCache';
@@ -21,6 +21,13 @@ export function ExplainedTermsCard() {
const [selectedTerm, setSelectedTerm] = useState(null);
const [isModalOpen, setIsModalOpen] = useState(false);
const [draggedIndex, setDraggedIndex] = useState(null);
+ const [touchDragState, setTouchDragState] = useState<{
+ sourceIndex: number;
+ targetIndex: number;
+ x: number;
+ y: number;
+ label: string;
+ } | null>(null);
/* eslint-disable react-hooks/set-state-in-effect */
useEffect(() => {
@@ -83,6 +90,131 @@ export function ExplainedTermsCard() {
setDraggedIndex(null);
};
+ // Touch drag support for mobile
+ const touchDragIndex = useRef(null);
+ const termRefs = useRef>(new Map());
+ const dragTargetIndex = useRef(null);
+ const cleanupRef = useRef<(() => void) | null>(null);
+
+ const setTermRef = useCallback(
+ (index: number) => (el: HTMLDivElement | null) => {
+ if (el) {
+ termRefs.current.set(index, el);
+ } else {
+ termRefs.current.delete(index);
+ }
+ },
+ []
+ );
+
+ const setTouchDragStateRef = useRef(setTouchDragState);
+ useEffect(() => {
+ setTouchDragStateRef.current = setTouchDragState;
+ }, [setTouchDragState]);
+
+ const termsRef = useRef(terms);
+ useEffect(() => {
+ termsRef.current = terms;
+ }, [terms]);
+
+ const handleTouchStart = useCallback(
+ (index: number, e: React.TouchEvent) => {
+ const touch = e.touches[0];
+ if (!touch) return;
+ touchDragIndex.current = index;
+ dragTargetIndex.current = index;
+ setDraggedIndex(index);
+ setTouchDragStateRef.current({
+ sourceIndex: index,
+ targetIndex: index,
+ x: touch.clientX,
+ y: touch.clientY,
+ label: termsRef.current[index] ?? '',
+ });
+ },
+ []
+ );
+
+ const containerCallbackRef = useCallback((node: HTMLDivElement | null) => {
+ if (cleanupRef.current) {
+ cleanupRef.current();
+ cleanupRef.current = null;
+ }
+
+ if (!node) return;
+
+ const onTouchMove = (e: TouchEvent) => {
+ if (touchDragIndex.current === null) return;
+ e.preventDefault();
+
+ const touch = e.touches[0];
+ if (!touch) return;
+
+ let newTarget = dragTargetIndex.current;
+
+ for (const [index, el] of termRefs.current.entries()) {
+ const rect = el.getBoundingClientRect();
+ if (
+ touch.clientX >= rect.left &&
+ touch.clientX <= rect.right &&
+ touch.clientY >= rect.top &&
+ touch.clientY <= rect.bottom &&
+ index !== touchDragIndex.current
+ ) {
+ newTarget = index;
+ break;
+ }
+ }
+
+ dragTargetIndex.current = newTarget;
+ setDraggedIndex(newTarget);
+ setTouchDragStateRef.current(prev =>
+ prev
+ ? {
+ ...prev,
+ targetIndex: newTarget ?? prev.targetIndex,
+ x: touch.clientX,
+ y: touch.clientY,
+ }
+ : null
+ );
+ };
+
+ const onTouchEnd = () => {
+ const fromIndex = touchDragIndex.current;
+ const toIndex = dragTargetIndex.current;
+
+ if (
+ fromIndex !== null &&
+ toIndex !== null &&
+ fromIndex !== toIndex
+ ) {
+ setTerms(prevTerms => {
+ const newTerms = [...prevTerms];
+ const [dragged] = newTerms.splice(fromIndex, 1);
+ newTerms.splice(toIndex, 0, dragged);
+ saveTermOrder(newTerms);
+ return newTerms;
+ });
+ }
+
+ touchDragIndex.current = null;
+ dragTargetIndex.current = null;
+ setDraggedIndex(null);
+ setTouchDragStateRef.current(null);
+ };
+
+ node.addEventListener('touchmove', onTouchMove, { passive: false });
+ node.addEventListener('touchend', onTouchEnd);
+ node.addEventListener('touchcancel', onTouchEnd);
+
+ cleanupRef.current = () => {
+ node.removeEventListener('touchmove', onTouchMove);
+ node.removeEventListener('touchend', onTouchEnd);
+ node.removeEventListener('touchcancel', onTouchEnd);
+ };
+ }, []);
+
const handleTermClick = (term: string) => {
setSelectedTerm(term);
setIsModalOpen(true);
@@ -132,19 +264,39 @@ export function ExplainedTermsCard() {
+
+
+
+
+ {product.description}
- )} + {(() => { + const desc = + (productDescriptions[slug] as string) || product.description; + if (!desc) return null; + return ( +
+ {desc.split('\n').map((line: string, i: number) => (
+
+ );
+ })()}
{!isUnavailable && (
{line}
+ ))} +{t('termCount', { count: terms.length })}
-
- {terms.map((term, index) => (
+
+ {terms.map((term, index) => {
+ const isSource =
+ touchDragState !== null &&
+ index === touchDragState.sourceIndex;
+ const isDropTarget =
+ touchDragState !== null &&
+ index === touchDragState.targetIndex &&
+ index !== touchDragState.sourceIndex;
+
+ return (
) : (
@@ -220,7 +373,7 @@ export function ExplainedTermsCard() {
handleRestoreTerm(term);
}}
aria-label={t('ariaRestore', { term })}
- className="absolute -right-1 -top-1 rounded-full bg-white p-1 text-gray-400 opacity-0 shadow-sm transition-opacity hover:bg-green-50 hover:text-green-600 group-hover:opacity-100 dark:bg-neutral-800 dark:hover:bg-green-900/20 dark:hover:text-green-400"
+ className="absolute -right-1 -top-1 rounded-full bg-white p-1 text-gray-400 opacity-100 shadow-sm transition-opacity hover:bg-green-50 hover:text-green-600 sm:opacity-0 sm:group-hover:opacity-100 dark:bg-neutral-800 dark:hover:bg-green-900/20 dark:hover:text-green-400"
>
handleDrop(index)}
className={`group relative inline-flex items-center gap-1 rounded-lg border px-2 py-2 pr-8 transition-all ${
- draggedIndex === index ? 'opacity-50' : ''
+ isSource
+ ? 'scale-95 opacity-40'
+ : isDropTarget
+ ? 'border-(--accent-primary) bg-(--accent-primary)/10 scale-105'
+ : draggedIndex === index
+ ? 'opacity-50'
+ : ''
} border-gray-100 bg-gray-50/50 hover:border-(--accent-primary)/30 hover:bg-white dark:border-white/5 dark:bg-neutral-800/50 dark:hover:border-(--accent-primary)/30 dark:hover:bg-neutral-800`}
>
- ))}
+ );
+ })}
+
+ )}
);
}
diff --git a/frontend/components/dashboard/ProfileCard.tsx b/frontend/components/dashboard/ProfileCard.tsx
index a3f77fe1..601db04e 100644
--- a/frontend/components/dashboard/ProfileCard.tsx
+++ b/frontend/components/dashboard/ProfileCard.tsx
@@ -2,10 +2,14 @@
import { useTranslations } from 'next-intl';
+import { UserAvatar } from '@/components/leaderboard/UserAvatar';
+
interface ProfileCardProps {
user: {
+ id: string;
name: string | null;
email: string;
+ image: string | null;
role: string | null;
points: number;
createdAt: Date | null;
@@ -15,6 +19,11 @@ interface ProfileCardProps {
export function ProfileCard({ user, locale }: ProfileCardProps) {
const t = useTranslations('dashboard.profile');
+ const username = user.name || user.email.split('@')[0];
+ const seed = `${username}-${user.id}`;
+ const avatarSrc =
+ user.image ||
+ `https://api.dicebear.com/9.x/avataaars/svg?seed=${encodeURIComponent(seed)}`;
const cardStyles = `
relative overflow-hidden rounded-2xl
@@ -27,11 +36,15 @@ export function ProfileCard({ user, locale }: ProfileCardProps) {