Merge branch 'main' of github.com:ga1az/OpenCut into fix-docker-setup

apps/web/drizzle.config.ts

@@ -13,7 +13,7 @@ if (!process.env.DATABASE_URL) {
 }
 
 export default {
-  schema: "./src/lib/db/schema.ts",
+  schema: "../../packages/db/src/schema.ts",
   dialect: "postgresql",
   dbCredentials: {
     url: process.env.DATABASE_URL,

apps/web/src/app/layout.tsx

@@ -16,6 +16,35 @@ export const metadata: Metadata = {
   title: "OpenCut",
   description:
     "A simple but powerful video editor that gets the job done. In your browser.",
+  openGraph: {
+    title: "OpenCut",
+    description:
+      "A simple but powerful video editor that gets the job done. In your browser.",
+    url: "https://opencut.app",
+    siteName: "OpenCut",
+    locale: "en_US",
+    type: "website",
+    images: [
+      {
+        url: "https://opencut.app/opengraph-image.jpg",
+        width: 1200,
+        height: 630,
+        alt: "OpenCut",
+      },
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "OpenCut",
+    description:
+      "A simple but powerful video editor that gets the job done. In your browser.",
+    creator: "@opencutapp",
+    images: ["/opengraph-image.jpg"],
+  },
+  robots: {
+    index: true,
+    follow: true,
+  },
 };
 
 export default function RootLayout({

apps/web/src/components/editor/timeline.tsx

@@ -221,7 +221,7 @@ export function Timeline() {
         const clipLeft = clip.startTime * 50 * zoomLevel;
         const clipTop = trackIdx * 60;
         const clipBottom = clipTop + 60;
-        const clipRight = clipLeft + clipWidth;
+        const clipRight = clipLeft + 60; // Set a fixed width for time display
         if (
           bx1 < clipRight &&
           bx2 > clipLeft &&
@@ -602,15 +602,16 @@ export function Timeline() {
           <div className="w-px h-6 bg-border mx-1" />
 
           {/* Time Display */}
-          <div className="text-xs text-muted-foreground font-mono px-2">
+          <div className="text-xs text-muted-foreground font-mono px-2"
-            {Math.floor(currentTime * 10) / 10}s /{" "}
+            style={{ minWidth: '18ch', textAlign: 'center' }}
-            {Math.floor(duration * 10) / 10}s
+            >
+              {currentTime.toFixed(1)}s / {duration.toFixed(1)}s
           </div>
 
-          <div className="w-px h-6 bg-border mx-1" />
-
           {/* Test Clip Button - for debugging */}
           {tracks.length === 0 && (
+            <>
+              <div className="w-px h-6 bg-border mx-1" />
               <Tooltip>
                 <TooltipTrigger asChild>
                   <Button
@@ -634,6 +635,7 @@ export function Timeline() {
                 </TooltipTrigger>
                 <TooltipContent>Add a test clip to try playback</TooltipContent>
               </Tooltip>
+            </>
           )}
 
           <div className="w-px h-6 bg-border mx-1" />