Software-Mac/spacedrive
Software-Mac/spacedrive
1
0
Fork 0
mirror of https://github.com/spacedriveapp/spacedrive synced 2024-07-04 14:33:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ENG-1254] Fix explorer path bar for windows (#1537)

Browse source 
* Update ExplorerPath.tsx

* fix support for windows and mac
This commit is contained in:
ameer2468 2023-10-12 15:10:45 +03:00 committed by GitHub
parent 826bb4be4c
commit 36c6b6dd2a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
interface/app/$libraryId/Explorer/View/ExplorerPath.tsx
View file

@ -5,7 +5,7 @@ import { memo, useCallback, useEffect, useState } from 'react';
import { useMatch } from 'react-router';
import { ExplorerItem } from '@sd/client';
import { SearchParamsSchema } from '~/app/route-schemas';
import { useIsDark, useZodSearchParams } from '~/hooks';
import { useIsDark, useOperatingSystem, useZodSearchParams } from '~/hooks';
import { useExplorerContext } from '../Context';
import { FileThumb } from '../FilePath/Thumb';
@ -16,6 +16,8 @@ export const PATH_BAR_HEIGHT = 32;
export const ExplorerPath = memo(() => {
const isDark = useIsDark();
const isEphemeralLocation = useMatch('/:libraryId/ephemeral/:ephemeralId');
const os = useOperatingSystem();
const pathSlashOS = os === 'windows' ? '\\' : '/';
const [data, setData] = useState<{ kind: string; name: string }[] | null>(null);
const [selectedItem, setSelectedItem] = useState<ExplorerItem | undefined>(undefined);
@ -30,39 +32,38 @@ export const ExplorerPath = memo(() => {
//There are cases where the path ends with a '/' and cases where it doesn't
const pathInfo = indexedPath
? indexedPath + (path ? path.slice(0, -1) : '')
: path?.endsWith('/')
: path?.endsWith(pathSlashOS)
? path?.slice(0, -1)
: path;
const pathBuilder = (pathsToSplit: string, clickedPath: string): string => {
const splitPaths = pathsToSplit?.split('/');
const slashCheck = isEphemeralLocation ? pathSlashOS : '/'; //in ephemeral locations, the path is built with '\' instead of '/' for windows
const splitPaths = pathsToSplit?.split(slashCheck);
const indexOfClickedPath = splitPaths?.indexOf(clickedPath);
const newPath = splitPaths?.slice(0, (indexOfClickedPath as number) + 1).join('/') + '/';
const newPath =
splitPaths?.slice(0, (indexOfClickedPath as number) + 1).join(slashCheck) + slashCheck;
return newPath;
};
const pathRedirectHandler = (pathName: string, index: number): void => {
if (isEphemeralLocation) {
const getPaths = data?.map((p) => p.name).join('/');
const newPath = `/${pathBuilder(getPaths as string, pathName)}`;
return setSearchParams((p) => ({ ...p, path: newPath }), {
const currentPaths = data?.map((p) => p.name).join(pathSlashOS);
const newPath = `${pathSlashOS}${pathBuilder(currentPaths as string, pathName)}`;
setSearchParams((params) => ({ ...params, path: newPath }), { replace: true });
} else {
const newPath = pathBuilder(path as string, pathName);
setSearchParams((params) => ({ ...params, path: index === 0 ? '' : newPath }), {
replace: true
});
}
const newPath = pathBuilder(path as string, pathName);
setSearchParams((p) => ({ ...p, path: index === 0 ? '' : newPath }), {
replace: true
});
};
const formatPathData = useCallback(() => {
if (!pathInfo) return;
const pathNameLocationName = (explorerContext.parent?.type === 'Location' &&
explorerContext.parent?.location.name) as string;
const splitPaths = pathInfo.split('/');
const splitPaths = pathInfo.replaceAll('/', pathSlashOS).split(pathSlashOS); //replace all '/' with '\' for windows
const startIndex = isEphemeralLocation ? 1 : splitPaths.indexOf(pathNameLocationName);
const updatedPathData = splitPaths.slice(startIndex);
const updatedData = updatedPathData.map((path) => ({
kind: 'Folder',