@remotion/studio
Version:
APIs for interacting with the Remotion Studio
66 lines (65 loc) • 3.52 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.UpdateModal = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const colors_1 = require("../../helpers/colors");
const copy_text_1 = require("../../helpers/copy-text");
const CopyButton_1 = require("../CopyButton");
const KnownBugs_1 = require("../KnownBugs");
const layout_1 = require("../layout");
const ModalHeader_1 = require("../ModalHeader");
const DismissableModal_1 = require("../NewComposition/DismissableModal");
const NotificationCenter_1 = require("../Notifications/NotificationCenter");
const container = {
padding: 20,
paddingTop: 0,
};
const text = {
fontSize: 14,
};
const title = {
paddingTop: 12,
paddingBottom: 8,
...text,
};
const code = {
background: colors_1.SELECTED_BACKGROUND,
padding: '12px 10px',
fontSize: 14,
marginTop: 10,
marginBottom: 10,
};
const link = {
fontWeight: 'bold',
color: colors_1.BLUE,
textDecoration: 'none',
...text,
};
const commands = {
npm: 'npx remotion upgrade',
yarn: 'yarn remotion upgrade',
pnpm: 'pnpm exec remotion upgrade',
bun: 'bun remotion upgrade',
unknown: 'npx remotion upgrade',
};
const UpdateModal = ({ info, knownBugs }) => {
const hasKnownBugs = (0, react_1.useMemo)(() => {
return knownBugs && (knownBugs === null || knownBugs === void 0 ? void 0 : knownBugs.length) > 0;
}, [knownBugs]);
const command = commands[info.packageManager];
const onClick = (0, react_1.useCallback)(() => {
(0, copy_text_1.copyText)(command).catch((err) => {
(0, NotificationCenter_1.showNotification)(`Could not copy: ${err.message}`, 2000);
});
}, [command]);
return (jsx_runtime_1.jsxs(DismissableModal_1.DismissableModal, { children: [
jsx_runtime_1.jsx(ModalHeader_1.ModalHeader, { title: "Update available" }), jsx_runtime_1.jsxs("div", { style: container, children: [hasKnownBugs ? (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [
jsx_runtime_1.jsxs("div", { style: title, children: ["The currently installed version ", info.currentVersion, " has the following known bugs:"] }), jsx_runtime_1.jsx(KnownBugs_1.KnownBugs, { bugs: knownBugs }), jsx_runtime_1.jsx("div", { style: { height: '20px' } }), jsx_runtime_1.jsx("div", { style: text, children: "To upgrade, run the following command:" })
] })) : (jsx_runtime_1.jsx("div", { style: title, children: "A new update for Remotion is available! Run the following command:" })), jsx_runtime_1.jsxs(layout_1.Row, { align: "center", children: [
jsx_runtime_1.jsx(layout_1.Flex, { children: jsx_runtime_1.jsx("pre", { onClick: onClick, style: code, children: command }) }), jsx_runtime_1.jsx(layout_1.Spacing, { x: 1 }), jsx_runtime_1.jsx(CopyButton_1.CopyButton, { textToCopy: command, label: "Copy", labelWhenCopied: "Copied!" })
] }), jsx_runtime_1.jsxs("div", { style: text, children: ["This will upgrade Remotion from ", info.currentVersion, " to", ' ', info.latestVersion, "."] }), jsx_runtime_1.jsxs("div", { style: text, children: ["Read the", ' ', jsx_runtime_1.jsx("a", { style: link, target: "_blank", href: "https://github.com/remotion-dev/remotion/releases", children: "Release notes" }), ' ', "to know what", "'s", " new in Remotion."] })
] })
] }));
};
exports.UpdateModal = UpdateModal;