function MainComponent() { const [folders, setFolders] = React.useState([ { name: 'Default', notes: [] } ]); const [currentFolderIndex, setCurrentFolderIndex] = React.useState(0); const [newFolderName, setNewFolderName] = React.useState(''); const [newNoteTitle, setNewNoteTitle] = React.useState(''); const [newNoteBody, setNewNoteBody] = React.useState(''); const addFolder = ()=>{ if (newFolderName.trim() !== '') { setFolders([ ...folders, { name: newFolderName, notes: [] } ]); setNewFolderName(''); } }; const deleteFolder = (indexToDelete)=>{ if (indexToDelete !== 0) { setFolders(folders.filter((_, index)=>index !== indexToDelete)); if (currentFolderIndex === indexToDelete) { setCurrentFolderIndex(0); } } }; const addNote = ()=>{ if (newNoteTitle.trim() !== '' || newNoteBody.trim() !== '') { const updatedFolders = [ ...folders ]; updatedFolders[currentFolderIndex].notes = [ ...updatedFolders[currentFolderIndex].notes, { title: newNoteTitle, body: newNoteBody } ]; setFolders(updatedFolders); setNewNoteTitle(''); setNewNoteBody(''); } }; const deleteNote = (noteIndexToDelete)=>{ const updatedFolders = [ ...folders ]; updatedFolders[currentFolderIndex].notes = updatedFolders[currentFolderIndex].notes.filter((_, index)=>index !== noteIndexToDelete); setFolders(updatedFolders); }; const folderList = folders.map((folder, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 46, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `p-2 rounded text-white ${currentFolderIndex === index ? 'bg-blue-500' : 'bg-gray-800'} font-roboto`, onClick: ()=>setCurrentFolderIndex(index), __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, folder.name), index !== 0 && /*#__PURE__*/ React.createElement("button", { className: "text-red-500", onClick: ()=>deleteFolder(index), __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, "🗑️"))); const noteList = folders[currentFolderIndex]?.notes.map((note, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-gray-100 p-4 rounded shadow my-2 font-roboto", __source: { fileName: "", lineNumber: 65, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-bold text-lg text-gray-800", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, note.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }, note.body), /*#__PURE__*/ React.createElement("button", { className: "text-red-500 mt-2", onClick: ()=>deleteNote(index), __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, "🗑️"))); return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4", __source: { fileName: "", lineNumber: 75, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 76, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "border p-2 rounded font-roboto", placeholder: "New folder name", name: "newFolderName", value: newFolderName, onChange: (e)=>setNewFolderName(e.target.value), __source: { fileName: "", lineNumber: 77, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 text-white p-2 rounded font-roboto", onClick: addFolder, __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }, "Add Folder")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4 my-4", __source: { fileName: "", lineNumber: 88, columnNumber: 7 }, __self: this }, folderList), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 89, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "border p-2 rounded font-roboto flex-1", placeholder: "Note title", name: "newNoteTitle", value: newNoteTitle, onChange: (e)=>setNewNoteTitle(e.target.value), __source: { fileName: "", lineNumber: 90, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { className: "border p-2 rounded font-roboto flex-1", rows: "4", placeholder: "Note body", name: "newNoteBody", value: newNoteBody, onChange: (e)=>setNewNoteBody(e.target.value), __source: { fileName: "", lineNumber: 97, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-green-500 text-white p-2 rounded font-roboto", onClick: addNote, __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }, "Add Note")), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 109, columnNumber: 7 }, __self: this }, noteList)); }