[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":12,"_34":12,"_35":12,"_36":37},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","67ab389676e08191b598dbbe360a8119","versionInt","title","Baby Shark Pomodoro Timer","type","code/react","content","import React, { useState, useEffect, useRef } from 'react';\nimport { motion } from 'framer-motion';\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\n// Replaced 'Playlist' with 'ListCheck' to fix import error\nimport { Music2, ListCheck, Volume2 } from 'lucide-react';\n\nexport default function BabySharkPomodoroTimer() {\n // Pomodoro Constants\n const FOCUS_MINUTES = 25;\n const BREAK_MINUTES = 5;\n\n // State for timer\n const [timeLeft, setTimeLeft] = useState(FOCUS_MINUTES * 60);\n const [isRunning, setIsRunning] = useState(false);\n const [onBreak, setOnBreak] = useState(false);\n\n // To-Do List States\n const [tasks, setTasks] = useState<{ id: number; text: string; completed: boolean }[]>([]);\n const [newTask, setNewTask] = useState(\"\");\n\n // White Noise Audio\n const whiteNoiseUrl = \"https://cdn.pixabay.com/download/audio/2022/08/20/audio_6d1522b3a4.mp3?filename=white-noise-ambient-113905.mp3\";\n const audioRef = useRef(null);\n const [whiteNoisePlaying, setWhiteNoisePlaying] = useState(false);\n\n // Timer logic\n useEffect(() => {\n let timer: NodeJS.Timeout | null = null;\n\n if (isRunning) {\n timer = setInterval(() => {\n setTimeLeft((prev) => {\n if (prev <= 1) {\n // Switch phase\n if (!onBreak) {\n // Focus finished, go to break\n setOnBreak(true);\n return BREAK_MINUTES * 60;\n } else {\n // Break finished, go to focus\n setOnBreak(false);\n return FOCUS_MINUTES * 60;\n }\n }\n return prev - 1;\n });\n }, 1000);\n }\n\n return () => {\n if (timer) clearInterval(timer);\n };\n }, [isRunning, onBreak]);\n\n // Convert timeLeft to minutes:seconds\n const minutes = Math.floor(timeLeft / 60);\n const seconds = timeLeft % 60;\n const timeDisplay = `${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;\n\n // Handlers for Pomodoro\n const handleStartPause = () => {\n setIsRunning(!isRunning);\n };\n\n const handleReset = () => {\n setIsRunning(false);\n setOnBreak(false);\n setTimeLeft(FOCUS_MINUTES * 60);\n };\n\n // Handlers for To-Do List\n const addTask = () => {\n if (!newTask.trim()) return;\n setTasks((prev) => [\n ...prev,\n {\n id: Date.now(),\n text: newTask.trim(),\n completed: false,\n },\n ]);\n setNewTask(\"\");\n };\n\n const toggleTaskCompletion = (id: number) => {\n setTasks((prev) =>\n prev.map((task) => {\n if (task.id === id) {\n return { ...task, completed: !task.completed };\n }\n return task;\n })\n );\n };\n\n const deleteTask = (id: number) => {\n setTasks((prev) => prev.filter((task) => task.id !== id));\n };\n\n // White noise toggle\n const handleWhiteNoiseToggle = () => {\n if (!audioRef.current) return;\n if (whiteNoisePlaying) {\n audioRef.current.pause();\n setWhiteNoisePlaying(false);\n } else {\n audioRef.current.currentTime = 0;\n audioRef.current.play();\n setWhiteNoisePlaying(true);\n }\n };\n\n return (\n

\n {/* Audio element for white noise */}\n

\n );\n}\n\n// Basic Test Cases\n// 1. Check initial timer state\n// 2. Add, toggle, and delete tasks\n// 3. Play and stop white noise\n\nexport function runTests() {\n console.log(\"Test 1: Checking initial timer state...\");\n // Ideally would use a testing library, but we’ll just log logic here\n // Expect timeLeft to be 25 * 60 on init.\n console.log(\"PASS if default time is 25 minutes\");\n\n console.log(\"Test 2: Adding tasks...\");\n // Expect new tasks to appear in the tasks list.\n console.log(\"PASS if tasks array grows and text is stored\");\n\n console.log(\"Test 3: White noise toggle...\");\n // Expect audio to play or pause.\n console.log(\"PASS if audio toggles correctly\");\n}\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_38":39,"_40":41},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","promoteCss","disableSSR","stripModulepreloadImports","statsigGateEvaluationsPromise",["P",37],"traceId","14321323796031778613","traceTime",1776976568248]

\n Baby Shark Pomodoro\n

Your To-Do List