From ffe3ed39638f5ae0838e489ade68409e8818e6ac Mon Sep 17 00:00:00 2001 From: tusharshah21 Date: Thu, 25 Sep 2025 10:55:44 +0530 Subject: [PATCH 1/3] feature added audition page --- webapp/app/audition/page.tsx | 248 +++++++++++++++++++++++++++++ webapp/components/ui/badge.tsx | 36 +++++ webapp/components/ui/separator.tsx | 31 ++++ 3 files changed, 315 insertions(+) create mode 100644 webapp/app/audition/page.tsx create mode 100644 webapp/components/ui/badge.tsx create mode 100644 webapp/components/ui/separator.tsx diff --git a/webapp/app/audition/page.tsx b/webapp/app/audition/page.tsx new file mode 100644 index 0000000..3a6d96a --- /dev/null +++ b/webapp/app/audition/page.tsx @@ -0,0 +1,248 @@ +"use client"; + +import { useState, useEffect } from "react"; +import Link from "next/link"; +import { motion } from "framer-motion"; +import { Button } from "@/components/ui/button"; +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; +import { Badge } from "@/components/ui/badge"; +import { Separator } from "@/components/ui/separator"; +import { Trophy, Users, Music, Calendar, Play } from "lucide-react"; + +// Mock data for ongoing auditions +const ongoingAuditions = [ + { + id: "1", + title: "Electronic Beat Battle", + description: "Create the ultimate electronic track for our summer collection", + preface: "This audition is open to all electronic music producers. Submissions must be original and not exceed 3 minutes.", + image: "/images/audition1.jpg", + deadline: "2025-10-15", + participants: 1247, + prize: "5000 STRK", + genre: "Electronic" + }, + { + id: "2", + title: "Jazz Fusion Jam", + description: "Fuse traditional jazz with modern elements", + preface: "Open to jazz musicians and fusion artists. Include at least one live instrument recording.", + image: "/images/audition2.jpg", + deadline: "2025-10-20", + participants: 892, + prize: "3000 STRK", + genre: "Jazz" + }, + // Add more as needed +]; + +// Mock data for past auditions +const pastAuditions = [ + { + id: "past1", + title: "Hip Hop Cypher 2025", + description: "Quarterfinals recap - The best hip hop tracks of the year", + preface: "This audition featured over 2000 submissions from around the world.", + image: "/images/past1.jpg", + endDate: "2025-09-01", + winner: "MC Flow", + participants: 2156, + prize: "10000 STRK", + genre: "Hip Hop", + stats: { + totalSubmissions: 2156, + countries: 45, + avgRating: 4.2 + } + }, + { + id: "past2", + title: "Rock Anthem Contest", + description: "Semifinals - Epic rock tracks that defined the season", + preface: "A high-energy audition that brought together rock legends and newcomers.", + image: "/images/past2.jpg", + endDate: "2025-08-15", + winner: "ThunderStrike", + participants: 1843, + prize: "7500 STRK", + genre: "Rock", + stats: { + totalSubmissions: 1843, + countries: 32, + avgRating: 4.5 + } + }, + // Add more as needed +]; + +export default function AuditionPage() { + const [ongoing, setOngoing] = useState(ongoingAuditions); + const [past, setPast] = useState(pastAuditions); + + // In a real app, fetch from API + // useEffect(() => { + // fetch('/api/auditions/current').then(res => res.json()).then(setOngoing); + // fetch('/api/auditions/past').then(res => res.json()).then(setPast); + // }, []); + + return ( +
+ {/* Background effects */} +
+
+ +
+ {/* Header */} + +

+ Music Auditions +

+

+ Discover, compete, and showcase your musical talent on Starknet +

+
+ + {/* Ongoing Auditions Section */} +
+

Ongoing Auditions

+
+ {ongoing.map((audition, index) => ( + + + +
+
+ +
+ + {audition.genre} + +
+ {audition.title} + + {audition.description} + +
+ +

+ "{audition.preface}" +

+
+
+ Deadline: + {audition.deadline} +
+
+ Participants: + {audition.participants} +
+
+ Prize: + {audition.prize} +
+
+ +
+
+
+ ))} +
+
+ + + + {/* Past Auditions Section */} +
+

Past Auditions

