diff --git a/apps/web/src/components/dialogs/index.js b/apps/web/src/components/dialogs/index.js index 4bc0d9a86..bdaf99abe 100644 --- a/apps/web/src/components/dialogs/index.js +++ b/apps/web/src/components/dialogs/index.js @@ -4,6 +4,7 @@ import { Flex, Box, Text, Button as RebassButton } from "rebass"; import { Input, Checkbox, Label } from "@rebass/forms"; import * as Icon from "react-feather"; import { ThemeProvider } from "../../utils/theme"; +import { db } from "../../common"; import Modal from "react-modal"; const Dialog = props => { @@ -71,8 +72,10 @@ const Dialog = props => { > {props.positiveButton.text || "OK"} @@ -235,6 +238,190 @@ export const ask = (icon, title, message) => { ); }); } - console.log("Notebooks"); + return Promise.reject("No element with id 'dialogContainer'"); +}; + +export const MoveDialog = props => { + const [items, setItems] = useState(db.getNotebooks()); + const [type, setType] = useState("notebooks"); + const [title, setTitle] = useState("Notebooks"); + const [mode, setMode] = useState("read"); + useEffect(() => { + MoveDialog.last = []; + }, []); + return ( + + + + {type !== "notebooks" && ( + { + let item = MoveDialog.last.pop(); + setType(item.type); + setTitle(item.title); + setItems(item.items); + }} + sx={{ + ":hover": { color: "primary" }, + marginRight: 2 + }} + > + + + )} + {title} + + {type !== "notes" && ( + { + if (mode === "write") { + setMode("read"); + return; + } + setMode("write"); + setTimeout(() => { + MoveDialog.inputRef.focus(); + }, 0); + }} + sx={{ + ":hover": { color: "primary" } + }} + > + {mode === "read" ? : } + + )} + + (MoveDialog.inputRef = ref)} + variant="default" + sx={{ display: mode === "write" ? "block" : "none" }} + my={1} + placeholder={type === "notebooks" ? "Notebook name" : "Topic name"} + onKeyUp={async e => { + if (e.nativeEvent.key === "Enter" && e.target.value.length > 0) { + if (type === "notebooks") { + await db.addNotebook({ title: e.target.value }); + setItems(db.getNotebooks()); + } else { + await db.addTopicToNotebook( + MoveDialog.notebook.dateCreated, + e.target.value + ); + setItems( + db.getNotebook(MoveDialog.notebook.dateCreated).topics + ); + } + MoveDialog.inputRef.value = ""; + setMode("read"); + } + }} + /> + + {items.length ? ( + items.map(v => { + return ( + { + MoveDialog.last.push({ + title: title, + items: items, + type: type + }); + if (type === "notebooks") { + setType("topics"); + MoveDialog.notebook = v; + setTitle(v.title); + setItems(v.topics); + } else if (type === "topics") { + setType("notes"); + MoveDialog.topic = v.title; + setTitle(`${MoveDialog.notebook.title} - ${v.title}`); + setItems( + db.getTopic(MoveDialog.notebook.dateCreated, v.title) + ); + } + }} + > + {v.title} + {v.totalNotes !== undefined && ( + + {v.totalNotes + " Notes"} + + )} + + ); + }) + ) : ( + + Nothing here + + )} + + + } + positiveButton={{ + text: "Move", + click: async () => { + if ( + await db.moveNote(props.noteId, props.notebook, { + notebook: MoveDialog.notebook.dateCreated, + topic: MoveDialog.topic + }) + ) { + props.onMove(); + } + props.onClose(); + }, + disabled: type !== "notes" + }} + negativeButton={{ text: "Cancel", onClick: props.onClose }} + /> + ); +}; + +export const moveNote = (noteId, notebook) => { + const root = document.getElementById("dialogContainer"); + const perform = (result, resolve) => { + Dialog.close(); + ReactDOM.unmountComponentAtNode(root); + resolve(result); + }; + if (root) { + return new Promise((resolve, _) => { + ReactDOM.render( + perform(false, resolve)} + onMove={() => perform(true, resolve)} + />, + root + ); + }); + } return Promise.reject("No element with id 'dialogContainer'"); }; diff --git a/apps/web/src/components/note/index.js b/apps/web/src/components/note/index.js index 083c17e4b..fb5f7aa2d 100644 --- a/apps/web/src/components/note/index.js +++ b/apps/web/src/components/note/index.js @@ -5,18 +5,17 @@ import TimeAgo from "timeago-react"; import { db, ev } from "../../common"; import { showSnack } from "../snackbar"; import ListItem from "../list-item"; -//import RootNavigator from "../../navigation/navigators/rootnavigator"; -import { ask } from "../dialogs"; +import { ask, moveNote } from "../dialogs"; const dropdownRefs = []; const menuItems = note => [ { title: note.notebook.notebook ? "Move" : "Add to", onClick: async () => { - /* RootNavigator.navigate(RootNavigator.routes.notebooks.key, { - intent: "moveNote", - data: note - }); */ + console.log(note.dateCreated, note.notebook); + if (await moveNote(note.dateCreated, note.notebook)) { + showSnack("Note moved successfully!"); + } } }, { diff --git a/apps/web/src/views/Notebooks.js b/apps/web/src/views/Notebooks.js index a1b6fc7ee..7ad3e530a 100644 --- a/apps/web/src/views/Notebooks.js +++ b/apps/web/src/views/Notebooks.js @@ -3,7 +3,7 @@ import { Flex } from "rebass"; import { db, ev } from "../common"; import { showSnack } from "../components/snackbar"; import Notebook from "../components/notebook"; -import { CreateNotebookDialog, ask } from "../components/dialogs"; +import { CreateNotebookDialog } from "../components/dialogs"; import ListContainer from "../components/list-container"; const Notebooks = props => { diff --git a/apps/web/yarn.lock b/apps/web/yarn.lock index 78001cb97..cb2d68ce6 100644 --- a/apps/web/yarn.lock +++ b/apps/web/yarn.lock @@ -6991,7 +6991,7 @@ normalize-url@^3.0.0, normalize-url@^3.0.1: "notes-core@https://github.com/thecodrr/notes-core.git": version "0.3.0" - resolved "https://github.com/thecodrr/notes-core.git#a0e77f9539b7574cb375ae401859c5d60a86b34b" + resolved "https://github.com/thecodrr/notes-core.git#4535b867bfd9ab5c8e0d4c960050b1d8747b3340" dependencies: fuzzysearch "^1.0.3" transfun "^1.0.2"