Collapse folders with only one child folder (#1951)

Collapses a folder in code view which only has another folder as its only child. This lets you access a sub-folder which has content directly instead of navigating down the folder tree by clicking every folder separately.

Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
This commit is contained in:
Matthias Thieroff
2022-02-15 10:59:32 +01:00
committed by GitHub
parent 8d9c18c23c
commit 44f0046f25
13 changed files with 572 additions and 127 deletions

View File

@@ -28,17 +28,20 @@ import * as urls from "./urls";
import { useInfiniteQuery } from "react-query";
import { repoQueryKey } from "./keys";
import { useEffect } from "react";
import { createQueryString } from "./utils";
export type UseSourcesOptions = {
revision?: string;
path?: string;
refetchPartialInterval?: number;
enabled?: boolean;
collapse?: boolean;
};
const UseSourcesDefaultOptions: UseSourcesOptions = {
enabled: true,
refetchPartialInterval: 3000,
collapse: true
};
export const useSources = (repository: Repository, opts: UseSourcesOptions = UseSourcesDefaultOptions) => {
@@ -48,7 +51,7 @@ export const useSources = (repository: Repository, opts: UseSourcesOptions = Use
};
const link = createSourcesLink(repository, options);
const { isLoading, error, data, isFetchingNextPage, fetchNextPage, refetch } = useInfiniteQuery<File, Error, File>(
repoQueryKey(repository, "sources", options.revision || "", options.path || ""),
repoQueryKey(repository, "sources", options.revision || "", options.path || "", options.collapse ? "collapse" : ""),
({ pageParam }) => {
return apiClient.get(pageParam || link).then((response) => response.json());
},
@@ -93,6 +96,9 @@ const createSourcesLink = (repository: Repository, options: UseSourcesOptions) =
link = urls.concat(link, options.path);
}
}
if (options.collapse) {
return `${link}?${createQueryString({ collapse: "true" })}`;
}
return link;
};