function MainComponent() { const [tasks, setTasks] = React.useState([ { id: 1, title: 'Task Title', description: 'Description', dueDate: '2023-10-14 10:00 AM', priority: 'High', progress: 50, notificationTime: '2023-10-14 09:00 AM', repeatInterval: 'Weekly', color: '#f3f3f3', tags: [ 'Work', 'Important' ], subtasks: [ { id: 1, title: 'Subtask 1', progress: 20 }, { id: 2, title: 'Subtask 2', progress: 50 } ] } ]); const handleAddTask = ()=>{ // Logic to add task }; const handleEditTask = (taskId)=>{ // Logic to edit task }; const handleDeleteTask = (taskId)=>{ // Logic to delete task }; const handleCompleteTask = (taskId)=>{ // Logic to mark task as complete }; return /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-roboto", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, "Task Manager"), /*#__PURE__*/ React.createElement("button", { onClick: handleAddTask, className: "bg-blue-500 text-white px-4 py-2 rounded font-roboto", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, "Add Task")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, tasks.map((task)=>/*#__PURE__*/ React.createElement("div", { key: task.id, className: `flex flex-col border p-4 rounded`, style: { backgroundColor: task.color }, __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-roboto mb-2", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, task.title), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }, task.description), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Due Date: ", task.dueDate), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, "Priority: ", task.priority), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, "Progress: ", task.progress, "%"), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, "Notification: ", task.notificationTime), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, "Repeat: ", task.repeatInterval), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, "Tags: ", task.tags.join(', ')), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleEditTask(task.id), className: "bg-yellow-500 text-white px-2 py-1 rounded mt-2 font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, "Edit Task"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteTask(task.id), className: "bg-red-500 text-white px-2 py-1 rounded mt-2 font-roboto", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, "Delete Task"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleCompleteTask(task.id), className: "bg-green-500 text-white px-2 py-1 rounded mt-2 font-roboto", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "Complete Task"), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-roboto", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, "Subtasks"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, task.subtasks.map((subtask)=>/*#__PURE__*/ React.createElement("li", { key: subtask.id, className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 61, columnNumber: 19 }, __self: this }, subtask.title, " - ", subtask.progress, "%"))))))), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "border p-2 w-full font-roboto", type: "text", placeholder: "Search tasks...", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }))); }