@remotion/studio-server 4.0.421 → 4.0.423

package/dist/client-render-queue.d.ts

@@ -0,0 +1,7 @@
+import type { CompletedClientRender } from '@remotion/studio-shared';
+export declare const getCompletedClientRenders: () => CompletedClientRender[];
+export declare const addCompletedClientRender: ({ render, remotionRoot, }: {
+    render: CompletedClientRender;
+    remotionRoot: string;
+}) => void;
+export declare const removeCompletedClientRender: (id: string) => void;

package/dist/client-render-queue.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.removeCompletedClientRender = exports.addCompletedClientRender = exports.getCompletedClientRenders = void 0;
+const file_watcher_1 = require("./file-watcher");
+const resolve_output_path_1 = require("./helpers/resolve-output-path");
+const live_events_1 = require("./preview-server/live-events");
+let completedClientRenders = [];
+const cleanupFns = new Map();
+const notifyClientsOfUpdate = () => {
+    (0, live_events_1.waitForLiveEventsListener)().then((listener) => {
+        listener.sendEventToClient({
+            type: 'client-renders-updated',
+            renders: (0, exports.getCompletedClientRenders)(),
+        });
+    });
+};
+const getCompletedClientRenders = () => {
+    return completedClientRenders;
+};
+exports.getCompletedClientRenders = getCompletedClientRenders;
+const addCompletedClientRender = ({ render, remotionRoot, }) => {
+    if (completedClientRenders.some((r) => r.id === render.id)) {
+        return;
+    }
+    completedClientRenders.push(render);
+    const filePath = (0, resolve_output_path_1.resolveOutputPath)(remotionRoot, render.outName);
+    const { unwatch } = (0, file_watcher_1.installFileWatcher)({
+        file: filePath,
+        onChange: (type) => {
+            if (type === 'created' || type === 'deleted') {
+                updateCompletedClientRender(render.id, {
+                    deletedOutputLocation: type === 'deleted',
+                });
+            }
+        },
+    });
+    cleanupFns.set(render.id, unwatch);
+    notifyClientsOfUpdate();
+};
+exports.addCompletedClientRender = addCompletedClientRender;
+const removeCompletedClientRender = (id) => {
+    const cleanup = cleanupFns.get(id);
+    if (cleanup) {
+        cleanup();
+        cleanupFns.delete(id);
+    }
+    completedClientRenders = completedClientRenders.filter((r) => r.id !== id);
+    notifyClientsOfUpdate();
+};
+exports.removeCompletedClientRender = removeCompletedClientRender;
+const updateCompletedClientRender = (id, updates) => {
+    completedClientRenders = completedClientRenders.map((r) => {
+        if (r.id === id) {
+            return { ...r, ...updates };
+        }
+        return r;
+    });
+    notifyClientsOfUpdate();
+};

package/dist/helpers/resolve-output-path.d.ts

@@ -0,0 +1 @@
+export declare const resolveOutputPath: (remotionRoot: string, filePath: string) => string;

package/dist/helpers/resolve-output-path.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resolveOutputPath = void 0;
+const node_path_1 = __importDefault(require("node:path"));
+const resolveOutputPath = (remotionRoot, filePath) => {
+    const absolutePath = node_path_1.default.join(remotionRoot, filePath);
+    const relativeToRoot = node_path_1.default.relative(remotionRoot, absolutePath);
+    if (relativeToRoot.startsWith('..')) {
+        throw new Error(`Not allowed to write to ${relativeToRoot}`);
+    }
+    return absolutePath;
+};
+exports.resolveOutputPath = resolveOutputPath;

package/dist/index.d.ts

@@ -41,7 +41,12 @@ export declare const StudioServerInternals: {
         installCommand: string;
         startCommand: string;
     }[];
-    getPackageManager: (remotionRoot: string, packageManager: string | undefined, dirUp: number) => {
+    getPackageManager: ({ remotionRoot, packageManager, dirUp, logLevel, }: {
+        remotionRoot: string;
+        packageManager: string | undefined;
+        dirUp: number;
+        logLevel: import("@remotion/renderer").LogLevel;
+    }) => {
         manager: import("@remotion/studio-shared").PackageManager;
         path: string;
         installCommand: string;
@@ -83,4 +88,10 @@ export declare const StudioServerInternals: {
         version: string;
         additionalArgs: string[];
     }) => string[];
+    addCompletedClientRender: ({ render, remotionRoot, }: {
+        render: import("@remotion/studio-shared").CompletedClientRender;
+        remotionRoot: string;
+    }) => void;
+    getCompletedClientRenders: () => import("@remotion/studio-shared").CompletedClientRender[];
+    removeCompletedClientRender: (id: string) => void;
 };

