diff --git a/README.md b/README.md
index e7c1c4ff..2742597f 100644
--- a/README.md
+++ b/README.md
@@ -59,16 +59,26 @@
## Context menu
-Context menu allows you to quickly save selected text from any website to My Notes, or to transfer selected text to My Notes on other computers.
+Context menu can be displayed on right-click on any website and based on the context used to quickly save:
-To use Context menu, select the text on website, right-click and see "My Notes" Context menu.
+
+
selected text
+
current page URL (right-click on an empty space)
+
image
+
+
+Destination can be any local note, or My Notes on other computers.
+
+Options are based on the context but in general are:
-Context menu has these options:
+- `Save to [note name]` – Option for every note. My Notes doesn't have to be open. Google Drive Sync is not required.
+- `Save to remotely open My Notes` – My Notes on other computers needs to be open. The same Google Account needs to be used. Google Drive Sync is not required. The destination note will be named `@received`.
-- `Save to [note name]` – Option for every note. As you create new notes, they are automatically added to the list. My Notes doesn't have to be open. Google Drive Sync is not required.
-- `Save to remotely open My Notes` – My Notes on other computers needs to be open. The same Google Account needs to be used. Google Drive Sync is not required. The destination note to save the text will be named **"@received"** (created automatically if it doesn't exist, otherwise updated).
+There is a few general purpose notes that can be used as destination. Their name starts with `@` and they are created automatically when needed:
-Context menu also allows you to save current page URL (no text selected) to **"@clipboard"** (created automatically if it doesn't exist, otherwise updated).
+- `@received`
+- `@clipboard`
+- `@images`
@@ -87,17 +97,11 @@ Click on the **"Save"** button to save the custom theme.
## Command palette
-Command palette is a window which you can open with `Cmd + P` (or `Ctrl + P`) and use your keyboard to quickly perform any of the following actions:
-
-
-
Find note(s) by their name, and open one. (default behavior)
-
Find note(s) by their content, and open one. (type ? first, then continue)
-
Find commands, and execute one. (type > first, then continue)
-
+Command palette is a window which you can open with `Cmd + P` (or `Ctrl + P`) and use your keyboard to quickly find commands, and execute one.
-To navigate between the results, use `Up` and `Down` arrow keys.
+To navigate between the commands, use `Up` and `Down` arrow keys.
-To open a selected note or execute a selected command, press `Enter`.
+To execute a selected command, press `Enter`.
The last executed command can be repeated with `Cmd + Shift + P` (or `Ctrl + Shift + P`).
diff --git a/src/notes.tsx b/src/notes.tsx
index cc7811ff..5edb666e 100644
--- a/src/notes.tsx
+++ b/src/notes.tsx
@@ -43,12 +43,15 @@ import {
} from "notes/content/save";
import sendMessage from "shared/messages/send";
-import { getActiveFromUrl, getFocusOverride } from "notes/location";
+import { getActiveFromUrl, getFocusOverride, isOverview } from "notes/location";
+import Overview from "notes/overview/Overview";
import getFirstAvailableNoteName from "notes/filters/get-first-available-note-name";
import notesHistory from "notes/history";
import keyboardShortcuts, { KeyboardShortcut } from "notes/keyboard-shortcuts";
import { useKeyboardShortcut } from "notes/hooks/use-keyboard-shortcut";
-import { Command, toggleSidebar, toggleToolbar } from "notes/commands";
+import {
+ Command, toggleSidebar, toggleToolbar, toggleFocusMode,
+} from "notes/commands";
import { exportNote } from "notes/export";
import { notesToSidebarNotes } from "notes/adapters";
@@ -64,6 +67,8 @@ const Notes = (): h.JSX.Element => {
const [tabId, setTabId] = useState(undefined);
const [initialized, setInitialized] = useState(false);
+ const [view] = useState<"default" | "overview">(isOverview() ? "overview" : "default");
+
// Notifications
const [notification, setNotification] = useState(undefined);
@@ -378,8 +383,8 @@ const Notes = (): h.JSX.Element => {
// Sidebar
useEffect(() => {
- document.body.classList.toggle("with-sidebar", sidebar);
- }, [sidebar]);
+ document.body.classList.toggle("with-sidebar", view === "default" && sidebar);
+ }, [sidebar, view]);
// Sidebar width
useEffect(() => {
@@ -429,8 +434,8 @@ const Notes = (): h.JSX.Element => {
raw: note.raw || false,
});
- document.title = note ? notesProps.active : "My Notes";
- }, [notesProps.active]);
+ document.title = (view === "default" && note) ? notesProps.active : "My Notes";
+ }, [notesProps.active, view]);
// Toolbar
useEffect(() => {
@@ -455,18 +460,10 @@ const Notes = (): h.JSX.Element => {
});
});
keyboardShortcuts.subscribe(KeyboardShortcut.OnOpenOptions, chrome.runtime.openOptionsPage);
- keyboardShortcuts.subscribe(KeyboardShortcut.OnToggleFocusMode, () => {
- if (getFocusOverride()) {
- return;
- }
- chrome.storage.local.get(["focus"], (local) => {
- chrome.storage.local.set({ focus: !local.focus });
- });
- });
keyboardShortcuts.subscribe(KeyboardShortcut.OnToggleSidebar, toggleSidebar);
-
keyboardShortcuts.subscribe(KeyboardShortcut.OnToggleToolbar, toggleToolbar);
+ keyboardShortcuts.subscribe(KeyboardShortcut.OnToggleFocusMode, toggleFocusMode);
keyboardShortcuts.subscribe(KeyboardShortcut.OnSync, () => sendMessage(MessageType.SYNC));
}, [os]);
@@ -572,6 +569,12 @@ const Notes = (): h.JSX.Element => {
}, 6000); // and then Auto Sync every 6 seconds
}, [initialized, autoSync]);
+ if (view === "overview" && notesOrder && order) {
+ return (
+
+ );
+ }
+
return (
{notification && (
diff --git a/src/notes/commands/index.ts b/src/notes/commands/index.ts
index e6383a2f..747011ae 100644
--- a/src/notes/commands/index.ts
+++ b/src/notes/commands/index.ts
@@ -1,5 +1,5 @@
import dateUtils from "shared/date/date-utils";
-import { getFocusOverride } from "notes/location";
+import { getFocusOverride, isOverview } from "notes/location";
import table from "./table";
import highlight from "./highlight";
@@ -94,13 +94,15 @@ const commands: { [key in AvailableCommand]: Command } = {
RemoveFormat,
};
+const canToggle = () => !getFocusOverride() && !isOverview();
+
const toggleSidebar: Command = () => {
- if (getFocusOverride()) {
+ if (!canToggle()) {
return;
}
chrome.storage.local.get(["focus"], (local) => {
- if (!local.focus) { // toggle only if not in focus mode
+ if (!local.focus) { // toggle only if NOT in focus mode
const hasSidebar = document.body.classList.toggle("with-sidebar");
chrome.storage.local.set({ sidebar: hasSidebar });
}
@@ -108,18 +110,28 @@ const toggleSidebar: Command = () => {
};
const toggleToolbar: Command = () => {
- if (getFocusOverride()) {
+ if (!canToggle()) {
return;
}
chrome.storage.local.get(["focus"], (local) => {
- if (!local.focus) { // toggle only if not in focus mode
+ if (!local.focus) { // toggle only if NOT in focus mode
const hasToolbar = document.body.classList.toggle("with-toolbar");
chrome.storage.local.set({ toolbar: hasToolbar });
}
});
};
+const toggleFocusMode: Command = () => {
+ if (!canToggle()) {
+ return;
+ }
+
+ chrome.storage.local.get(["focus"], (local) => {
+ chrome.storage.local.set({ focus: !local.focus });
+ });
+};
+
export {
commands,
@@ -133,4 +145,5 @@ export {
toggleSidebar,
toggleToolbar,
+ toggleFocusMode,
};
diff --git a/src/notes/components/SidebarButtons.tsx b/src/notes/components/SidebarButtons.tsx
index d50c023a..3af015d1 100644
--- a/src/notes/components/SidebarButtons.tsx
+++ b/src/notes/components/SidebarButtons.tsx
@@ -7,6 +7,7 @@ import SVG from "notes/components/SVG";
import FileSvgText from "svg/file.svg";
import GearSvgText from "svg/gear.svg";
import RefreshSvgText from "svg/refresh.svg";
+import GridSvgText from "svg/grid.svg";
import { importNoteFromTextFile } from "notes/import";
import sendMessage from "shared/messages/send";
import formatDate from "shared/date/format-date";
@@ -23,6 +24,7 @@ const SidebarButtons = ({
}: SidebarButtonsProps): h.JSX.Element => {
const [dragOver, setDragOver] = useState(false);
const openOptions = useCallback(() => chrome.runtime.openOptionsPage(), []);
+ const openOverview = useCallback(() => window.open("notes.html?overview", "_blank"), []);
return (
+
+
+