+
+ {past.map((audition, index) => ( + +
+
+
+ +
+
+
+
+
+

{audition.title}

+

{audition.description}

+

+ "{audition.preface}" +

+
+ + {audition.genre} + +
+ +
+
+ +
{audition.participants}
+
Participants
+
+
+ +
{audition.winner}
+
Winner
+
+
+ +
{audition.prize}
+
Prize
+
+
+ +
{audition.endDate}
+
Ended
+
+
+ +
+
+ Total Submissions: {audition.stats.totalSubmissions} +
+
+ Countries: {audition.stats.countries} +
+
+ Avg Rating: {audition.stats.avgRating}/5 +
+
+ + +
+
+
+ ))} +
+
+
+
+ ); +} \ No newline at end of file diff --git a/webapp/components/ui/badge.tsx b/webapp/components/ui/badge.tsx new file mode 100644 index 0000000..f000e3e --- /dev/null +++ b/webapp/components/ui/badge.tsx @@ -0,0 +1,36 @@ +import * as React from "react" +import { cva, type VariantProps } from "class-variance-authority" + +import { cn } from "@/lib/utils" + +const badgeVariants = cva( + "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", + { + variants: { + variant: { + default: + "border-transparent bg-primary text-primary-foreground hover:bg-primary/80", + secondary: + "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80", + destructive: + "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80", + outline: "text-foreground", + }, + }, + defaultVariants: { + variant: "default", + }, + } +) + +export interface BadgeProps + extends React.HTMLAttributes, + VariantProps {} + +function Badge({ className, variant, ...props }: BadgeProps) { + return ( +
+ ) +} + +export { Badge, badgeVariants } diff --git a/webapp/components/ui/separator.tsx b/webapp/components/ui/separator.tsx new file mode 100644 index 0000000..12d81c4 --- /dev/null +++ b/webapp/components/ui/separator.tsx @@ -0,0 +1,31 @@ +"use client" + +import * as React from "react" +import * as SeparatorPrimitive from "@radix-ui/react-separator" + +import { cn } from "@/lib/utils" + +const Separator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>( + ( + { className, orientation = "horizontal", decorative = true, ...props }, + ref + ) => ( + + ) +) +Separator.displayName = SeparatorPrimitive.Root.displayName + +export { Separator } From e4948f288590514b15c1af063c514e36ba091e75 Mon Sep 17 00:00:00 2001 From: tusharshah21 Date: Thu, 25 Sep 2025 11:12:03 +0530 Subject: [PATCH 2/3] fixed the linting issue --- .../app/audition/[auditionId]/analytics/page.tsx | 14 +++++++++----- webapp/app/audition/page.tsx | 9 ++++----- 2 files changed, 13 insertions(+), 10 deletions(-) diff --git a/webapp/app/audition/[auditionId]/analytics/page.tsx b/webapp/app/audition/[auditionId]/analytics/page.tsx index 99b6b91..67fff90 100644 --- a/webapp/app/audition/[auditionId]/analytics/page.tsx +++ b/webapp/app/audition/[auditionId]/analytics/page.tsx @@ -7,6 +7,7 @@ import PerformanceCriteriaChart from "@/components/analytics/PerformanceCriteria import PerformerLeaderboard from "@/components/analytics/PerformerLeaderboard"; import VoterStatistics from "@/components/analytics/VoterStatistics"; import CriteriaBreakdown from "@/components/analytics/CriteriaBreakdown"; +import { Vote } from "@/utils/types/votes"; import { fetchVoteAnalytics, fetchCommentaryWeights } from "@/utils/fetchAnalytics"; export default function AnalyticsPage() { @@ -17,9 +18,13 @@ export default function AnalyticsPage() { null ); - const [analytics, setAnalytics] = useState(null); -const [comments, setComments] = useState([]); -const [loading, setLoading] = useState(true); +interface AnalyticsData { + performers?: Vote[]; + // Add other properties as needed +} + + const [analytics, setAnalytics] = useState(null); + const [loading, setLoading] = useState(true); useEffect(() => { if (!auditionId) return; @@ -30,9 +35,8 @@ useEffect(() => { fetchVoteAnalytics(auditionId), fetchCommentaryWeights(auditionId), ]) - .then(([analyticsData, commentsData]) => { + .then(([analyticsData]) => { setAnalytics(analyticsData); - setComments(commentsData); }) .finally(() => setLoading(false)); }, [auditionId]); diff --git a/webapp/app/audition/page.tsx b/webapp/app/audition/page.tsx index 3a6d96a..7eeb89b 100644 --- a/webapp/app/audition/page.tsx +++ b/webapp/app/audition/page.tsx @@ -1,6 +1,5 @@ "use client"; -import { useState, useEffect } from "react"; import Link from "next/link"; import { motion } from "framer-motion"; import { Button } from "@/components/ui/button"; @@ -76,8 +75,8 @@ const pastAuditions = [ ]; export default function AuditionPage() { - const [ongoing, setOngoing] = useState(ongoingAuditions); - const [past, setPast] = useState(pastAuditions); + const ongoing = ongoingAuditions; + const past = pastAuditions; // In a real app, fetch from API // useEffect(() => { @@ -134,7 +133,7 @@ export default function AuditionPage() {

- "{audition.preface}" + "{audition.preface}"

