Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Right click on sidebar gives option to create new directory / note #250

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

Right click on sidebar gives option to create new directory / note #250

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
18cabe0
src/components/FileItem: Added stopPropogation to context menu to pre…
mohamedilaiwi May 10, 2024
75cad74
electron/main/index: Added new ipcMain handler for dropdown menu on r…
mohamedilaiwi May 10, 2024
9c48b69
electron/preload/index: Added new contextMenu to invoke our ipcMain h…
mohamedilaiwi May 10, 2024
751ba17
src/components/File/index: added new handleMenuContext to display dro…
mohamedilaiwi May 10, 2024
dda2a8a
src/components/IconsSidebar: Added new receiver for open note/directo…
mohamedilaiwi May 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
26 changes: 26 additions & 0 deletions electron/main/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -216,6 +216,32 @@ ipcMain.handle("show-context-menu-file-item", (event, file) => {
}
});

ipcMain.handle("show-context-menu-item", (event) => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We already have the handler for show-context-menu-file-item. Why not include these new context menu items there?

(For my personal vault, I have the fileexplorer sidebar so i could not actually get it to show these new context menu items you've added. Only by opening a vault which doesn't have lots of files would it actually leave space in the file explorer sidebar to hit these context menu items)

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because this one is specifically for right clicking on the file explorer sidebar (if a file does not exist there) that creates a menu to create a new note or directory. The current show-context-menu-file-item has options like delete, rename, and create a flashcard set that would not be appropriate.

This is just something I like to have for note apps, but I understand if other people do not think it's necessary!

const menu = new Menu();

menu.append(
new MenuItem({
label: "New Note",
click: () => {
event.sender.send("add-new-note-listener");
},
})
);

menu.append(
new MenuItem({
label: "New Directory",
click: () => {
event.sender.send("add-new-directory-listener");
},
})
);

const browserWindow = BrowserWindow.fromWebContents(event.sender);
if (browserWindow)
menu.popup({ window: browserWindow })
});

ipcMain.handle("open-external", (event, url) => {
shell.openExternal(url);
});
Expand Down
9 changes: 9 additions & 0 deletions electron/preload/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,9 @@ declare global {
contextMenu: {
showFileItemContextMenu: (filePath: FileInfoNode) => void;
};
contextFileMenu: {
showMenuItemContext: () => void;
}
database: {
search: (
query: string,
Expand Down Expand Up @@ -306,6 +309,12 @@ contextBridge.exposeInMainWorld("contextMenu", {
},
});

contextBridge.exposeInMainWorld("contextFileMenu", {
showMenuItemContext: () => {
ipcRenderer.invoke("show-context-menu-item");
},
});

contextBridge.exposeInMainWorld("files", {
openDirectoryDialog: () => ipcRenderer.invoke("open-directory-dialog"),
openFileDialog: (fileExtensions?: string[]) =>
Expand Down
1 change: 1 addition & 0 deletions src/components/File/FileSideBar/FileItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ export const FileItem: React.FC<FileInfoProps> = ({

const handleContextMenu = (e: React.MouseEvent) => {
e.preventDefault();
e.stopPropagation(); // Prevent event from bubbling up to the parent.
window.contextMenu.showFileItemContextMenu(file);
};

Expand Down
48 changes: 39 additions & 9 deletions src/components/File/FileSideBar/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,13 @@
setFileDirToBeRenamed,
listHeight,
}) => {



return (
<div className="flex flex-col h-below-titlebar text-white overflow-y-auto overflow-x-hidden">
<div
className="flex flex-col h-below-titlebar text-white overflow-y-auto overflow-x-hidden"
>
{noteToBeRenamed && (
<RenameNoteModal
isOpen={!!noteToBeRenamed}
Expand Down Expand Up @@ -135,6 +140,22 @@
return visibleItems;
};

const handleMenuContext = (e: React.MouseEvent) => {
e.preventDefault();
window.contextFileMenu.showMenuItemContext();
}

const hideScrollbarStyle = {
overflowY: 'auto',
scrollbarWidth: 'none',
};

const webKitScrollBarStyles = `
div::-webkit-scrollbar {
display: none;
}
`;

// Calculate visible items and item count
const visibleItems = getVisibleFilesAndFlatten(files, expandedDirectories);
const itemCount = visibleItems.length;
Expand All @@ -161,14 +182,23 @@
};

return (
<List
height={listHeight}
itemCount={itemCount}
itemSize={30}
width={"100%"}
style={{ padding: 0, margin: 0 }}
<div
onContextMenu={handleMenuContext}
style={hideScrollbarStyle}

Check failure on line 187 in src/components/File/FileSideBar/index.tsx

View workflow job for this annotation

GitHub Actions / build_and_package (macos-latest) 

Type '{ overflowY: string; scrollbarWidth: string; }' is not assignable to type 'Properties<string | number, string & {}>'.

Check failure on line 187 in src/components/File/FileSideBar/index.tsx

View workflow job for this annotation

GitHub Actions / build_and_package (ubuntu-latest, x64) 

Type '{ overflowY: string; scrollbarWidth: string; }' is not assignable to type 'Properties<string | number, string & {}>'.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like there are some compile issues to fix here...

>
{Rows}
</List>
<style>
{webKitScrollBarStyles}
</style>
<List
height={listHeight}
itemCount={itemCount}
itemSize={30}
width={"100%"}
style={{ padding: 0, margin: 0 }}
>
{Rows}
</List>
</div>
);

};
30 changes: 30 additions & 0 deletions src/components/Sidebars/IconsSidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,36 @@ const IconsSidebar: React.FC<IconsSidebarProps> = ({
};
}, []);

// open a new note window
useEffect(() => {
const createNewNoteListener = window.ipcRenderer.receive(
"add-new-note-listener",
() => {
console.log("Setting new note modal to true");
setIsNewNoteModalOpen(true);
}
);

return () => {
createNewNoteListener();
}
}, []);

// open a new directory window
useEffect(() => {
const createNewDirectoryListener = window.ipcRenderer.receive(
"add-new-directory-listener",
() => {
console.log("Adding new directory modal to true");
setIsNewDirectoryModalOpen(true);
}
);

return () => {
createNewDirectoryListener();
}
}, []);

return (
<div className="w-full h-full bg-neutral-800 flex flex-col items-center justify-between">
<div
Expand Down