function MainComponent() { const [darkMode, setDarkMode] = useState(false); const [tasks, setTasks] = useState([]); const [priorityTasks, setPriorityTasks] = useState([]); const [newTask, setNewTask] = useState(""); const [events, setEvents] = useState([]); const [currentTime, setCurrentTime] = useState(new Date()); const [draggedEvent, setDraggedEvent] = useState(null); const [showSettings, setShowSettings] = useState(false); const [showProfileEdit, setShowProfileEdit] = useState(false); const [themeColor, setThemeColor] = useState("#E85D5D"); const [maxPriority, setMaxPriority] = useState("Unlimited"); const [hideCompleted, setHideCompleted] = useState(false); const [soundEffects, setSoundEffects] = useState(true); const [theme, setTheme] = useState(()=>{ if (typeof window !== "undefined") { const savedTheme = localStorage.getItem("theme"); if (savedTheme) return savedTheme; return window.matchMedia("(prefers-color-scheme: dark)").matches ? "system" : "light"; } return "light"; }); const [profileImage, setProfileImage] = useState(null); const [name, setName] = useState("Colette"); const [email, setEmail] = useState(""); const [upload, { loading }] = useUpload(); useEffect(()=>{ const timer = setInterval(()=>{ setCurrentTime(new Date()); }, 1000); return ()=>clearInterval(timer); }, []); useEffect(()=>{ const root = document.documentElement; if (theme === "system") { const isDark = window.matchMedia("(prefers-color-scheme: dark)").matches; root.classList.toggle("dark", isDark); const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)"); const handler = (e)=>{ root.classList.toggle("dark", e.matches); document.body.style.backgroundColor = e.matches ? "#1a1a1a" : "#ffffff"; }; mediaQuery.addEventListener("change", handler); return ()=>mediaQuery.removeEventListener("change", handler); } else { root.classList.toggle("dark", theme === "dark"); document.body.style.backgroundColor = theme === "dark" ? "#1a1a1a" : themeColor; } localStorage.setItem("theme", theme); }, [ theme, themeColor ]); const formatTime = (hour, minute)=>{ const period = hour >= 12 ? "PM" : "AM"; const displayHour = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour; return `${displayHour}:${minute.toString().padStart(2, "0")}${period}`; }; const handleAddTask = (e)=>{ e.preventDefault(); if (newTask.trim()) { const durationRegex = /for (\d+)\s?(minutes?|hours?|hrs?|mins?)/i; const match = newTask.match(durationRegex); let duration = 30; let taskText = newTask; if (match) { const value = parseInt(match[1], 10); const unit = match[2].toLowerCase(); if (unit.startsWith("hour")) { duration = value * 60; } else { duration = value; } taskText = newTask.replace(durationRegex, "").trim(); } setTasks([ ...tasks, { id: Date.now(), text: taskText, completed: false, duration } ]); setNewTask(""); } }; const handleEventDragStart = (e, event)=>{ setDraggedEvent(event); e.dataTransfer.setData("eventId", event.id); }; const handleCalendarDrop = (e, hour, minute)=>{ e.preventDefault(); const eventId = e.dataTransfer.getData("eventId"); if (eventId) { setEvents(events.map((event)=>{ if (event.id.toString() === eventId) { const endHour = hour + Math.floor(event.duration / 60); const endMinute = minute + event.duration % 60; return { ...event, startTime: `${hour}:${minute}`, endTime: `${endHour}:${endMinute}` }; } return event; })); } else { const task = JSON.parse(e.dataTransfer.getData("task")); const endHour = hour + Math.floor(task.duration / 60); const endMinute = minute + task.duration % 60; setEvents([ ...events, { ...task, startTime: `${hour}:${minute}`, endTime: `${endHour}:${endMinute}`, height: task.duration * 2 } ]); } }; const handleDragStart = (e, task, listType)=>{ e.dataTransfer.setData("task", JSON.stringify(task)); e.dataTransfer.setData("listType", listType); }; const handleDragOver = (e)=>{ e.preventDefault(); }; const handleDrop = (e, listType)=>{ e.preventDefault(); const task = JSON.parse(e.dataTransfer.getData("task")); const sourceList = e.dataTransfer.getData("listType"); if (sourceList !== listType) { if (listType === "priority") { setPriorityTasks([ ...priorityTasks, task ]); setTasks(tasks.filter((t)=>t.id !== task.id)); } else { setTasks([ ...tasks, task ]); setPriorityTasks(priorityTasks.filter((t)=>t.id !== task.id)); } } }; const promoteToPriority = (task)=>{ setPriorityTasks([ ...priorityTasks, task ]); setTasks(tasks.filter((t)=>t.id !== task.id)); }; const demoteToBacklog = (task)=>{ setTasks([ ...tasks, task ]); setPriorityTasks(priorityTasks.filter((t)=>t.id !== task.id)); }; const deleteTask = (taskId, isPriority)=>{ if (isPriority) { setPriorityTasks(priorityTasks.filter((t)=>t.id !== taskId)); } else { setTasks(tasks.filter((t)=>t.id !== taskId)); } }; const timeSlots = Array.from({ length: 24 }, (_, i)=>i); const currentHour = currentTime.getHours(); const currentMinute = currentTime.getMinutes(); const timePosition = (currentHour + currentMinute / 60) * 120; return /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: theme === "dark" ? "#1a1a1a" : themeColor }, className: "min-h-screen flex flex-col px-8 py-6", __source: { fileName: "", lineNumber: 170, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-7xl mx-auto w-full flex-1 flex flex-col ${showSettings || showProfileEdit ? "blur-sm" : ""}`, __source: { fileName: "", lineNumber: 174, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "p-[0px] flex justify-between items-center font-lemon font-thin mb-2", __source: { fileName: "", lineNumber: 179, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl text-[#fff] dark:text-white", __source: { fileName: "", lineNumber: 180, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[36px] leading-2 font-light", __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }, "⎊"), " ", /*#__PURE__*/ React.createElement("span", { className: "font-inter-tight font-bold", __source: { fileName: "", lineNumber: 182, columnNumber: 13 }, __self: this }, "FOCUSD")), /*#__PURE__*/ React.createElement("button", { className: `p-[0px] rounded-[11px] hover:bg-white/10 h-[41px]`, onClick: ()=>setShowSettings(true), __source: { fileName: "", lineNumber: 184, columnNumber: 11 }, __self: this }, profileImage ? /*#__PURE__*/ React.createElement("img", { src: profileImage, alt: "Profile", className: "w-6 h-6 rounded-[22px] object-cover border-2 border-white dark:border-gray-800", __source: { fileName: "", lineNumber: 189, columnNumber: 15 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-user text-[#fff] dark:text-white text-2xl", __source: { fileName: "", lineNumber: 195, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("main", { className: "flex-1 justify-center items-center overflow-hidden shadow-2xl max-h-min rounded-[22px] max-w-screen-xl", __source: { fileName: "", lineNumber: 200, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full", __source: { fileName: "", lineNumber: 201, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex h-[calc(100vh-6rem)] w-full bg-white dark:bg-[#2d2d2d] rounded-[22px]", __source: { fileName: "", lineNumber: 202, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col w-1/2 relative", __source: { fileName: "", lineNumber: 203, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-[31px] mb-8", __source: { fileName: "", lineNumber: 204, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { style: { color: themeColor }, className: "text-[41px] font-bold font-inter mt-8", __source: { fileName: "", lineNumber: 205, columnNumber: 19 }, __self: this }, currentTime.toLocaleString("en-us", { weekday: "long" })), /*#__PURE__*/ React.createElement("h2", { className: "text-[#999999fc] text-xl font-medium font-inter", __source: { fileName: "", lineNumber: 211, columnNumber: 19 }, __self: this }, currentTime.toLocaleDateString("en-us", { month: "long", day: "numeric", year: "numeric" }))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto pl-8", __source: { fileName: "", lineNumber: 219, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 220, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#cccccc] uppercase text-sm font-semibold mb-4", __source: { fileName: "", lineNumber: 221, columnNumber: 21 }, __self: this }, "TOP PRIORITY"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", onDragOver: handleDragOver, onDrop: (e)=>handleDrop(e, "priority"), __source: { fileName: "", lineNumber: 224, columnNumber: 21 }, __self: this }, priorityTasks.map((task)=>/*#__PURE__*/ React.createElement("li", { key: task.id, className: "flex items-center p-3 bg-white dark:bg-[#2d2d2d] border-b-2 border-gray-200 last:border-0", draggable: true, onDragStart: (e)=>handleDragStart(e, task, "priority"), __source: { fileName: "", lineNumber: 230, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", style: { accentColor: themeColor }, className: "ml-0 pl-0 mr-3 h-5 w-5 min-h-5 min-w-5 rounded-full", checked: task.completed, onChange: ()=>{ const updatedTasks = priorityTasks.map((t)=>t.id === task.id ? { ...t, completed: !t.completed } : t); setPriorityTasks(updatedTasks); setEvents((prevEvents)=>prevEvents.map((event)=>event.id === task.id ? { ...event, completed: !task.completed } : event)); }, __source: { fileName: "", lineNumber: 238, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { style: { color: themeColor }, className: "flex-grow capitalize truncate text-[18px]", __source: { fileName: "", lineNumber: 259, columnNumber: 27 }, __self: this }, task.text), /*#__PURE__*/ React.createElement("span", { className: "ml-3 mr-2 text-sm text-gray-500 text-nowrap whitespace-nowrap", __source: { fileName: "", lineNumber: 265, columnNumber: 27 }, __self: this }, task.duration, " min"), /*#__PURE__*/ React.createElement("div", { className: "opacity-0 hover:opacity-90 transition-opacity flex space-x-2 text-[16px]", __source: { fileName: "", lineNumber: 268, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>demoteToBacklog(task), style: { color: themeColor, backgroundColor: `${themeColor}20` }, className: "py-1 px-[10px] rounded-full", __source: { fileName: "", lineNumber: 269, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-down", __source: { fileName: "", lineNumber: 277, columnNumber: 31 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>deleteTask(task.id, false), style: { color: themeColor, backgroundColor: `${themeColor}20` }, className: "py-[5px] px-[11px] rounded-full", __source: { fileName: "", lineNumber: 279, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 287, columnNumber: 31 }, __self: this }))))), priorityTasks.length === 0 && /*#__PURE__*/ React.createElement("li", { className: "opacity-0 hover:opacity-100 transition-opacity flex items-center rounded-lg border-dashed border-2 mr-8 border-gray-200 dark:bg-[#2d2d2d] capitalize italic text-gray-300 text-[16px]", __source: { fileName: "", lineNumber: 293, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-5", __source: { fileName: "", lineNumber: 294, columnNumber: 27 }, __self: this }, "No Tasks In Top Priority")))), /*#__PURE__*/ React.createElement("div", { className: "absolute right-0 left-0 h-[2px] bg-gray-200", __source: { fileName: "", lineNumber: 299, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "pt-4 mb-4 text-[18px]", __source: { fileName: "", lineNumber: 300, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#cccccc] uppercase text-sm font-semibold mb-4", __source: { fileName: "", lineNumber: 301, columnNumber: 21 }, __self: this }, "BACKLOG"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleAddTask, className: "mb-4 mr-8", __source: { fileName: "", lineNumber: 304, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Add a new task...", style: { backgroundColor: `${themeColor}20`, color: themeColor }, className: "w-full p-3 rounded-lg mr-8 placeholder-current placeholder-opacity-50", value: newTask, onChange: (e)=>setNewTask(e.target.value), __source: { fileName: "", lineNumber: 305, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", onDragOver: handleDragOver, onDrop: (e)=>handleDrop(e, "backlog"), __source: { fileName: "", lineNumber: 317, columnNumber: 21 }, __self: this }, tasks.map((task)=>/*#__PURE__*/ React.createElement("li", { key: task.id, className: "flex items-center p-3 bg-white dark:bg-[#2d2d2d] group border-b-2 border-gray-200 last:border-0", draggable: true, onDragStart: (e)=>handleDragStart(e, task, "backlog"), __source: { fileName: "", lineNumber: 323, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", className: "ml-0 mr-3 h-5 w-5 min-h-5 min-w-5 accent-[#6B7280] rounded-full", checked: task.completed, onChange: ()=>{ const updatedTasks = tasks.map((t)=>t.id === task.id ? { ...t, completed: !t.completed } : t); setTasks(updatedTasks); setEvents((prevEvents)=>prevEvents.map((event)=>event.id === task.id ? { ...event, completed: !task.completed } : event)); }, __source: { fileName: "", lineNumber: 331, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "flex-grow capitalize truncate", __source: { fileName: "", lineNumber: 351, columnNumber: 27 }, __self: this }, task.text), /*#__PURE__*/ React.createElement("span", { className: "ml-3 pl-0 mr-2 text-sm text-gray-500 text-nowrap whitespace-nowrap", __source: { fileName: "", lineNumber: 354, columnNumber: 27 }, __self: this }, task.duration, " min"), /*#__PURE__*/ React.createElement("div", { className: "opacity-0 hover:opacity-100 transition-opacity flex space-x-2 text-[16px]", __source: { fileName: "", lineNumber: 357, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>promoteToPriority(task), className: "text-[#999999] bg-black bg-opacity-10 p-0 rounded-full py-[2px] px-[9px] ", __source: { fileName: "", lineNumber: 358, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-up p-[0px]", __source: { fileName: "", lineNumber: 362, columnNumber: 31 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>deleteTask(task.id, false), className: "text-[#999999] bg-black bg-opacity-10 p-0 rounded-full py-[2px] px-[10px] ", __source: { fileName: "", lineNumber: 364, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 368, columnNumber: 31 }, __self: this }))))), tasks.length === 0 && /*#__PURE__*/ React.createElement("li", { className: "opacity-0 hover:opacity-100 transition-opacity flex capitalize items-center rounded-lg border-dashed border-2 mr-8 border-gray-200 dark:bg-[#2d2d2d] italic text-[16px] text-gray-300", __source: { fileName: "", lineNumber: 374, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-5", __source: { fileName: "", lineNumber: 375, columnNumber: 27 }, __self: this }, "No Tasks In Backlog"))))), /*#__PURE__*/ React.createElement("div", { className: "absolute right-0 top-0 bottom-0 w-[2px] bg-gray-200", __source: { fileName: "", lineNumber: 381, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-1/2 h-full overflow-y-auto rounded-r-[22px]", id: "calendar", __source: { fileName: "", lineNumber: 384, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full relative", __source: { fileName: "", lineNumber: 388, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `absolute w-full h-[2px] bg-[${themeColor}] z-20`, style: { top: `${timePosition}px`, boxShadow: `0 0 4px ${themeColor}80` }, __source: { fileName: "", lineNumber: 389, columnNumber: 19 }, __self: this }), timeSlots.map((hour)=>/*#__PURE__*/ React.createElement("div", { key: hour, className: "relative border-b-[2px] border-solid border-gray-200 last:border-b-0", __source: { fileName: "", lineNumber: 397, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "absolute text-sm font-bold text-[#999999] dark:text-gray-400 bg-white p-2 pl-4 -my-4", __source: { fileName: "", lineNumber: 401, columnNumber: 23 }, __self: this }, formatTime(hour, 0)), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-[120px]", __source: { fileName: "", lineNumber: 404, columnNumber: 23 }, __self: this }, [ 0, 15, 30, 45 ].map((minute)=>/*#__PURE__*/ React.createElement("div", { key: minute, className: "flex-1 relative pl-8 border-b-2 h-[36px] border-dashed border-gray-100 last:border-b-0", onDragOver: handleDragOver, onDrop: (e)=>handleCalendarDrop(e, hour, minute), __source: { fileName: "", lineNumber: 406, columnNumber: 27 }, __self: this }))), events.map((event)=>{ const [eventHour, eventMinute] = event.startTime.split(":").map(Number); if (eventHour === hour) { const isPriority = priorityTasks.some((t)=>t.id === event.id); const color = isPriority ? themeColor : "#6B7280"; const startTimeStr = formatTime(eventHour, eventMinute); const [endHour, endMinute] = event.endTime.split(":").map(Number); const endTimeStr = formatTime(endHour, endMinute); const topOffset = eventMinute * 2; return /*#__PURE__*/ React.createElement("div", { key: event.id, className: "absolute w-10/12 right-0 overflow-hidden cursor-grab", style: { height: `${event.height}px`, backgroundImage: event.completed ? `repeating-linear-gradient(45deg, ${color}20 0px, ${color}20 2px, transparent 2px, transparent 4px)` : "none", backgroundColor: event.completed ? "transparent" : `${color}20`, borderTop: `2px solid ${color}`, zIndex: 10, top: `${topOffset}px`, color: `${color}`, textTransform: `capitalize`, textOverflow: `ellipsis`, textWrap: `nowrap` }, draggable: true, onDragStart: (e)=>handleEventDragStart(e, event), __source: { fileName: "", lineNumber: 435, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-2", __source: { fileName: "", lineNumber: 459, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-sm truncate text-nowrap whitespace-nowrap", __source: { fileName: "", lineNumber: 460, columnNumber: 33 }, __self: this }, event.text), /*#__PURE__*/ React.createElement("div", { className: "text-xs", __source: { fileName: "", lineNumber: 463, columnNumber: 33 }, __self: this }, startTimeStr, " - ", endTimeStr))); } return null; }))))))))), showSettings && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50", onClick: (e)=>{ if (e.target === e.currentTarget) { setShowSettings(false); } }, __source: { fileName: "", lineNumber: 482, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white dark:bg-[#2d2d2d] dark:text-white rounded-[22px] p-8 w-[400px] relative", style: { background: theme === "dark" ? "#2d2d2d" : `linear-gradient(180deg, ${themeColor}20 0%, transparent 20%), white` }, __source: { fileName: "", lineNumber: 490, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { style: { color: themeColor }, className: "absolute top-2 right-2 hover:opacity-60 p-2", onClick: ()=>setShowSettings(false), __source: { fileName: "", lineNumber: 499, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 504, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mb-6", __source: { fileName: "", lineNumber: 506, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative mb-2", __source: { fileName: "", lineNumber: 507, columnNumber: 15 }, __self: this }, profileImage ? /*#__PURE__*/ React.createElement("img", { src: profileImage, alt: "Profile", className: "w-[100px] h-[100px] rounded-full object-cover border-4 border-gray-100 shadow-lg", __source: { fileName: "", lineNumber: 509, columnNumber: 19 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { className: "w-[100px] h-[100px] rounded-full bg-gray-200 flex items-center justify-center border-4 border-gray-100 shadow-lg", __source: { fileName: "", lineNumber: 515, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-4xl text-gray-400", __source: { fileName: "", lineNumber: 516, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("button", { style: { backgroundColor: themeColor }, className: "absolute bottom-0 right-0 text-white rounded-full py-1 px-2", onClick: ()=>setShowProfileEdit(true), __source: { fileName: "", lineNumber: 519, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-pen", __source: { fileName: "", lineNumber: 524, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 527, columnNumber: 15 }, __self: this }, name), email && /*#__PURE__*/ React.createElement("p", { className: "text-gray-500", __source: { fileName: "", lineNumber: 528, columnNumber: 25 }, __self: this }, email)), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 531, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 532, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-4", __source: { fileName: "", lineNumber: 533, columnNumber: 17 }, __self: this }, "Appearance"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 534, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 535, columnNumber: 19 }, __self: this }, "Theme Color"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2", __source: { fileName: "", lineNumber: 538, columnNumber: 19 }, __self: this }, [ "#7C3AED", "#3B82F6", "#10B981", "#F97316", "#E85D5D", "#EC4899", "#14B8A6", "#F59E0B" ].map((color)=>/*#__PURE__*/ React.createElement("button", { key: color, className: `w-8 h-8 rounded-full ${themeColor === color ? "ring-2 ring-offset-2 ring-gray-400" : ""}`, style: { backgroundColor: color }, onClick: ()=>setThemeColor(color), __source: { fileName: "", lineNumber: 549, columnNumber: 23 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 562, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 563, columnNumber: 19 }, __self: this }, "Theme"), /*#__PURE__*/ React.createElement("div", { className: "flex rounded-lg bg-gray-100", __source: { fileName: "", lineNumber: 566, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `flex-1 p-[7px] rounded-md ${theme === "light" ? "bg-white shadow" : ""} transition-all duration-300`, onClick: ()=>setTheme("light"), __source: { fileName: "", lineNumber: 567, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "far fa-sun mr-2", __source: { fileName: "", lineNumber: 573, columnNumber: 23 }, __self: this }), "Light"), /*#__PURE__*/ React.createElement("button", { className: `flex-1 py-2 px-4 rounded-md ${theme === "dark" ? "bg-white shadow" : ""} transition-all duration-300`, onClick: ()=>setTheme("dark"), __source: { fileName: "", lineNumber: 576, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-moon mr-2", __source: { fileName: "", lineNumber: 582, columnNumber: 23 }, __self: this }), "Dark"), /*#__PURE__*/ React.createElement("button", { className: `flex-1 py-2 px-4 rounded-md ${theme === "system" ? "bg-white shadow" : ""} transition-all duration-300`, onClick: ()=>setTheme("system"), __source: { fileName: "", lineNumber: 585, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-laptop mr-2", __source: { fileName: "", lineNumber: 591, columnNumber: 23 }, __self: this }), "System")))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 598, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-4", __source: { fileName: "", lineNumber: 599, columnNumber: 17 }, __self: this }, "Tasks"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 600, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 601, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 602, columnNumber: 21 }, __self: this }, "Max Top Priority Items"), /*#__PURE__*/ React.createElement("select", { className: "w-full p-2 border rounded-lg", value: maxPriority, onChange: (e)=>setMaxPriority(e.target.value), __source: { fileName: "", lineNumber: 605, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 610, columnNumber: 23 }, __self: this }, "Unlimited"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 611, columnNumber: 23 }, __self: this }, "3"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 612, columnNumber: 23 }, __self: this }, "5"), /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 613, columnNumber: 23 }, __self: this }, "10"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 616, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-sm font-medium", __source: { fileName: "", lineNumber: 617, columnNumber: 21 }, __self: this }, "Hide Completed Tasks"), /*#__PURE__*/ React.createElement("button", { style: { backgroundColor: hideCompleted ? themeColor : undefined }, className: "relative w-14 h-7 rounded-full transition-colors bg-gray-200", onClick: ()=>setHideCompleted(!hideCompleted), __source: { fileName: "", lineNumber: 620, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `absolute top-[2px] left-[2px] w-6 h-6 rounded-full bg-white transform transition-transform duration-300 ${hideCompleted ? "translate-x-7" : "translate-x-0"}`, __source: { fileName: "", lineNumber: 627, columnNumber: 23 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 637, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-4", __source: { fileName: "", lineNumber: 638, columnNumber: 17 }, __self: this }, "Sound Effects"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 639, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-sm font-medium", __source: { fileName: "", lineNumber: 640, columnNumber: 19 }, __self: this }, "Sound Effects"), /*#__PURE__*/ React.createElement("button", { style: { backgroundColor: soundEffects ? themeColor : undefined }, className: "relative w-14 h-7 rounded-full transition-colors bg-gray-200", onClick: ()=>setSoundEffects(!soundEffects), __source: { fileName: "", lineNumber: 641, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `absolute top-[2px] left-[2px] w-6 h-6 rounded-full bg-white transform transition-transform duration-300 ${soundEffects ? "translate-x-7" : "translate-x-0"}`, __source: { fileName: "", lineNumber: 648, columnNumber: 21 }, __self: this }))))))), showProfileEdit && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50", onClick: (e)=>{ if (e.target === e.currentTarget) { setShowProfileEdit(false); } }, __source: { fileName: "", lineNumber: 662, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white dark:bg-[#2d2d2d] dark:text-white rounded-[22px] p-8 w-[400px] relative", __source: { fileName: "", lineNumber: 670, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { style: { color: themeColor }, className: "absolute top-2 right-2 hover:opacity-60 p-2", onClick: ()=>setShowProfileEdit(false), __source: { fileName: "", lineNumber: 671, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 676, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 678, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 679, columnNumber: 15 }, __self: this }, profileImage ? /*#__PURE__*/ React.createElement("img", { src: profileImage, alt: "Profile", className: "w-[100px] h-[100px] rounded-full object-cover mb-4", __source: { fileName: "", lineNumber: 681, columnNumber: 19 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { className: "w-[100px] h-[100px] rounded-full bg-gray-200 flex items-center justify-center mb-4", __source: { fileName: "", lineNumber: 687, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-4xl text-gray-400", __source: { fileName: "", lineNumber: 688, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "cursor-pointer bg-gray-100 hover:bg-gray-200 text-gray-700 px-4 py-2 rounded-lg", __source: { fileName: "", lineNumber: 692, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", className: "hidden", accept: "image/*", onChange: async (e)=>{ if (e.target.files?.[0]) { const { url } = await upload({ file: e.target.files[0] }); setProfileImage(url); } }, __source: { fileName: "", lineNumber: 693, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-camera mr-2", __source: { fileName: "", lineNumber: 706, columnNumber: 19 }, __self: this }), "Upload Photo")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 711, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 712, columnNumber: 17 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { type: "text", className: "w-full p-2 border rounded-lg", value: name, onChange: (e)=>setName(e.target.value), __source: { fileName: "", lineNumber: 713, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 721, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 722, columnNumber: 17 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { type: "email", className: "w-full p-2 border rounded-lg", value: email, onChange: (e)=>setEmail(e.target.value), __source: { fileName: "", lineNumber: 723, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end space-x-4", __source: { fileName: "", lineNumber: 731, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 text-gray-600 hover:bg-gray-100 rounded-lg", onClick: ()=>setShowProfileEdit(false), __source: { fileName: "", lineNumber: 732, columnNumber: 17 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { style: { backgroundColor: themeColor }, className: "px-4 py-2 text-white rounded-lg hover:opacity-90", onClick: ()=>setShowProfileEdit(false), __source: { fileName: "", lineNumber: 738, columnNumber: 17 }, __self: this }, "Save"))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 751, columnNumber: 7 }, __self: this }, ` .theme-toggle { transition: transform 0.3s ease-in-out; } .theme-toggle.active { transform: translateX(24px); } `)); }

Monday

July 21, 2025

TOP PRIORITY

BACKLOG