@@ -188,7 +187,7 @@ export default function AuditionPage() {

{audition.title}

{audition.description}

- "{audition.preface}" + "{audition.preface}"

From fde95f3af4160ba52a2cf3acdbe551929aacf37c Mon Sep 17 00:00:00 2001 From: tusharshah21 Date: Thu, 25 Sep 2025 11:16:38 +0530 Subject: [PATCH 3/3] fixed the build issue too --- webapp/package.json | 1 + webapp/pnpm-lock.yaml | 63 +++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+) diff --git a/webapp/package.json b/webapp/package.json index 9968fb5..c439969 100644 --- a/webapp/package.json +++ b/webapp/package.json @@ -11,6 +11,7 @@ "dependencies": { "@radix-ui/react-label": "^2.1.4", "@radix-ui/react-select": "^2.2.2", + "@radix-ui/react-separator": "^1.1.7", "@radix-ui/react-slot": "^1.1.1", "@radix-ui/react-toast": "^1.2.4", "class-variance-authority": "^0.7.1", diff --git a/webapp/pnpm-lock.yaml b/webapp/pnpm-lock.yaml index ea8b92e..6d7b334 100644 --- a/webapp/pnpm-lock.yaml +++ b/webapp/pnpm-lock.yaml @@ -14,6 +14,9 @@ importers: '@radix-ui/react-select': specifier: ^2.2.2 version: 2.2.2(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-separator': + specifier: ^1.1.7 + version: 1.1.7(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@radix-ui/react-slot': specifier: ^1.1.1 version: 1.1.1(@types/react@18.3.18)(react@18.3.1) @@ -612,6 +615,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-primitive@2.1.3': + resolution: {integrity: sha512-m9gTwRkhy2lvCPe6QJp4d3G1TYEUHn/FzJUtq9MjH46an1wJU+GdoGC5VLof8RX8Ft/DlpshApkhswDLZzHIcQ==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-select@2.2.2': resolution: {integrity: sha512-HjkVHtBkuq+r3zUAZ/CvNWUGKPfuicGDbgtZgiQuFmNcV5F+Tgy24ep2nsAW2nFgvhGPJVqeBZa6KyVN0EyrBA==} peerDependencies: @@ -625,6 +641,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-separator@1.1.7': + resolution: {integrity: sha512-0HEb8R9E8A+jZjvmFCy/J4xhbXy3TV+9XSnGJ3KvTtjlIUy/YQ/p6UYZvi7YbeoeXdyU9+Y3scizK6hkY37baA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-slot@1.1.1': resolution: {integrity: sha512-RApLLOcINYJA+dMVbOju7MYv1Mb2EBp2nH4HdDzXTSyaR5optlm6Otrz1euW3HbdOR8UmmFK06TD+A9frYWv+g==} peerDependencies: @@ -643,6 +672,15 @@ packages: '@types/react': optional: true + '@radix-ui/react-slot@1.2.3': + resolution: {integrity: sha512-aeNmHnBxbi2St0au6VBVC7JXFlhLlOnvIIlePNniyUNAClzmtAUEY8/pBiK3iHjufOlwA+c20/8jngo7xcrg8A==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-toast@1.2.4': resolution: {integrity: sha512-Sch9idFJHJTMH9YNpxxESqABcAFweJG4tKv+0zo0m5XBvUSL8FM5xKcJLFLXononpePs8IclyX1KieL5SDUNgA==} peerDependencies: @@ -2904,6 +2942,15 @@ snapshots: '@types/react': 18.3.18 '@types/react-dom': 18.3.5(@types/react@18.3.18) + '@radix-ui/react-primitive@2.1.3(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/react-slot': 1.2.3(@types/react@18.3.18)(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.18 + '@types/react-dom': 18.3.5(@types/react@18.3.18) + '@radix-ui/react-select@2.2.2(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/number': 1.1.1 @@ -2933,6 +2980,15 @@ snapshots: '@types/react': 18.3.18 '@types/react-dom': 18.3.5(@types/react@18.3.18) + '@radix-ui/react-separator@1.1.7(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/react-primitive': 2.1.3(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.18 + '@types/react-dom': 18.3.5(@types/react@18.3.18) + '@radix-ui/react-slot@1.1.1(@types/react@18.3.18)(react@18.3.1)': dependencies: '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.18)(react@18.3.1) @@ -2947,6 +3003,13 @@ snapshots: optionalDependencies: '@types/react': 18.3.18 + '@radix-ui/react-slot@1.2.3(@types/react@18.3.18)(react@18.3.1)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.3.18)(react@18.3.1) + react: 18.3.1 + optionalDependencies: + '@types/react': 18.3.18 + '@radix-ui/react-toast@1.2.4(@types/react-dom@18.3.5(@types/react@18.3.18))(@types/react@18.3.18)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/primitive': 1.1.1