Merge branch 'canary' into canary-stable

sr2echa · web-flow · commit d3d95e898845 · 2025-08-27T23:00:27.000+05:30
diff --git a/app/components/media/TextEditor.tsx b/app/components/media/TextEditor.tsx
@@ -11,6 +11,7 @@ import {
   AlignCenter,
   AlignRight,
   Bold,
+  ChevronDown,
   Type,
   Plus,
   ChevronDown,
diff --git a/app/components/timeline/MediaBin.tsx b/app/components/timeline/MediaBin.tsx
@@ -127,7 +127,7 @@ const AudioPreview = ({ src }: { src: string }) => {
     window.addEventListener('pointerup', onUp, { once: true });
     return () => {
       window.removeEventListener('pointermove', onMove);
-      window.removeEventListener('pointerup', onUp);
+      window.removeEventListener('pointerup', onUp as EventListener);
     };
   }, [isScrubbing, seekFromClientX]);
 
diff --git a/app/components/ui/KimuLogo.tsx b/app/components/ui/KimuLogo.tsx
@@ -27,7 +27,7 @@ export const KimuLogo: React.FC<KimuLogoProps> = ({
           ? " animate-float-icon transition-all duration-700"
           : "")
       }
-      style={{ color, opacity, ...(style) }}
+      style={{ color, opacity, ...(style as React.CSSProperties) }}
       {...rest}
       aria-label="Kimu Logo"
     >
