fix: scroll in media panel

This commit is contained in:
Maze Winther
2025-07-26 11:50:12 +02:00
parent 7d0113d366
commit ae94056952
2 changed files with 57 additions and 54 deletions
@@ -46,9 +46,9 @@ export function MediaPanel() {
};
return (
<div className="h-full flex flex-col bg-panel rounded-sm overflow-scroll">
<div className="h-full flex flex-col bg-panel rounded-sm">
<TabBar />
<div className="flex-1">{viewMap[activeTab]}</div>
<div className="flex-1 overflow-y-auto">{viewMap[activeTab]}</div>
</div>
);
}
@@ -25,6 +25,7 @@ import {
import { DraggableMediaItem } from "@/components/ui/draggable-item";
import { useProjectStore } from "@/stores/project-store";
import { useTimelineStore } from "@/stores/timeline-store";
import { ScrollArea } from "@/components/ui/scroll-area";
export function MediaView() {
const { mediaItems, addMediaItem, removeMediaItem } = useMediaStore();
@@ -204,7 +205,7 @@ export function MediaView() {
className={`h-full flex flex-col gap-1 transition-colors relative ${isDragOver ? "bg-accent/30" : ""}`}
{...dragProps}
>
<div className="p-3 pb-2">
<div className="p-3 pb-2 bg-panel">
{/* Search and filter controls */}
<div className="flex gap-2">
<Select value={mediaFilter} onValueChange={setMediaFilter}>
@@ -241,7 +242,8 @@ export function MediaView() {
</div>
</div>
<div className="flex-1 overflow-y-auto p-3 pt-0">
<ScrollArea className="h-full">
<div className="flex-1 p-3 pt-0">
{isDragOver || filteredMediaItems.length === 0 ? (
<MediaDragOverlay
isVisible={true}
@@ -292,6 +294,7 @@ export function MediaView() {
</div>
)}
</div>
</ScrollArea>
</div>
</>
);