applications/drive/src/app/store/_views/useFileNavigation.tsx

   1 import { useEffect } from 'react';
   2
   3 import { useLoading } from '@proton/hooks';
   4 import { isPreviewAvailable } from '@proton/shared/lib/helpers/preview';
   5
   6 import { logError } from '../../utils/errorHandling';
   7 import { useLinksListing } from '../_links';
   8 import { usePublicLinksListingProvider } from '../_links/useLinksListing/usePublicLinksListing';
   9 import { useUserSettings } from '../_settings';
  10 import type { UserSortParams } from '../_settings/sorting';
  11 import { useAbortSignal, useControlledSorting, useMemoArrayNoMatterTheOrder } from './utils';
  12 import type { SortParams } from './utils/useSorting';
  13
  14 export function useFileViewNavigation(
  15     useNavigation: boolean,
  16     shareId: string,
  17     parentLinkId?: string,
  18     currentLinkId?: string
  19 ) {
  20     const { sort } = useUserSettings();
  21     const linksListing = useLinksListing();
  22     return useFileViewNavigationBase(useNavigation, shareId, linksListing, sort, parentLinkId, currentLinkId);
  23 }
  24
  25 export function usePublicFileViewNavigation(
  26     useNavigation: boolean,
  27     shareId: string,
  28     sortParams: SortParams,
  29     parentLinkId?: string,
  30     currentLinkId?: string
  31 ) {
  32     const linksListing = usePublicLinksListingProvider();
  33     return useFileViewNavigationBase(useNavigation, shareId, linksListing, sortParams, parentLinkId, currentLinkId);
  34 }
  35
  36 function useFileViewNavigationBase(
  37     useNavigation: boolean,
  38     shareId: string,
  39     linksListing: ReturnType<typeof useLinksListing | typeof usePublicLinksListingProvider>,
  40     sort: UserSortParams | SortParams,
  41     parentLinkId?: string,
  42     currentLinkId?: string
  43 ) {
  44     const [isLoading, withLoading] = useLoading(true);
  45
  46     const { getCachedChildren, loadChildren } = linksListing;
  47
  48     const abortSignal = useAbortSignal([shareId, parentLinkId]);
  49     const { links: children, isDecrypting } = parentLinkId
  50         ? getCachedChildren(abortSignal, shareId, parentLinkId)
  51         : { links: [], isDecrypting: false };
  52     const cachedChildren = useMemoArrayNoMatterTheOrder(children);
  53     const { sortedList } = useControlledSorting(useNavigation ? cachedChildren : [], sort, async () => {});
  54     const linksAvailableForPreview = sortedList.filter(({ mimeType, size }) => isPreviewAvailable(mimeType, size));
  55
  56     useEffect(() => {
  57         if (!useNavigation || !parentLinkId) {
  58             return;
  59         }
  60
  61         const ac = new AbortController();
  62         withLoading(loadChildren(ac.signal, shareId, parentLinkId)).catch(logError);
  63         return () => {
  64             ac.abort();
  65         };
  66     }, [useNavigation, parentLinkId]);
  67
  68     const index = linksAvailableForPreview.findIndex(({ linkId }) => linkId === currentLinkId);
  69
  70     if (!useNavigation || isLoading || isDecrypting || index === -1) {
  71         return;
  72     }
  73
  74     return {
  75         current: index + 1,
  76         total: linksAvailableForPreview.length,
  77         nextLinkId: linksAvailableForPreview[index < linksAvailableForPreview.length ? index + 1 : 0]?.linkId,
  78         prevLinkId: linksAvailableForPreview[index > 0 ? index - 1 : linksAvailableForPreview.length - 1]?.linkId,
  79     };
  80 }