diff --git a/app/components/ui/ProfileMenu.tsx b/app/components/ui/ProfileMenu.tsx
@@ -44,7 +44,7 @@ export function ProfileMenu({
           setLimitBytes(Number.isFinite(l) ? l : 2 * 1024 * 1024 * 1024);
         }
       } catch {
-        // ignore
+        console.error('Storage fetch failed');
       }
     })();
     return () => {
diff --git a/app/components/ui/text-hover-effect.tsx b/app/components/ui/text-hover-effect.tsx
@@ -1,5 +1,5 @@
 import React, { useRef, useEffect, useState } from "react";
-import { motion } from "framer-motion";
+import { motion, type TargetAndTransition } from "framer-motion";
 
 export const TextHoverEffect = ({
   text,
@@ -56,7 +56,7 @@ export const TextHoverEffect = ({
           gradientUnits="userSpaceOnUse"
           r="20%"
           initial={{ cx: "50%", cy: "50%" }}
-          animate={maskPosition}
+          animate={maskPosition as TargetAndTransition}
           transition={{ duration: duration ?? 0, ease: "easeOut" }}
         >
           <stop offset="0%" stopColor="white" />
diff --git a/app/hooks/useMediaBin.ts b/app/hooks/useMediaBin.ts
@@ -336,14 +336,17 @@ export const useMediaBin = (handleDeleteScrubbersByMediaBinId: (mediaBinId: stri
   const setTextItems = useCallback((textItems: MediaBinItem[]) => {
     setMediaBinItems(prev => {
       const withoutText = prev.filter(i => i.mediaType !== 'text');
-      return [...withoutText, ...textItems.map(t => ({
-        ...t,
-        mediaType: 'text',
-        mediaUrlLocal: null,
-        mediaUrlRemote: null,
-        isUploading: false,
-        uploadProgress: null,
-      }) as MediaBinItem)];
+      return [
+        ...withoutText,
+        ...textItems.map((t): MediaBinItem => ({
+          ...t,
+          mediaType: 'text' as const,
+          mediaUrlLocal: null,
+          mediaUrlRemote: null,
+          isUploading: false,
+          uploadProgress: null,
+        })),
+      ];
     });
   }, []);
 
diff --git a/app/lib/migrate.ts b/app/lib/migrate.ts
@@ -11,7 +11,9 @@ async function run() {
     u.search = "";
     connectionString = u.toString();
   } catch {
-    // ignore
+    console.error("Invalid database URL");
+    process.exitCode = 1;
+    return;
   }
 
   const pool = new Pool({ connectionString, ssl: { rejectUnauthorized: false } });
diff --git a/app/lib/projects.repo.ts b/app/lib/projects.repo.ts
@@ -12,7 +12,7 @@ function getPool(): Pool {
       u.search = "";
       connectionString = u.toString();
     } catch {
-      // Ignore URL parsing errors, use raw connection string
+      throw new Error("Invalid database URL");
     }
     pool = new Pool({ connectionString, ssl: { rejectUnauthorized: false } });
   }
diff --git a/app/lib/timeline.store.ts b/app/lib/timeline.store.ts
@@ -1,5 +1,6 @@
 import fs from "fs";
 import path from "path";
+import type { MediaBinItem, TimelineState } from "~/components/timeline/types";
 
 const TIMELINE_DIR = process.env.TIMELINE_DIR || path.resolve("project_data");
 
@@ -13,11 +14,11 @@ function getFilePath(projectId: string): string {
 }
 
 export type ProjectStateFile = {
-  timeline: any;
-  textBinItems: any[];
+  timeline: TimelineState;
+  textBinItems: MediaBinItem[];
 };
 
-function defaultTimeline(): any {
+function defaultTimeline(): TimelineState {
   return {
     tracks: [
       { id: "track-1", scrubbers: [], transitions: [] },
@@ -52,12 +53,12 @@ export async function saveProjectState(projectId: string, state: ProjectStateFil
 }
 
 // Backwards-compatible helpers
-export async function loadTimeline(projectId: string): Promise<any> {
+export async function loadTimeline(projectId: string): Promise<TimelineState> {
   const state = await loadProjectState(projectId);
   return state.timeline;
 }
 
-export async function saveTimeline(projectId: string, timeline: any): Promise<void> {
+export async function saveTimeline(projectId: string, timeline: TimelineState): Promise<void> {
   const prev = await loadProjectState(projectId);
   await saveProjectState(projectId, { timeline, textBinItems: prev.textBinItems });
 }
diff --git a/app/root.tsx b/app/root.tsx
@@ -11,16 +11,16 @@ import {
 } from "react-router";
 import { useEffect, useState } from "react";
 
-import type { Route } from "./+types/root";
 import "./app.css";
 import { Toaster } from "./components/ui/sonner";
 import { ThemeProvider } from "./components/ui/ThemeProvider";
 import { auth } from "~/lib/auth.server";
 import { Navbar } from "~/components/ui/Navbar";
 import { MarketingFooter } from "~/components/ui/MarketingFooter";
+import type { User } from "better-auth";
 
 
-export const links: Route.LinksFunction = () => [
+export const links = () => [
   { rel: "icon", href: "/favicon.png" },
   { rel: "preconnect", href: "https://fonts.googleapis.com" },
   {
@@ -34,7 +34,7 @@ export const links: Route.LinksFunction = () => [
   },
 ];
 
-export async function loader({ request }: Route.LoaderArgs) {
+export async function loader({ request }: { request: Request }) {
   try {
     // @ts-ignore
     const session = await auth.api?.getSession?.({ headers: request.headers });
@@ -68,7 +68,7 @@ export function Layout({ children }: { children: React.ReactNode }) {
 }
 
 export default function App() {
-  const data = useLoaderData<typeof loader>() as { user: any };
+  const data = useLoaderData<typeof loader>() as { user: User };
   const location = useLocation();
   const matches = useMatches();
   const [showBrand, setShowBrand] = useState(true);
@@ -114,7 +114,7 @@ export default function App() {
   );
 }
 
-export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+export function ErrorBoundary({ error }: { error: Error }) {
   let message = "Oops!";
   let details = "An unexpected error occurred.";
   let stack: string | undefined;
diff --git a/app/routes/api.assets.$.tsx b/app/routes/api.assets.$.tsx
@@ -1,4 +1,3 @@
-import type { Route } from "./+types/api.assets.$";
 import { auth } from "~/lib/auth.server";
 import { insertAsset, listAssetsByUser, getAssetById, softDeleteAsset } from "~/lib/assets.repo";
 import fs from "fs";
@@ -13,7 +12,9 @@ async function requireUserId(request: Request): Promise<string> {
     const session = await auth.api?.getSession?.({ headers: request.headers });
     const userId: string | undefined = session?.user?.id ?? session?.session?.userId;
     if (userId) return String(userId);
-  } catch { /* ignore */ }
+  } catch {
+    console.error("Failed to get session");
+  }
 
   // Fallback: call /api/auth/session with forwarded cookies
   const host = request.headers.get("x-forwarded-host") || request.headers.get("host") || "localhost:5173";
@@ -53,7 +54,7 @@ function inferMediaTypeFromName(name: string, fallback: string = "application/oc
   return fallback;
 }
 
-export async function loader({ request }: Route.LoaderArgs) {
+export async function loader({ request }: { request: Request }) {
   const url = new URL(request.url);
   const pathname = url.pathname;
 
@@ -139,7 +140,7 @@ export async function loader({ request }: Route.LoaderArgs) {
   return new Response("Not Found", { status: 404 });
 }
 
-export async function action({ request }: Route.ActionArgs) {
+export async function action({ request }: { request: Request }) {
   const url = new URL(request.url);
   const pathname = url.pathname;
   const method = request.method.toUpperCase();
@@ -181,7 +182,8 @@ export async function action({ request }: Route.ActionArgs) {
         headers: { "Content-Type": "application/json" },
       });
     }
-    const json = await forwardRes.json() as {filename: string, size: number};
+  
+    const json = await forwardRes.json();
     const filename: string = json.filename;
     const size: number = json.size;
     const mime = inferMediaTypeFromName(filenameFor8000, "application/octet-stream");
diff --git a/app/routes/api.projects.$.tsx b/app/routes/api.projects.$.tsx
@@ -1,18 +1,18 @@
-import type { Route } from "./+types/api.projects.$";
 import { auth } from "~/lib/auth.server";
 import { createProject, getProjectById, listProjectsByUser, deleteProjectById } from "~/lib/projects.repo";
 import { listAssetsByUser, softDeleteAsset } from "~/lib/assets.repo";
 import fs from "fs";
 import path from "path";
-import { loadProjectState, saveProjectState } from "~/lib/timeline.store";
+import { loadTimeline, saveTimeline, loadProjectState, saveProjectState } from "~/lib/timeline.store";
+import type { MediaBinItem, TimelineState } from "~/components/timeline/types";
 
 async function requireUserId(request: Request): Promise<string> {
   try {
     const session = await auth.api?.getSession?.({ headers: request.headers });
     const uid: string | undefined = session?.user?.id || session?.session?.userId;
     if (uid) return String(uid);
   } catch {
-    // ignore
+    console.error("Failed to get session");
   }
   const host = request.headers.get("x-forwarded-host") || request.headers.get("host") || "localhost:5173";
   const proto = request.headers.get("x-forwarded-proto") || (host.includes("localhost") ? "http" : "https");
@@ -25,7 +25,7 @@ async function requireUserId(request: Request): Promise<string> {
   return String(uid2);
 }
 
-export async function loader({ request }: Route.LoaderArgs) {
+export async function loader({ request }: { request: Request }) {
   const url = new URL(request.url);
   const pathname = url.pathname;
   const userId = await requireUserId(request);
@@ -63,27 +63,27 @@ export async function loader({ request }: Route.LoaderArgs) {
             fs.unlinkSync(filePath);
           }
         } catch {
-          // ignore
+          console.error("Failed to delete asset");
         }
         await softDeleteAsset(a.id, userId);
       }
     } catch {
-      // ignore
+      console.error("Failed to delete assets");
     }
 
     const ok = await deleteProjectById(id, userId);
     if (!ok) return new Response("Not Found", { status: 404 });
     // remove timeline file if exists
     try { await fs.promises.unlink(path.resolve(process.env.TIMELINE_DIR || "project_data", `${id}.json`)); } catch {
-      // ignore
+      console.error("Failed to delete timeline file");
     }
     return new Response(JSON.stringify({ success: true }), { status: 200, headers: { "Content-Type": "application/json" } });
   }
 
   return new Response("Not Found", { status: 404 });
 }
 
-export async function action({ request }: Route.ActionArgs) {
+export async function action({ request }: { request: Request }) {
   const url = new URL(request.url);
   const pathname = url.pathname;
   const userId = await requireUserId(request);
@@ -112,12 +112,12 @@ export async function action({ request }: Route.ActionArgs) {
             fs.unlinkSync(filePath);
           }
         } catch {
-          // ignore
+          console.error("Failed to delete asset");
         }
         await softDeleteAsset(a.id, userId);
       }
     } catch {
-      // ignore
+      console.error("Failed to delete assets");
     }
     const ok = await deleteProjectById(id, userId);
     if (!ok) return new Response("Not Found", { status: 404 });
@@ -132,8 +132,8 @@ export async function action({ request }: Route.ActionArgs) {
     if (!proj || proj.user_id !== userId) return new Response("Not Found", { status: 404 });
     const body = await request.json().catch(() => ({}));
     const name: string | undefined = body?.name ? String(body.name).slice(0, 120) : undefined;
-    const timeline: any | undefined = body?.timeline;
-    const textBinItems: any[] | undefined = Array.isArray(body?.textBinItems) ? body.textBinItems : undefined;
+    const timeline: TimelineState | undefined = body?.timeline;
+    const textBinItems: MediaBinItem[] | undefined = Array.isArray(body?.textBinItems) ? body.textBinItems : undefined;
     if (!name && !timeline && !textBinItems) return new Response(JSON.stringify({ error: "No changes" }), { status: 400, headers: { "Content-Type": "application/json" } });
     // simple update
     // inline update using pg (reuse pool via repo)
@@ -143,7 +143,7 @@ export async function action({ request }: Route.ActionArgs) {
     const { Pool } = await import("pg");
     const rawDbUrl = process.env.DATABASE_URL || "";
     let connectionString = rawDbUrl; try { const u = new URL(rawDbUrl); u.search = ""; connectionString = u.toString(); } catch {
-      // ignore
+      console.error("Invalid database URL");
     }
     const pool = new Pool({ connectionString, ssl: { rejectUnauthorized: false } });
     try {
diff --git a/app/routes/api.storage.$.tsx b/app/routes/api.storage.$.tsx
@@ -1,7 +1,6 @@
-import type { Route } from "./+types/api.storage.$";
 import { auth } from "~/lib/auth.server";
 
-export async function loader({ request }: Route.LoaderArgs) {
+export async function loader({ request }: { request: Request }) {
   const url = new URL(request.url);
   const pathname = url.pathname;
 
@@ -12,7 +11,9 @@ export async function loader({ request }: Route.LoaderArgs) {
       const session = await auth.api?.getSession?.({ headers: req.headers });
       const userId: string | undefined = session?.user?.id ?? session?.session?.userId;
       if (userId) return String(userId);
-    } catch {}
+    } catch {
+      console.error("Failed to get session");
+    }
 
     const host = req.headers.get("x-forwarded-host") || req.headers.get("host") || "localhost:5173";
     const proto = req.headers.get("x-forwarded-proto") || (host.includes("localhost") ? "http" : "https");
@@ -21,9 +22,9 @@ export async function loader({ request }: Route.LoaderArgs) {
     const res = await fetch(`${base}/api/auth/session`, {
       headers: { Cookie: cookie, Accept: "application/json" },
       method: "GET",
-    });
+    }); 
     if (!res.ok) throw new Response(JSON.stringify({ error: "Unauthorized" }), { status: 401, headers: { "Content-Type": "application/json" } });
-    const json = await res.json().catch(() => ({} as any));
+    const json = await res.json().catch(() => ({}));
     const uid: string | undefined = json?.user?.id || json?.user?.userId || json?.session?.user?.id || json?.session?.userId || json?.data?.user?.id || json?.data?.user?.userId;
     if (!uid) throw new Response(JSON.stringify({ error: "Unauthorized" }), { status: 401, headers: { "Content-Type": "application/json" } });
     return String(uid);
@@ -43,7 +44,9 @@ export async function loader({ request }: Route.LoaderArgs) {
       const u = new URL(rawDbUrl);
       u.search = "";
       connectionString = u.toString();
-    } catch {}
+    } catch {
+      console.error("Invalid database URL");
+    }
     const pool = new Pool({ connectionString, ssl: { rejectUnauthorized: false } });
 
     let usedBytes = 0;
diff --git a/app/routes/home.tsx b/app/routes/home.tsx
diff --git a/app/routes/landing.tsx b/app/routes/landing.tsx
diff --git a/app/routes/login.tsx b/app/routes/login.tsx
diff --git a/app/routes/project.$id.tsx b/app/routes/project.$id.tsx
diff --git a/app/routes/projects.tsx b/app/routes/projects.tsx
diff --git a/app/utils/api.ts b/app/utils/api.ts

Original file line number	Diff line number	Diff line change
`@@ -27,7 +27,7 @@ export const KimuLogo: React.FC<KimuLogoProps> = ({`
`27`	`27`	`? " animate-float-icon transition-all duration-700"`
`28`	`28`	`: "")`
`29`	`29`	`}`
`30`		`- style={{ color, opacity, ...(style) }}`
	`30`	`+ style={{ color, opacity, ...(style as React.CSSProperties) }}`
`31`	`31`	`{...rest}`
`32`	`32`	`aria-label="Kimu Logo"`
`33`	`33`	`>`
Original file line number	Diff line number	Diff line change
`@@ -44,7 +44,7 @@ export function ProfileMenu({`
`44`	`44`	`setLimitBytes(Number.isFinite(l) ? l : 2 * 1024 * 1024 * 1024);`
`45`	`45`	`}`
`46`	`46`	`} catch {`
`47`		`- // ignore`
	`47`	`+ console.error('Storage fetch failed');`
`48`	`48`	`}`
`49`	`49`	`})();`
`50`	`50`	`return () => {`
Original file line number	Diff line number	Diff line change
`@@ -12,7 +12,7 @@ function getPool(): Pool {`
`12`	`12`	`u.search = "";`
`13`	`13`	`connectionString = u.toString();`
`14`	`14`	`} catch {`
`15`		`- // Ignore URL parsing errors, use raw connection string`
	`15`	`+ throw new Error("Invalid database URL");`
`16`	`16`	`}`
`17`	`17`	`pool = new Pool({ connectionString, ssl: { rejectUnauthorized: false } });`
`18`	`18`	`}`