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,38 +602,40 @@ 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 && (
-            <Tooltip>
+            <>
-              <TooltipTrigger asChild>
+              <div className="w-px h-6 bg-border mx-1" />
-                <Button
+              <Tooltip>
-                  variant="outline"
+                <TooltipTrigger asChild>
-                  size="sm"
+                  <Button
-                  onClick={() => {
+                    variant="outline"
-                    const trackId = addTrack("video");
+                    size="sm"
-                    addClipToTrack(trackId, {
+                    onClick={() => {
-                      mediaId: "test",
+                      const trackId = addTrack("video");
-                      name: "Test Clip",
+                      addClipToTrack(trackId, {
-                      duration: 5,
+                        mediaId: "test",
-                      startTime: 0,
+                        name: "Test Clip",
-                      trimStart: 0,
+                        duration: 5,
-                      trimEnd: 0,
+                        startTime: 0,
-                    });
+                        trimStart: 0,
-                  }}
+                        trimEnd: 0,
-                  className="text-xs"
+                      });
-                >
+                    }}
-                  Add Test Clip
+                    className="text-xs"
-                </Button>
+                  >
-              </TooltipTrigger>
+                    Add Test Clip
-              <TooltipContent>Add a test clip to try playback</TooltipContent>
+                  </Button>
-            </Tooltip>
+                </TooltipTrigger>
+                <TooltipContent>Add a test clip to try playback</TooltipContent>
+              </Tooltip>
+            </>
           )}
 
           <div className="w-px h-6 bg-border mx-1" />