Rain/SBU-Hackathon
1
0
Fork 0
mirror of https://github.com/PinkSheep27/SBU-Hackathon.git synced 2026-10-11 00:50:27 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/PinkSheep27/SBU-Hackathon

Browse Source
This commit is contained in:
Ivan Rudik
2025-11-09 10:02:56 +00:00
parent 64be41f894 45f06bfe8e
commit 0f583d4618
12 changed files with 204 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/cards/page.tsx
+24 -35
View File
@@ -5,17 +5,15 @@ import { motion, useMotionValue, useTransform, useAnimation } from "framer-motio
import { useRouter, useSearchParams } from "next/navigation";
import { CardData } from "@/app/exportType/types";
// 1. Updated ColorWay interface
interface ColorWay {
card: string;
text: string;
titleColor: string;
}
// 2. Updated COLOR_WAYS array
const COLOR_WAYS: ColorWay[] = [
{ card: "#FEEEDF", text: "#173C46", titleColor: "#173C46" },
{ card: "#FEEEDF", text: "#EA627F", titleColor: "#173C46" }, // Example: Title is dark, text is pink
{ card: "#FEEEDF", text: "#EA627F", titleColor: "#173C46" },
{ card: "#DEE5D4", text: "#173C46", titleColor: "#EA627F" },
{ card: "#DEE5D4", text: "#EA627F", titleColor: "#173C46" },
{ card: "#B8C0AD", text: "#173C46", titleColor: "#173C46" },
@@ -29,8 +27,6 @@ const parseAiResponse = (markdownString: string): CardData[] => {
ideaBlocks.forEach((block, index) => {
const titleMatch = block.match(/^(.*?)\n/);
const conceptMatch = block.match(/\*\*Concept:\*\*\s*(.*)/s);
// Simple track parsing: find all bolded text that isn't a main header
const tracksMatch = block.matchAll(/\*\*(?!Concept|Relevance|Core|Team|Bonus)(.*?):\*\*/g);
const tracks = [...tracksMatch].map(match => match[1].trim());
@@ -38,7 +34,7 @@ const parseAiResponse = (markdownString: string): CardData[] => {
id: index + 1,
title: titleMatch ? titleMatch[1].trim() : `Idea ${index + 1}`,
summary: conceptMatch ? conceptMatch[1].trim() : "No concept provided.",
tracks: tracks.length > 0 ? tracks : ["General"], // Fallback
tracks: tracks.length > 0 ? tracks : ["General"],
});
});
return ideas;
@@ -53,20 +49,17 @@ export default function CardsPage() {
const projectId = searchParams.get('projectId');
const projectTitle = searchParams.get('projectTitle');
useEffect(() => {
if (typeof window === 'undefined') return;
// **** MODIFIED THIS SECTION ****
// Get the AI response from the form page
const aiResponse = localStorage.getItem('temp_aiResponse');
if (aiResponse) {
localStorage.removeItem('temp_aiResponse'); // Clean up
localStorage.removeItem('temp_aiResponse');
const parsedCards = parseAiResponse(aiResponse);
setCards(parsedCards.reverse());
setInitialCards(parsedCards.reverse()); // Save for reset
setInitialCards(parsedCards.reverse());
} else {
// Handle case where user lands here directly
// Maybe redirect or show an error
console.warn("No AI response found. Using hardcoded cards as fallback.");
const hardcodedCards: CardData[] = [
{ id: 1, title: "AI Project Idea 1", summary: "A cool project...", tracks: ["AI", "Web"] },
@@ -76,7 +69,8 @@ export default function CardsPage() {
setInitialCards(hardcodedCards.reverse());
}
setIsLoading(false);
}, []); // Runs once on load
}, []);
if (isLoading) {
return <div className="grid h-screen w-full place-items-center bg-orange-100"><p>Loading cards...</p></div>
}
@@ -123,7 +117,6 @@ const SwipeCards: React.FC<SwipeCardsProps> = ({
const handleAccept = (cardData: CardData) => {
removeCard();
// Redirect to chatbot with card data
router.push(`/chatbot?projectId=${encodeURIComponent(projectId)}&projectTitle=${encodeURIComponent(projectTitle)}&cardTitle=${encodeURIComponent(cardData.title)}&cardSummary=${encodeURIComponent(cardData.summary)}`);
};
@@ -131,9 +124,7 @@ const SwipeCards: React.FC<SwipeCardsProps> = ({
removeCard();
};
// **** FIXED THIS FUNCTION ****
const handleReset = () => {
// This now resets the deck to the initial set of cards
setCards(initialCards);
};
@@ -141,8 +132,8 @@ const SwipeCards: React.FC<SwipeCardsProps> = ({
<div
className="grid h-screen w-full place-items-center bg-orange-100"
style={{
backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'
viewBox='0 0 32 32' width='32' height='32' fill='none'
backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'
viewBox='0 0 32 32' width='32' height='32' fill='none'
stroke-width='2' stroke='%23d4d4d4'%3e%3cpath d='M0 .5H31.5V32'/%3e%3c/svg%3e")`,
}}
>
@@ -190,7 +181,7 @@ interface CardProps {
const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onReject }) => {
const { title, summary, tracks } = cardData;
const controls = useAnimation();
const x = useMotionValue(0);
const rotate = useTransform(x, [-250, 250], [-25, 25]);
const opacity = useTransform(
@@ -198,7 +189,6 @@ const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onRe
[-250, -100, 0, 100, 250],
[0, 1, 1, 1, 0],
);
const controls = useAnimation();
const acceptOpacity = useTransform(x, [50, 150], [0, 1]);
const rejectOpacity = useTransform(x, [-150, -50], [1, 0]);
@@ -218,7 +208,7 @@ const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onRe
return (
<motion.div
className="absolute flex h-[56rem] w-[42rem] flex-col justify-between overflow-hidden rounded-2xl p-6 shadow-2xl hover:cursor-grab active:cursor-grabbing"
className="absolute flex h-[48rem] w-[36rem] flex-col justify-between overflow-hidden rounded-2xl p-6 shadow-2xl hover:cursor-grab active:cursor-grabbing"
style={{
x,
rotate,
@@ -228,13 +218,15 @@ const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onRe
zIndex: isFront ? 2 : 1,
pointerEvents: isFront ? "auto" : "none",
}}
animate={controls}
animate={{
scale: isFront ? 1 : 0.95,
y: isFront ? 0 : -40,
}}
transition={{ type: "spring", stiffness: 300, damping: 30 }}
drag={isFront ? "x" : false}
dragConstraints={{ left: 0, right: 0, top: 0, bottom: 0 }}
onDragEnd={handleDragEnd}
>
{/* Accept/Reject Badges */}
<motion.div
className="absolute left-10 top-10 z-10 rounded-2xl border-8 border-green-500 px-10 py-4"
style={{ opacity: acceptOpacity, rotate: badgeRotate }}
@@ -245,29 +237,28 @@ const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onRe
className="absolute right-10 top-10 z-10 rounded-2xl border-8 border-red-500 px-10 py-4"
style={{ opacity: rejectOpacity, rotate: badgeRotate }}
>
<h3 className="text-5xl font-bold uppercase text-red-500">Reject</h3>
<h3 className="text-s5xl font-bold uppercase text-red-500">Reject</h3>
</motion.div>
{/* Card Content */}
<div className="relative z-0">
{/* 3. Applied the specific titleColor here */}
<h2
className="mb-4 text-center text-3xl font-bold"
className="mb-4 text-center text-7xl font-bold"
style={{ color: colorWay.titleColor }}
>
{title}
</h2>
{/* This summary <p> will inherit colorWay.text from the parent */}
<p className="text-center text-xl font-light">{summary}</p>
<p className="text-center text-3xl font-light">{summary}</p>
</div>
<div className="relative z-0 flex flex-wrap items-center justify-center gap-2">
{tracks.slice(0, 2).map((track, index) => (
<h3 className="mb-4 w-full text-center text-4xl font-semibold">
Tracks
</h3>
{tracks.map((track) => (
<span
key={track}
className="flex items-center justify-center rounded-full px-8 py-3 text-sm font-medium"
className="flex items-center justify-center rounded-full px-8 py-3 text-2xl font-medium"
style={{
// This logic now correctly contrasts with the main text color
backgroundColor:
colorWay.text === "#ffffff"
? "rgba(255, 255, 255, 0.2)"
@@ -275,11 +266,9 @@ const Card: React.FC<CardProps> = ({ cardData, colorWay, isFront, onAccept, onRe
}}
>
{track}
{index === 0 && tracks.length > 1 && ", "}
</span>
))}
</div>
</motion.div>
);
};
};