From 9aa2832530003fc76c3764ec6b97151eb0a08253 Mon Sep 17 00:00:00 2001
From: Jamie Pine <ijamespine@me.com>
Date: Fri, 24 Feb 2023 22:26:59 -0800
Subject: [PATCH] [BUGFIX] Only show list view header on list view

---
 .../components/explorer/VirtualizedList.tsx   | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/interface/src/components/explorer/VirtualizedList.tsx b/packages/interface/src/components/explorer/VirtualizedList.tsx
index f641c76ab..c3dfc0408 100644
--- a/packages/interface/src/components/explorer/VirtualizedList.tsx
+++ b/packages/interface/src/components/explorer/VirtualizedList.tsx
@@ -94,6 +94,8 @@ export const VirtualizedList = memo(({ data, context, onScroll }: Props) => {
 			getExplorerStore().selectedRowIndex = explorerStore.selectedRowIndex + 1;
 	});
 
+	const layoutMode = explorerStore.layoutMode;
+
 	return (
 		<div style={{ marginTop: -TOP_BAR_HEIGHT }} className="w-full cursor-default pl-4">
 			<div
@@ -105,23 +107,24 @@ export const VirtualizedList = memo(({ data, context, onScroll }: Props) => {
 			>
 				<div
 					ref={innerRef}
+					className="relative w-full"
 					style={{
 						height: rowVirtualizer.getTotalSize(),
-						marginTop: TOP_BAR_HEIGHT + LIST_VIEW_HEADER_HEIGHT
+						marginTop:
+							layoutMode === 'list' ? TOP_BAR_HEIGHT + LIST_VIEW_HEADER_HEIGHT : TOP_BAR_HEIGHT
 					}}
-					className="relative w-full"
 				>
-					<ListViewHeader />
+					{layoutMode === 'list' && <ListViewHeader />}
 					{rowVirtualizer.getVirtualItems().map((virtualRow) => (
 						<div
+							key={virtualRow.key}
+							className="absolute top-0 left-0 flex w-full"
 							style={{
-								height: `${virtualRow.size}px`,
+								height: virtualRow.size,
 								transform: `translateY(${virtualRow.start}px)`
 							}}
-							className="absolute top-0 left-0 flex w-full"
-							key={virtualRow.key}
 						>
-							{explorerStore.layoutMode === 'list' && (
+							{layoutMode === 'list' && (
 								<WrappedItem
 									kind="list"
 									isSelected={explorerStore.selectedRowIndex === virtualRow.index}
@@ -129,7 +132,7 @@ export const VirtualizedList = memo(({ data, context, onScroll }: Props) => {
 									item={data[virtualRow.index]!}
 								/>
 							)}
-							{explorerStore.layoutMode === 'grid' &&
+							{layoutMode === 'grid' &&
 								[...Array(amountOfColumns)].map((_, i) => {
 									const index = virtualRow.index * amountOfColumns + i;
 									const item = data[index];