small misc improvements

stumpapp · Dec 26, 2024 · 82b20f4 · 82b20f4
1 parent 7726a7d
commit 82b20f4
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 8 deletions.
diff --git a/packages/browser/src/components/filters/FilterHeader.tsx b/packages/browser/src/components/filters/FilterHeader.tsx
@@ -1,6 +1,8 @@
 import { cn, useSticky } from '@stump/components'
 import { useMediaMatch } from 'rooks'
 
+import { usePreferences } from '@/hooks/usePreferences'
+
 import { useFilterContext } from './context'
 import Search from './Search'
 
@@ -43,7 +45,13 @@ export default function FilterHeader({
 	navOffset,
 }: Props) {
 	const isMobile = useMediaMatch('(max-width: 768px)')
-	const { ref, isSticky } = useSticky({ extraOffset: isMobile ? 56 : 0 })
+	const {
+		preferences: { primary_navigation_mode },
+	} = usePreferences()
+	const { ref, isSticky } = useSticky<HTMLDivElement>({
+		extraOffset: isMobile || primary_navigation_mode === 'TOPBAR' ? 56 : 0,
+	})
+
 	const { filters, setFilter, removeFilter } = useFilterContext()
 
 	return (

diff --git a/packages/browser/src/components/navigation/topbar/sections/library/LibraryNavigationItem.tsx b/packages/browser/src/components/navigation/topbar/sections/library/LibraryNavigationItem.tsx
@@ -84,7 +84,7 @@ export default function LibraryNavigationItem({
 			<NavigationMenu.Content>
 				<div
 					style={{ width }}
-					className={cn('flex min-h-[150px] gap-3 p-2', {
+					className={cn('flex min-h-[150px] min-w-[300px] gap-3 p-2', {
 						'md:w-[400px] lg:w-[500px]': !width,
 						'md:w-[300px] lg:w-[350px]': !width && !libraries?.length,
 					})}
@@ -102,19 +102,19 @@ export default function LibraryNavigationItem({
 									<TopBarLinkListItem
 										to={paths.libraryCreate()}
 										isActive={location.pathname.startsWith(paths.libraryCreate())}
-										className="justify-center self-end border border-dashed border-edge-subtle"
+										className="justify-center self-end border border-dashed border-edge-subtle p-1"
 									>
-										<span className="line-clamp-1 font-medium">Create library</span>
+										<span className="line-clamp-1 text-sm font-medium">Create library</span>
 									</TopBarLinkListItem>
 								)}
 
 								{showLinkToAll && (
 									<TopBarLinkListItem
 										to={paths.libraries()}
 										isActive={location.pathname.startsWith(paths.libraries())}
-										className="justify-center self-end border border-dashed border-edge-subtle"
+										className="justify-center self-end border border-dashed border-edge-subtle p-1"
 									>
-										<span className="line-clamp-1 font-medium">See all</span>
+										<span className="line-clamp-1 text-sm font-medium">See all</span>
 									</TopBarLinkListItem>
 								)}
 							</div>

diff --git a/packages/browser/src/scenes/library/LibraryNavigation.tsx b/packages/browser/src/scenes/library/LibraryNavigation.tsx
@@ -29,7 +29,10 @@ export default function LibraryNavigation() {
 		fetchConfig: checkPermission('file:upload'),
 	})
 	const { prefetch: prefetchSeries } = usePrefetchLibrarySeries({ id })
-	const { ref, isSticky } = useSticky<HTMLDivElement>({ extraOffset: isMobile ? 56 : 0 })
+
+	const { ref, isSticky } = useSticky<HTMLDivElement>({
+		extraOffset: isMobile || primary_navigation_mode === 'TOPBAR' ? 56 : 0,
+	})
 
 	const canAccessFiles = checkPermission('file:explorer')
 	const tabs = useMemo(

diff --git a/packages/client/src/queries/filesystem.ts b/packages/client/src/queries/filesystem.ts
@@ -41,7 +41,7 @@ export const usePrefetchLibraryFiles = ({ path, fetchConfig }: PrefetchFileParam
 					? [queryClient.prefetchQuery([sdk.upload.keys.config], () => sdk.upload.config())]
 					: []),
 			]),
-		[sdk, path],
+		[sdk, path, fetchConfig],
 	)
 
 	return { prefetch }