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