lee/Recordly
1
0
Fork 0
mirror of https://github.com/webadderallorg/Recordly.git synced 2026-09-24 23:05:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

del: unused components/css like Track, SubRow..

Browse Source
This commit is contained in:
Alan Trebugeais
2026-05-08 12:27:13 +02:00
parent 15fe1ad7ff
commit 5cd9f3c8c0
5 changed files with 10 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/video-editor/timeline/Item.module.css
View File
src/components/video-editor/timeline/Subrow.tsx
-17
View File
@@ -1,17 +0,0 @@
import { cn } from "@/lib/utils";
interface SubrowProps {
children: React.ReactNode;
}
export default function Subrow({ children }: SubrowProps) {
return (
<div
className={cn(
"flex items-center min-h-[24px] gap-1 px-1.5 py-0 bg-transparent rounded-md text-foreground/60",
)}
>
{children}
</div>
);
}
src/components/video-editor/timeline/Timeline.module.css
-28
View File
@@ -1,28 +0,0 @@
.scrollArea {
scrollbar-width: thin;
scrollbar-color: hsl(var(--foreground) / 0.25) transparent;
}
.scrollArea::-webkit-scrollbar {
width: 8px;
height: 8px;
background-color: transparent;
}
.scrollArea::-webkit-scrollbar-corner {
background-color: transparent;
}
.scrollArea::-webkit-scrollbar-thumb {
background-color: hsl(var(--foreground) / 0.25);
border-radius: 10px;
border: 2px solid hsl(var(--editor-surface));
}
.scrollArea::-webkit-scrollbar-thumb:hover {
background-color: hsl(var(--foreground) / 0.35);
}
.scrollArea::-webkit-scrollbar-thumb:active {
background-color: hsl(var(--foreground) / 0.45);
}
src/components/video-editor/timeline/Track.tsx
-39
View File
@@ -1,39 +0,0 @@
import type { RowDefinition } from "dnd-timeline";
import { useRow } from "dnd-timeline";
import type { CSSProperties, ReactNode } from "react";
interface TrackProps extends RowDefinition {
children: ReactNode;
hint?: string;
isEmpty?: boolean;
trackStyle?: CSSProperties;
}
export default function Track({ id, children, hint, isEmpty, trackStyle }: TrackProps) {
const { setNodeRef, rowWrapperStyle, rowStyle, rowSidebarStyle, setSidebarRef } = useRow({
id,
});
return (
<div
className="group/track flex-1 overflow-hidden bg-transparent"
style={{ ...rowWrapperStyle, marginBottom: 0, minHeight: 44, ...trackStyle }}
>
<div ref={setSidebarRef} style={rowSidebarStyle} />
<div
ref={setNodeRef}
className="relative flex-1 overflow-hidden"
style={{ ...rowStyle, minHeight: 44 }}
>
{isEmpty && hint ? (
<div className="pointer-events-none absolute inset-0 z-10 flex items-center justify-center select-none">
<span className="rounded-full border border-foreground/[0.05] bg-foreground/[0.02] px-2 py-0.5 text-[9px] font-medium tracking-[0.04em] text-foreground/30 uppercase">
{hint}
</span>
</div>
) : null}
{children}
</div>
</div>
);
}
src/components/video-editor/timeline/components/viewport/TimelineCanvas.tsx
+10 -18
View File
@@ -8,6 +8,7 @@ import {
TIMELINE_AXIS_HEIGHT_PX,
} from "../../timelineLayout";
import type { AudioPeaksData } from "../../useAudioPeaks";
import { isAnnotationTrackRowId, isAudioTrackRowId } from "../../core/rows";
import type { TimelineRenderItem } from "../../model/timelineModel";
import TimelineAxis from "../axis/TimelineAxis";
import PlaybackCursor from "../playhead/PlaybackCursor";
@@ -21,17 +22,13 @@ interface TimelineCanvasProps {
onSeek?: (time: number) => void;
canPlaceZoomAtMs?: (startMs: number) => boolean;
onSelectZoom?: (id: string | null) => void;
onSelectTrim?: (id: string | null) => void;
onSelectClip?: (id: string | null) => void;
onSelectAnnotation?: (id: string | null) => void;
onSelectSpeed?: (id: string | null) => void;
onSelectAudio?: (id: string | null) => void;
onAddZoomAtMs?: (startMs: number) => void;
selectedZoomId: string | null;
selectedTrimId?: string | null;
selectedClipId?: string | null;
selectedAnnotationId?: string | null;
selectedSpeedId?: string | null;
selectedAudioId?: string | null;
selectAllBlocksActive?: boolean;
onClearBlockSelection?: () => void;
@@ -47,16 +44,12 @@ export default function TimelineCanvas({
onAddZoomAtMs,
canPlaceZoomAtMs,
onSelectZoom,
onSelectTrim,
onSelectClip,
onSelectAnnotation,
onSelectSpeed,
onSelectAudio,
selectedZoomId,
selectedTrimId: _selectedTrimId,
selectedClipId,
selectedAnnotationId,
selectedSpeedId: _selectedSpeedId,
selectedAudioId,
selectAllBlocksActive = false,
onClearBlockSelection,
@@ -80,10 +73,8 @@ export default function TimelineCanvas({
if (!onSeek || videoDurationMs <= 0) return;
onSelectZoom?.(null);
onSelectTrim?.(null);
onSelectClip?.(null);
onSelectAnnotation?.(null);
onSelectSpeed?.(null);
onSelectAudio?.(null);
onClearBlockSelection?.();
@@ -97,10 +88,8 @@ export default function TimelineCanvas({
[
onSeek,
onSelectZoom,
onSelectTrim,
onSelectClip,
onSelectAnnotation,
onSelectSpeed,
onSelectAudio,
onClearBlockSelection,
videoDurationMs,
@@ -110,12 +99,15 @@ export default function TimelineCanvas({
],
);
const audioRowIds = useMemo(
() => new Set(items.map((item) => item.rowId)).size,
[items],
);
const timelineRowCount = Math.max(2, audioRowIds);
const timelineRowCount = useMemo(() => {
const annotationRowIds = new Set<string>();
const audioRowIds = new Set<string>();
for (const item of items) {
if (isAnnotationTrackRowId(item.rowId)) annotationRowIds.add(item.rowId);
if (isAudioTrackRowId(item.rowId)) audioRowIds.add(item.rowId);
}
return 2 + annotationRowIds.size + audioRowIds.size;
}, [items]);
const timelineRowsMinHeightPx = getTimelineRowsMinHeightPx(timelineRowCount);
const timelineContentMinHeightPx = getTimelineContentMinHeightPx(timelineRowCount);
const timelineViewportStretchFactor = getTimelineViewportStretchFactor(timelineRowCount);