Software-Mac/spacedrive
Software-Mac/spacedrive
1
0
Fork 0
mirror of https://github.com/spacedriveapp/spacedrive synced 2024-07-02 11:13:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ENG-1612] Fix mouse nav forwards and backwards (#2105)

Browse source 
Fix mouse nav forwards and backwards
This commit is contained in:
ameer2468 2024-02-19 18:23:20 +03:00 committed by GitHub
parent bd1f11b0d9
commit e8450821df
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 24 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
interface/app/$libraryId/Explorer/View/Grid/Item.tsx
View file

@ -1,5 +1,8 @@
import { HTMLAttributes, ReactNode, useMemo } from 'react';
import { useNavigate } from 'react-router';
import { useSelector, type ExplorerItem } from '@sd/client';
import { useOperatingSystem } from '~/hooks';
import { useRoutingContext } from '~/RoutingContext';
import { useExplorerContext } from '../../Context';
import { explorerStore, isCut } from '../../store';
@ -17,6 +20,9 @@ interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
export const GridItem = ({ children, item, index, ...props }: Props) => {
const explorer = useExplorerContext();
const explorerView = useExplorerViewContext();
const { currentIndex, maxIndex } = useRoutingContext();
const os = useOperatingSystem();
const navigate = useNavigate();
const dragSelect = useDragSelectContext();
@ -31,16 +37,29 @@ export const GridItem = ({ children, item, index, ...props }: Props) => {
[explorer.selectedItems, item]
);
const canGoBack = currentIndex !== 0;
const canGoForward = currentIndex !== maxIndex;
const { attributes } = useDragSelectable({ index, id: uniqueId(item), selected });
return (
<div
{...props}
{...attributes}
className="h-full w-full"
className="w-full h-full"
// Prevent explorer view onMouseDown event from
// being executed and resetting the selection
onMouseDown={(e) => e.stopPropagation()}
onMouseDown={(e) => {
if (os === 'browser') return;
e.stopPropagation();
if (e.buttons === 8 || e.buttons === 3) {
if (!canGoBack) return;
navigate(-1);
} else if (e.buttons === 16 || e.buttons === 4) {
if (!canGoForward) return;
navigate(1);
}
}}
onContextMenu={(e) => {
if (!explorerView.selectable || explorer.selectedItems.has(item)) return;
explorer.resetSelectedItems([item]);

5
interface/app/$libraryId/TopBar/NavigationButtons.tsx
View file

@ -43,11 +43,12 @@ export const NavigationButtons = () => {
useEffect(() => {
const onMouseDown = (e: MouseEvent) => {
if (os === 'browser') return;
e.stopPropagation();
if (e.buttons === 8) {
if (e.buttons === 8 || e.buttons === 3) {
if (!canGoBack) return;
navigate(-1);
} else if (e.buttons === 16) {
} else if (e.buttons === 16 || e.buttons === 4) {
if (!canGoForward) return;
navigate(1);
}