package/dist/index.js

@@ -5,6 +5,7 @@ const studio_shared_1 = require("@remotion/studio-shared");
 var studio_shared_2 = require("@remotion/studio-shared");
 Object.defineProperty(exports, "getDefaultOutLocation", { enumerable: true, get: function () { return studio_shared_2.getDefaultOutLocation; } });
 const ansi_diff_1 = require("./ansi-diff");
+const client_render_queue_1 = require("./client-render-queue");
 const duplicate_composition_1 = require("./codemods/duplicate-composition");
 const file_watcher_1 = require("./file-watcher");
 const get_latest_remotion_version_1 = require("./get-latest-remotion-version");
@@ -30,4 +31,7 @@ exports.StudioServerInternals = {
     parseAndApplyCodemod: duplicate_composition_1.parseAndApplyCodemod,
     getInstalledDependencies: get_installed_dependencies_1.getInstalledDependencies,
     getInstallCommand: install_command_1.getInstallCommand,
+    addCompletedClientRender: client_render_queue_1.addCompletedClientRender,
+    getCompletedClientRenders: client_render_queue_1.getCompletedClientRenders,
+    removeCompletedClientRender: client_render_queue_1.removeCompletedClientRender,
 };

package/dist/preview-server/__tests__/multiple-lockfiles.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/preview-server/__tests__/multiple-lockfiles.test.js

@@ -0,0 +1,37 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const bun_test_1 = require("bun:test");
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_os_1 = __importDefault(require("node:os"));
+const node_path_1 = __importDefault(require("node:path"));
+const get_package_manager_1 = require("../get-package-manager");
+(0, bun_test_1.describe)('getPackageManager multiple lockfiles', () => {
+    let tempDir;
+    (0, bun_test_1.beforeEach)(() => {
+        tempDir = node_fs_1.default.mkdtempSync(node_path_1.default.join(node_os_1.default.tmpdir(), 'remotion-test-'));
+    });
+    (0, bun_test_1.afterEach)(() => {
+        node_fs_1.default.rmSync(tempDir, { recursive: true, force: true });
+    });
+    (0, bun_test_1.test)('should not throw error when multiple lockfiles are detected', () => {
+        node_fs_1.default.writeFileSync(node_path_1.default.join(tempDir, 'package-lock.json'), '{}');
+        node_fs_1.default.writeFileSync(node_path_1.default.join(tempDir, 'bun.lock'), '');
+        // Should not throw
+        const manager = (0, get_package_manager_1.getPackageManager)(tempDir, undefined, 0);
+        // Should return one of them (usually the first one in the list, which is npm)
+        (0, bun_test_1.expect)(manager).not.toBe('unknown');
+        if (typeof manager !== 'string') {
+            (0, bun_test_1.expect)(['npm', 'bun']).toContain(manager.manager);
+        }
+    });
+    (0, bun_test_1.test)('should return npm if only package-lock.json exists', () => {
+        node_fs_1.default.writeFileSync(node_path_1.default.join(tempDir, 'package-lock.json'), '{}');
+        const manager = (0, get_package_manager_1.getPackageManager)(tempDir, undefined, 0);
+        if (typeof manager !== 'string') {
+            (0, bun_test_1.expect)(manager.manager).toBe('npm');
+        }
+    });
+});

package/dist/preview-server/get-package-manager.d.ts

