@crowdin/app-project-module
Version:
Module that generates for you all common endpoints for serving standalone Crowdin App
35 lines (34 loc) • 1.11 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.renderJSXOnServer = renderJSXOnServer;
exports.renderJSXOnClient = renderJSXOnClient;
const server_1 = require("react-dom/server");
const views_1 = require("../views");
/**
* Renders a React component to HTML string
* Uses React Server-Side Rendering (renderToStaticMarkup)
*/
function renderJSXOnServer(Component, props) {
const element = Component(props);
return '' + (0, server_1.renderToStaticMarkup)(element);
}
/**
* Renders a React component to HTML string to be hydrated on client side
*/
function renderJSXOnClient({ name, props, withHead = true, }) {
const head = withHead ? (0, server_1.renderToStaticMarkup)((0, views_1.Head)(props)) : '';
return `
<html>
${head}
<body>
<div id="root"></div>
<script>
// Make props available to client JS
window.__PAGE_PROPS__ = ${JSON.stringify(props).replace(/</g, '\\u003c')};
</script>
<script type="module" src="/assets/ui/${name}.bundle.js"></script>
</body>
</html>
`;
}