ryuu/dist/server/ui/App.js

Domo App Dev Studio CLI, The main tool used to create, edit, and publish app designs to Domo

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.App = App;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const AppPreview_1 = require("./components/AppPreview");
const Controls_1 = require("./components/Controls");
const Warning_1 = require("./components/Warning");
function App() {
    const [devData, setDevData] = (0, react_1.useState)(null);
    const [isFullscreen, setIsFullscreen] = (0, react_1.useState)(false);
    const [hasThumbnail, setHasThumbnail] = (0, react_1.useState)(false);
    (0, react_1.useEffect)(() => {
        // Get data from window global injected by Vite plugin
        const data = window.__DOMO_DEV_DATA__;
        if (data) {
            setDevData(data);
            setIsFullscreen(data.manifest?.fullpage || false);
            // Check if thumbnail exists
            fetch('/app/thumbnail.png', { method: 'HEAD' })
                .then(res => setHasThumbnail(res.ok))
                .catch(() => setHasThumbnail(false));
        }
    }, []);
    if (!devData) {
        return ((0, jsx_runtime_1.jsx)("div", { className: "loading", children: (0, jsx_runtime_1.jsx)("div", { className: "loading-spinner", children: "Loading Domo Dev Server..." }) }));
    }
    const { manifest, width, height, userId, customerId, instance } = devData;
    // Build the iframe URL with query parameters - use /app/ prefix
    const url = `/app/index.html?userId=${userId}&customer=${customerId}&locale=en-US&platform=desktop`;
    const displayWidth = isFullscreen ? '100%' : `${width}px`;
    const displayHeight = isFullscreen ? '100%' : `${height}px`;
    const displaySize = isFullscreen
        ? 'FULL-WIDTH x FULL-HEIGHT'
        : `${width}px x ${height}px`;
    return ((0, jsx_runtime_1.jsxs)("div", { className: "dev-container", children: [!hasThumbnail && ((0, jsx_runtime_1.jsxs)(Warning_1.Warning, { children: [(0, jsx_runtime_1.jsx)("strong", { children: "Warning:" }), " A thumbnail is required before creating a card with this design. Place a 300x300 image named", ' ', (0, jsx_runtime_1.jsx)("code", { children: "thumbnail.png" }), " in the base directory of your design."] })), (0, jsx_runtime_1.jsx)(Controls_1.Controls, { isFullscreen: isFullscreen, onToggleFullscreen: setIsFullscreen, isFullpageEnabled: manifest.fullpage !== false }), (0, jsx_runtime_1.jsx)(AppPreview_1.AppPreview, { url: url, width: displayWidth, height: displayHeight, isFullscreen: isFullscreen, manifest: manifest, thumbnail: hasThumbnail ? '/app/thumbnail.png' : null, size: displaySize }), (0, jsx_runtime_1.jsx)("footer", { className: "dev-footer", children: (0, jsx_runtime_1.jsxs)("div", { className: "instance-info", children: ["Instance: ", instance] }) })] }));
}
//# sourceMappingURL=App.js.map