@@ -1,3 +1,4 @@
+import type { LogLevel } from '@remotion/renderer';
 import type { PackageManager } from '@remotion/studio-shared';
 type LockfilePath = {
     manager: PackageManager;
@@ -6,5 +7,10 @@ type LockfilePath = {
     startCommand: string;
 };
 export declare const lockFilePaths: LockfilePath[];
-export declare const getPackageManager: (remotionRoot: string, packageManager: string | undefined, dirUp: number) => LockfilePath | "unknown";
+export declare const getPackageManager: ({ remotionRoot, packageManager, dirUp, logLevel, }: {
+    remotionRoot: string;
+    packageManager: string | undefined;
+    dirUp: number;
+    logLevel: LogLevel;
+}) => LockfilePath | "unknown";
 export {};

package/dist/preview-server/get-package-manager.js

@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getPackageManager = exports.lockFilePaths = void 0;
+const renderer_1 = require("@remotion/renderer");
 const node_fs_1 = __importDefault(require("node:fs"));
 const node_path_1 = __importDefault(require("node:path"));
 exports.lockFilePaths = [
@@ -38,7 +39,8 @@ exports.lockFilePaths = [
         startCommand: 'bunx remotion studio',
     },
 ];
-const getPackageManager = (remotionRoot, packageManager, dirUp) => {
+let warnedAboutMultipleLockfiles = false;
+const getPackageManager = ({ remotionRoot, packageManager, dirUp, logLevel, }) => {
     if (packageManager) {
         const manager = exports.lockFilePaths.find((p) => p.manager === packageManager);
         if (!manager) {
@@ -53,18 +55,21 @@ const getPackageManager = (remotionRoot, packageManager, dirUp) => {
         return 'unknown';
     }
     if (existingPkgManagers.length === 0) {
-        return (0, exports.getPackageManager)(remotionRoot, packageManager, dirUp + 1);
+        return (0, exports.getPackageManager)({
+            remotionRoot,
+            packageManager,
+            dirUp: dirUp + 1,
+            logLevel,
+        });
     }
-    if (existingPkgManagers.length > 1) {
-        const error = [
-            `Found multiple lockfiles:`,
-            ...existingPkgManagers.map((m) => {
-                return `- ${m.path}`;
-            }),
-            '',
-            'This can lead to bugs, delete all but one of these files and run this command again.',
-        ].join('\n');
-        throw new Error(error);
+    if (existingPkgManagers.length > 1 && !warnedAboutMultipleLockfiles) {
+        warnedAboutMultipleLockfiles = true;
+        renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, '⚠️  Multiple lockfiles detected:');
+        for (const pkgManager of existingPkgManagers) {
+            renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, `  - ${pkgManager.path}`);
+        }
+        renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, '');
+        renderer_1.RenderInternals.Log.warn({ indent: false, logLevel }, 'This can lead to bugs, delete all but one of these files.');
     }
     return existingPkgManagers[0];
 };

package/dist/preview-server/routes/install-dependency.js

@@ -21,7 +21,12 @@ const handleInstallPackage = async ({ logLevel, remotionRoot, input: { packageNa
             return Promise.reject(new Error(`Package ${packageName} is not allowed to be installed.`));
         }
     }
-    const manager = (0, get_package_manager_1.getPackageManager)(remotionRoot, undefined, 0);
+    const manager = (0, get_package_manager_1.getPackageManager)({
+        remotionRoot,
+        packageManager: undefined,
+        dirUp: 0,
+        logLevel,
+    });
     if (manager === 'unknown') {
         throw new Error(`No lockfile was found in your project (one of ${get_package_manager_1.lockFilePaths
             .map((p) => p.path)

package/dist/preview-server/routes/update-available.js

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.handleUpdate = void 0;
 const update_available_1 = require("../update-available");
-const handleUpdate = async ({ remotionRoot }) => {
-    const data = await (0, update_available_1.isUpdateAvailableWithTimeout)(remotionRoot);
+const handleUpdate = async ({ remotionRoot, logLevel }) => {
+    const data = await (0, update_available_1.isUpdateAvailableWithTimeout)(remotionRoot, logLevel);
     return data;
 };
 exports.handleUpdate = handleUpdate;

package/dist/preview-server/update-available.d.ts

@@ -1,3 +1,4 @@
+import type { LogLevel } from '@remotion/renderer';
 import type { UpdateAvailableResponse } from '@remotion/studio-shared';
 export declare const getRemotionVersion: () => any;
-export declare const isUpdateAvailableWithTimeout: (remotionRoot: string) => Promise<UpdateAvailableResponse>;
+export declare const isUpdateAvailableWithTimeout: (remotionRoot: string, logLevel: LogLevel) => Promise<UpdateAvailableResponse>;

package/dist/preview-server/update-available.js

@@ -7,9 +7,14 @@ exports.isUpdateAvailableWithTimeout = exports.getRemotionVersion = void 0;
 const semver_1 = __importDefault(require("semver"));
 const get_latest_remotion_version_1 = require("../get-latest-remotion-version");
 const get_package_manager_1 = require("./get-package-manager");
-const isUpdateAvailable = async ({ remotionRoot, currentVersion, }) => {
+const isUpdateAvailable = async ({ remotionRoot, currentVersion, logLevel, }) => {
     const latest = await (0, get_latest_remotion_version_1.getLatestRemotionVersion)();
-    const pkgManager = (0, get_package_manager_1.getPackageManager)(remotionRoot, undefined, 0);
+    const pkgManager = (0, get_package_manager_1.getPackageManager)({
+        remotionRoot,
+        packageManager: undefined,
+        dirUp: 0,
+        logLevel,
+    });
     return {
         updateAvailable: semver_1.default.lt(currentVersion, latest),
         currentVersion,
@@ -25,10 +30,15 @@ const getRemotionVersion = () => {
     return version;
 };
 exports.getRemotionVersion = getRemotionVersion;
-const isUpdateAvailableWithTimeout = (remotionRoot) => {
+const isUpdateAvailableWithTimeout = (remotionRoot, logLevel) => {
     const version = (0, exports.getRemotionVersion)();
     const threeSecTimeout = new Promise((resolve) => {
-        const pkgManager = (0, get_package_manager_1.getPackageManager)(remotionRoot, undefined, 0);
+        const pkgManager = (0, get_package_manager_1.getPackageManager)({
+            remotionRoot,
+            packageManager: undefined,
+            dirUp: 0,
+            logLevel,
+        });
         setTimeout(() => {
             resolve({
                 currentVersion: version,
@@ -41,7 +51,7 @@ const isUpdateAvailableWithTimeout = (remotionRoot) => {
     });
     return Promise.race([
         threeSecTimeout,
-        isUpdateAvailable({ remotionRoot, currentVersion: version }),
+        isUpdateAvailable({ remotionRoot, currentVersion: version, logLevel }),
     ]);
 };
 exports.isUpdateAvailableWithTimeout = isUpdateAvailableWithTimeout;

package/dist/routes.js

@@ -40,9 +40,11 @@ const fs_1 = __importStar(require("fs"));
 const node_fs_1 = require("node:fs");
 const node_path_1 = __importStar(require("node:path"));
 const node_url_1 = require("node:url");
+const client_render_queue_1 = require("./client-render-queue");
 const get_file_source_1 = require("./helpers/get-file-source");
 const get_installed_installable_packages_1 = require("./helpers/get-installed-installable-packages");
 const open_in_editor_1 = require("./helpers/open-in-editor");
+const resolve_output_path_1 = require("./helpers/resolve-output-path");
 const api_routes_1 = require("./preview-server/api-routes");
 const get_package_manager_1 = require("./preview-server/get-package-manager");
 const handler_1 = require("./preview-server/handler");
@@ -81,7 +83,12 @@ const handleFallback = async ({ remotionRoot, hash, response, getCurrentInputPro
         response.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
         response.setHeader('Cross-Origin-Embedder-Policy', 'require-corp');
     }
-    const packageManager = (0, get_package_manager_1.getPackageManager)(remotionRoot, undefined, 0);
+    const packageManager = (0, get_package_manager_1.getPackageManager)({
+        remotionRoot,
+        packageManager: undefined,
+        dirUp: 0,
+        logLevel,
+    });
     (0, public_folder_1.fetchFolder)({ publicDir, staticHash: hash });
     const installedDependencies = (0, get_installed_installable_packages_1.getInstalledInstallablePackages)(remotionRoot);
     response.end(bundler_1.BundlerInternals.indexHtml({
@@ -93,6 +100,7 @@ const handleFallback = async ({ remotionRoot, hash, response, getCurrentInputPro
         remotionRoot,
         studioServerCommand: packageManager === 'unknown' ? null : packageManager.startCommand,
         renderQueue: getRenderQueue(),
+        completedClientRenders: (0, client_render_queue_1.getCompletedClientRenders)(),
         numberOfAudioTags,
         publicFiles: (0, public_folder_1.getFiles)(),
         includeFavicon: true,
@@ -167,16 +175,18 @@ const handleOpenInEditor = async (remotionRoot, req, res, logLevel) => {
         }));
     }
 };
+const validateSameOrigin = (req) => {
+    const { origin, host } = req.headers;
+    if (origin) {
+        const originUrl = new URL(origin);
+        if (originUrl.host !== host) {
+            throw new Error('Request from different origin not allowed');
+        }
+    }
+};
 const handleAddAsset = ({ req, res, search, publicDir, }) => {
     try {
-        const { origin } = req.headers;
-        const { host } = req.headers;
-        if (origin) {
-            const originUrl = new URL(origin);
-            if (originUrl.host !== host) {
-                throw new Error('Request from different origin not allowed');
-            }
-        }
+        validateSameOrigin(req);
         const query = new node_url_1.URLSearchParams(search);
         const filePath = query.get('filePath');
         if (typeof filePath !== 'string') {
@@ -200,6 +210,65 @@ const handleAddAsset = ({ req, res, search, publicDir, }) => {
     }
     return Promise.resolve();
 };
+const handleUploadOutput = ({ req, res, search, remotionRoot, }) => {
+    try {
+        validateSameOrigin(req);
+        const query = new node_url_1.URLSearchParams(search);
+        const filePath = query.get('filePath');
+        if (typeof filePath !== 'string') {
+            throw new Error('No `filePath` provided');
+        }
+        const absolutePath = (0, resolve_output_path_1.resolveOutputPath)(remotionRoot, filePath);
+        fs_1.default.mkdirSync(node_path_1.default.dirname(absolutePath), { recursive: true });
+        const writeStream = (0, fs_1.createWriteStream)(absolutePath);
+        writeStream.on('close', () => {
+            res.end(JSON.stringify({ success: true }));
+        });
+        writeStream.on('error', (err) => {
+            res.statusCode = 500;
+            res.end(JSON.stringify({ error: err.message }));
+        });
+        req.on('error', (err) => {
+            writeStream.destroy();
+            res.statusCode = 500;
+            res.end(JSON.stringify({ error: err.message }));
+        });
+        req.pipe(writeStream);
+    }
+    catch (err) {
+        res.statusCode = 500;
+        res.end(JSON.stringify({ error: err.message }));
+    }
+    return Promise.resolve();
+};
+const handleRegisterClientRender = async ({ req, res, remotionRoot, }) => {
+    try {
+        validateSameOrigin(req);
+        const body = (await (0, parse_body_1.parseRequestBody)(req));
+        (0, client_render_queue_1.addCompletedClientRender)({ render: body, remotionRoot });
+        res.setHeader('content-type', 'application/json');
+        res.writeHead(200);
+        res.end(JSON.stringify({ success: true }));
+    }
+    catch (err) {
+        res.statusCode = 500;
+        res.end(JSON.stringify({ error: err.message }));
+    }
+};
+const handleUnregisterClientRender = async ({ req, res, }) => {
+    try {
+        validateSameOrigin(req);
+        const body = (await (0, parse_body_1.parseRequestBody)(req));
+        (0, client_render_queue_1.removeCompletedClientRender)(body.id);
+        res.setHeader('content-type', 'application/json');
+        res.writeHead(200);
+        res.end(JSON.stringify({ success: true }));
+    }
+    catch (err) {
+        res.statusCode = 500;
+        res.end(JSON.stringify({ error: err.message }));
+    }
+};
 const handleFavicon = (_, response) => {
     const filePath = node_path_1.default.join(__dirname, '..', 'web', 'favicon.png');
     const stat = (0, node_fs_1.statSync)(filePath);
@@ -254,6 +323,27 @@ const handleRoutes = ({ staticHash, staticHashPrefix, outputHash, outputHashPref
             publicDir,
         });
     }
+    if (url.pathname === '/api/upload-output') {
+        return handleUploadOutput({
+            req: request,
+            res: response,
+            search: url.search,
+            remotionRoot,
+        });
+    }
+    if (url.pathname === '/api/register-client-render') {
+        return handleRegisterClientRender({
+            req: request,
+            res: response,
+            remotionRoot,
+        });
+    }
+    if (url.pathname === '/api/unregister-client-render') {
+        return handleUnregisterClientRender({
+            req: request,
+            res: response,
+        });
+    }
     for (const [key, value] of Object.entries(api_routes_1.allApiRoutes)) {
         if (url.pathname === key) {
             return (0, handler_1.handleRequest)({

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/studio-server"
 	},
 	"name": "@remotion/studio-server",
-	"version": "4.0.421",
+	"version": "4.0.423",
 	"description": "Run a Remotion Studio with a server backend",
 	"main": "dist",
 	"sideEffects": false,
@@ -25,11 +25,11 @@
 	"dependencies": {
 		"@babel/parser": "7.24.1",
 		"semver": "7.5.3",
-		"remotion": "4.0.421",
+		"remotion": "4.0.423",
 		"recast": "0.23.11",
-		"@remotion/bundler": "4.0.421",
-		"@remotion/renderer": "4.0.421",
-		"@remotion/studio-shared": "4.0.421",
+		"@remotion/bundler": "4.0.423",
+		"@remotion/renderer": "4.0.423",
+		"@remotion/studio-shared": "4.0.423",
 		"memfs": "3.4.3",
 		"source-map": "0.7.3",
 		"open": "^8.4.2"
@@ -39,7 +39,7 @@
 		"react": "19.2.3",
 		"@babel/types": "7.24.0",
 		"@types/semver": "^7.3.4",
-		"@remotion/eslint-config-internal": "4.0.421",
+		"@remotion/eslint-config-internal": "4.0.423",
 		"eslint": "9.19.0",
 		"@types/node": "20.12.14"
 	},