feat: sync codebase with latest radix pattern

src/app/(modules)/upload/components/CreateUploadDialog.tsx

@@ -89,19 +89,17 @@ export function CreateUploadDialog({
   return (
     <Dialog open={open} onOpenChange={handleOpenChange}>
       <DialogContent
-        className="flex max-h-[calc(100vh-2rem)] flex-col gap-0 p-0 sm:max-w-5xl"
+        className="max-h-[calc(100vh-2rem)] overflow-y-auto sm:max-w-5xl"
         onOpenAutoFocus={(event) => event.preventDefault()}
       >
-        <DialogHeader className="shrink-0 border-b px-6 py-4 pr-12">
-          <DialogTitle className="text-lg leading-none font-semibold tracking-tight">
-            Upload Video
-          </DialogTitle>
+        <DialogHeader>
+          <DialogTitle>Upload Video</DialogTitle>
           <DialogDescription>
             Configure location and upload road inspection data.
           </DialogDescription>
         </DialogHeader>
 
-        <div className="min-h-0 flex-1 space-y-5 overflow-y-auto px-6 py-4">
+        <div className="space-y-5">
           <LocationSection
             value={session}
             onChange={setSession}
@@ -136,7 +134,7 @@ export function CreateUploadDialog({
           ) : null}
         </div>
 
-        <DialogFooter className="shrink-0 border-t px-6 py-4">
+        <DialogFooter>
           <Button
             type="button"
             variant="outline"

src/app/(modules)/upload/components/UploadVideoDialog.tsx

@@ -1,44 +0,0 @@
-'use client';
-
-import { ProtectedVideoPlayer } from '@/components/media/ProtectedVideoPlayer';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-} from '@/components/ui/dialog';
-import type { UploadListItem } from '@/types';
-
-interface UploadVideoDialogProps {
-  upload: UploadListItem | null;
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-}
-
-export function UploadVideoDialog({
-  upload,
-  open,
-  onOpenChange,
-}: UploadVideoDialogProps) {
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="gap-3 p-3 sm:max-w-5xl sm:p-4">
-        <DialogHeader className="min-w-0 pr-8">
-          <DialogTitle className="truncate text-left text-base">
-            Video Preview
-          </DialogTitle>
-          <DialogDescription className="truncate text-xs">
-            {upload?.video_name ?? 'Uploaded video'}
-          </DialogDescription>
-        </DialogHeader>
-
-        <ProtectedVideoPlayer
-          url={open ? upload?.raw_video_url : undefined}
-          className="rounded-lg"
-          unavailableTitle="Video preview unavailable"
-        />
-      </DialogContent>
-    </Dialog>
-  );
-}

src/app/(modules)/upload/components/VideoPreviewDialog.tsx

@@ -0,0 +1,33 @@
+'use client';
+
+import { ProtectedVideoPlayer } from '@/components/media/ProtectedVideoPlayer';
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
+import type { UploadListItem } from '@/types';
+
+interface VideoPreviewDialogProps {
+  upload: UploadListItem | null;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+
+export function VideoPreviewDialog({
+  upload,
+  open,
+  onOpenChange,
+}: VideoPreviewDialogProps) {
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-5xl">
+        <DialogHeader>
+          <DialogTitle>Video Preview</DialogTitle>
+        </DialogHeader>
+
+        <ProtectedVideoPlayer
+          url={open ? upload?.raw_video_url : undefined}
+          className="rounded-lg"
+          unavailableTitle="Video preview unavailable"
+        />
+      </DialogContent>
+    </Dialog>
+  );
+}

src/app/(modules)/upload/page.tsx

@@ -10,7 +10,7 @@ import type { UploadListItem } from '@/types';
 import { CreateUploadDialog } from './components/CreateUploadDialog';
 import { useUploadListColumns } from './components/UploadListColumns';
 import { UploadTable } from './components/UploadTable';
-import { UploadVideoDialog } from './components/UploadVideoDialog';
+import { VideoPreviewDialog } from './components/VideoPreviewDialog';
 import { useUploadFilters } from './hooks/useUploadFilters';
 import { useUploadListEvents } from './hooks/useUploadListEvents';
 import { useUploadsQuery } from './hooks/useUploadQueries';
@@ -56,7 +56,7 @@ export default function UploadPage() {
       </main>
 
       <CreateUploadDialog open={isCreateOpen} onOpenChange={setIsCreateOpen} />
-      <UploadVideoDialog
+      <VideoPreviewDialog
         upload={videoUpload}
         open={Boolean(videoUpload)}
         onOpenChange={(open) => {