hunk.code_window: import Skeleton from 'react-loading-skeleton';
   import 'react-loading-skeleton/dist/skeleton.css';
   import { byteSize, Statistics, useLibraryContext, useLibraryQuery } from '@sd/client';
   import { Tooltip } from '@sd/ui';
   import { useCounter } from '~/hooks';
  
hunk.labels: keep keep keep add keep keep keep
hunk.after_edit: import { useEffect, useState } from 'react';
  
hunk.file_path: interface/app/$libraryId/overview/Statistics.tsx
hunk.type: add
file: import { useKey } from 'rooks';
  import type { ExplorerItem } from '@sd/client';
  import { dialogManager } from '@sd/ui';
  import DeleteDialog from '~/app/$libraryId/Explorer/FilePath/DeleteDialog';
  
  export const useKeyDeleteFile = (selectedItems: Set<ExplorerItem>, locationId?: number | null) => {
  	return useKey('Delete', (e) => {
  		e.preventDefault();
  
  		if (!locationId) return;
  
  		const pathIds: number[] = [];
  
  		for (const item of selectedItems) {
  			if (item.type === 'Path') pathIds.push(item.item.id);
  		}
  
  		dialogManager.create((dp) => (
  			<DeleteDialog {...dp} locationId={locationId} pathIds={pathIds} />
  		));
  	});
  };
  