aboutsummaryrefslogtreecommitdiff
path: root/packages/merchant-backend-ui
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2023-03-02 14:09:44 -0300
committerSebastian <sebasjm@gmail.com>2023-03-02 14:09:44 -0300
commit36956f404cbf1ecc0f2fb320d4f3ab89a313c830 (patch)
tree0928ca592cb9a8ead731507f487b0ef115c04586 /packages/merchant-backend-ui
parent2d5fbb22cdf6cde10004cea174fc90e71668746b (diff)
downloadwallet-core-36956f404cbf1ecc0f2fb320d4f3ab89a313c830.tar.gz
wallet-core-36956f404cbf1ecc0f2fb320d4f3ab89a313c830.tar.bz2
wallet-core-36956f404cbf1ecc0f2fb320d4f3ab89a313c830.zip
camel case for prebuilt
Diffstat (limited to 'packages/merchant-backend-ui')
-rwxr-xr-xpackages/merchant-backend-ui/build.mjs23
-rw-r--r--packages/merchant-backend-ui/package.json8
-rw-r--r--packages/merchant-backend-ui/render-examples.ts139
-rw-r--r--packages/merchant-backend-ui/rollup.config.js116
4 files changed, 221 insertions, 65 deletions
diff --git a/packages/merchant-backend-ui/build.mjs b/packages/merchant-backend-ui/build.mjs
index 21c4068a4..5ca199e2f 100755
--- a/packages/merchant-backend-ui/build.mjs
+++ b/packages/merchant-backend-ui/build.mjs
@@ -74,34 +74,39 @@ function git_hash() {
return fs.readFileSync(path.join(GIT_ROOT, ".git", rev)).toString().trim();
}
}
+function toCamelCaseName(name) {
+ return name
+ .replace(/^[A-Z]/, letter => `${letter.toLowerCase()}`) //first letter lowercase
+ .replace(/[A-Z]/g, letter => `_${letter.toLowerCase()}`) //snake case
+ .concat(".en.html"); //extension
+}
function templatePlugin(options) {
return {
name: "template-backend",
setup(build) {
build.onEnd(() => {
- for (const page of options.pages) {
- const css = fs.readFileSync(path.join(build.initialOptions.outdir, `${page}.css`),"utf8").toString()
- const js = fs.readFileSync(path.join(build.initialOptions.outdir, `${page}.js`),"utf8").toString()
- const scripts = `<script>${js}</script>`
- const style = `<style>${css}</style>`
+ for (const pageName of options.pages) {
+ const css = fs.readFileSync(path.join(build.initialOptions.outdir, `${pageName}.css`),"utf8").toString()
+ const js = fs.readFileSync(path.join(build.initialOptions.outdir, `${pageName}.js`),"utf8").toString()
+ const location = path.join(build.initialOptions.outdir, toCamelCaseName(pageName))
const render = new Function(`${js}; return page.buildTimeRendering();`)()
- const html = `
+ const html = `
<!doctype html>
<html>
<head>
${render.head}
- ${style}
+ <style>${css}</style>
</head>
<script id="built_time_data">
</script>
<body>
${render.body}
- ${scripts}
+ <script>${js}</script>
<script>page.mount()</script>
</body>
</html>`
- fs.writeFileSync(path.join(build.initialOptions.outdir, `${page}.html`), html);
+ fs.writeFileSync(location, html);
}
});
},
diff --git a/packages/merchant-backend-ui/package.json b/packages/merchant-backend-ui/package.json
index 810aee7f2..b7ccd9e94 100644
--- a/packages/merchant-backend-ui/package.json
+++ b/packages/merchant-backend-ui/package.json
@@ -4,14 +4,14 @@
"version": "0.0.5",
"license": "AGPL-3.0-or-later",
"scripts": {
- "compile": "rollup -c",
- "build": "rollup -c",
- "dev": "rollup -c -w",
+ "compile": "tsc && ./build.mjs",
+ "build": "pnpm compile",
+ "prepare": "tsc",
"render-examples": "ts-node -O '{\"module\": \"commonjs\"}' -T render-examples.ts dist/pages dist/examples",
"lint-check": "eslint '{src,tests}/**/*.{js,jsx,ts,tsx}'",
"lint-fix": "eslint --fix '{src,tests}/**/*.{js,jsx,ts,tsx}'",
"typedoc": "typedoc src",
- "clean": "rimraf build docs single dist",
+ "clean": "rimraf dist",
"serve-dist": "sirv --port ${PORT:=8080} --cors --single dist"
},
"engines": {
diff --git a/packages/merchant-backend-ui/render-examples.ts b/packages/merchant-backend-ui/render-examples.ts
index 86e18fa68..e8c4a8cd0 100644
--- a/packages/merchant-backend-ui/render-examples.ts
+++ b/packages/merchant-backend-ui/render-examples.ts
@@ -15,9 +15,9 @@
*/
/**
-*
-* @author Sebastian Javier Marchano (sebasjm)
-*/
+ *
+ * @author Sebastian Javier Marchano (sebasjm)
+ */
import mustache from "mustache";
import fs from "fs";
@@ -25,63 +25,98 @@ import { format, formatDuration, intervalToDuration } from "date-fns";
/**
* This script will emulate what the merchant backend will do when being requested
- *
-*/
+ *
+ */
-const sourceDirectory = process.argv[2]
-const destDirectory = process.argv[3]
+const sourceDirectory = process.argv[2];
+const destDirectory = process.argv[3];
if (!sourceDirectory || !destDirectory) {
- console.log('usage: render-mustache <source-directory> <dest-directory>')
- process.exit(1);
+ console.log("usage: render-mustache <source-directory> <dest-directory>");
+ process.exit(1);
}
if (!fs.existsSync(destDirectory)) {
- fs.mkdirSync(destDirectory);
+ fs.mkdirSync(destDirectory);
}
+function fromCamelCaseName(name) {
+ const result = name
+ .replace(/^[a-z]/, (letter) => `${letter.toUpperCase()}`) //first letter lowercase
+ .replace(/_[a-z]/g, (letter) => `${letter[1].toUpperCase()}`); //snake case
+ return result;
+}
/**
* Load all the html files
*/
-const files = fs.readdirSync(sourceDirectory).filter(f => /.html/.test(f))
-
-files.forEach(file => {
- const html = fs.readFileSync(`${sourceDirectory}/${file}`, 'utf8')
-
- const testName = file.replace('.html', '')
- const exampleFileName = `./src/pages/${testName}.examples`
- if (!fs.existsSync(exampleFileName + ".ts")) {
- console.log(`skipping ${testName}: no examples found`);
- return;
- }
- // eslint-disable-next-line @typescript-eslint/no-var-requires
- const { exampleData } = require(exampleFileName)
-
- Object.keys(exampleData).forEach(exampleName => {
- const example = exampleData[exampleName]
-
- //enhance the example with more information
- example.contract_terms_json = () => JSON.stringify(example.contract_terms);
- example.contract_terms.timestamp_str = () => example.contract_terms.timestamp && format(example.contract_terms.timestamp.t_s, 'dd MMM yyyy HH:mm:ss');
-
- example.contract_terms.hasProducts = () => example.contract_terms.products?.length > 0;
- example.contract_terms.hasAuditors = () => example.contract_terms.auditors?.length > 0;
- example.contract_terms.hasExchanges = () => example.contract_terms.exchanges?.length > 0;
-
- example.contract_terms.products.forEach(p => {
- p.delivery_date_str = () => p.delivery_date && format(p.delivery_date.t_s, 'dd MM yyyy HH:mm:ss')
- p.hasTaxes = () => p.taxes?.length > 0
- })
- example.contract_terms.has_delivery_info = () => example.contract_terms.delivery_date || example.contract_terms.delivery_location
-
- example.contract_terms.delivery_date_str = () => example.contract_terms.delivery_date && format(example.contract_terms.delivery_date.t_s, 'dd MM yyyy HH:mm:ss')
- example.contract_terms.pay_deadline_str = () => example.contract_terms.pay_deadline && format(example.contract_terms.pay_deadline.t_s, 'dd MM yyyy HH:mm:ss')
- example.contract_terms.wire_transfer_deadline_str = () => example.contract_terms.wire_transfer_deadline && format(example.contract_terms.wire_transfer_deadline.t_s, 'dd MM yyyy HH:mm:ss')
- example.contract_terms.refund_deadline_str = () => example.contract_terms.refund_deadline && format(example.contract_terms.refund_deadline.t_s, 'dd MM yyyy HH:mm:ss')
- example.contract_terms.auto_refund_str = () => example.contract_terms.auto_refund && formatDuration(intervalToDuration({ start: 0, end: example.contract_terms.auto_refund.d_us }))
-
- const output = mustache.render(html, example);
-
- fs.writeFileSync(`${destDirectory}/${testName}.${exampleName}.html`, output)
- })
-})
+const files = fs.readdirSync(sourceDirectory).filter((f) => /.html/.test(f));
+
+files.forEach((file) => {
+ const html = fs.readFileSync(`${sourceDirectory}/${file}`, "utf8");
+
+ const testName = file.replace(".en.html", "");
+ const exampleFileName = `./src/pages/${fromCamelCaseName(testName)}.examples`;
+ if (!fs.existsSync(exampleFileName + ".ts")) {
+ console.log(`skipping ${testName}: no examples found`);
+ return;
+ }
+ // eslint-disable-next-line @typescript-eslint/no-var-requires
+ const { exampleData } = require(exampleFileName);
+
+ Object.keys(exampleData).forEach((exampleName) => {
+ const example = exampleData[exampleName];
+
+ //enhance the example with more information
+ example.contract_terms_json = () => JSON.stringify(example.contract_terms);
+ example.contract_terms.timestamp_str = () =>
+ example.contract_terms.timestamp &&
+ format(example.contract_terms.timestamp.t_s, "dd MMM yyyy HH:mm:ss");
+
+ example.contract_terms.hasProducts = () =>
+ example.contract_terms.products?.length > 0;
+ example.contract_terms.hasAuditors = () =>
+ example.contract_terms.auditors?.length > 0;
+ example.contract_terms.hasExchanges = () =>
+ example.contract_terms.exchanges?.length > 0;
+
+ example.contract_terms.products.forEach((p) => {
+ p.delivery_date_str = () =>
+ p.delivery_date && format(p.delivery_date.t_s, "dd MM yyyy HH:mm:ss");
+ p.hasTaxes = () => p.taxes?.length > 0;
+ });
+ example.contract_terms.has_delivery_info = () =>
+ example.contract_terms.delivery_date ||
+ example.contract_terms.delivery_location;
+
+ example.contract_terms.delivery_date_str = () =>
+ example.contract_terms.delivery_date &&
+ format(example.contract_terms.delivery_date.t_s, "dd MM yyyy HH:mm:ss");
+ example.contract_terms.pay_deadline_str = () =>
+ example.contract_terms.pay_deadline &&
+ format(example.contract_terms.pay_deadline.t_s, "dd MM yyyy HH:mm:ss");
+ example.contract_terms.wire_transfer_deadline_str = () =>
+ example.contract_terms.wire_transfer_deadline &&
+ format(
+ example.contract_terms.wire_transfer_deadline.t_s,
+ "dd MM yyyy HH:mm:ss",
+ );
+ example.contract_terms.refund_deadline_str = () =>
+ example.contract_terms.refund_deadline &&
+ format(example.contract_terms.refund_deadline.t_s, "dd MM yyyy HH:mm:ss");
+ example.contract_terms.auto_refund_str = () =>
+ example.contract_terms.auto_refund &&
+ formatDuration(
+ intervalToDuration({
+ start: 0,
+ end: example.contract_terms.auto_refund.d_us,
+ }),
+ );
+
+ const output = mustache.render(html, example);
+
+ fs.writeFileSync(
+ `${destDirectory}/${testName}.${exampleName}.html`,
+ output,
+ );
+ });
+});
diff --git a/packages/merchant-backend-ui/rollup.config.js b/packages/merchant-backend-ui/rollup.config.js
new file mode 100644
index 000000000..18d72e56b
--- /dev/null
+++ b/packages/merchant-backend-ui/rollup.config.js
@@ -0,0 +1,116 @@
+/*
+ This file is part of GNU Taler
+ (C) 2021 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
+ */
+
+// rollup.config.js
+import linaria from '@linaria/rollup';
+import nodeResolve from "@rollup/plugin-node-resolve";
+import alias from "@rollup/plugin-alias";
+import image from '@rollup/plugin-image';
+import json from "@rollup/plugin-json";
+import ts from "@rollup/plugin-typescript";
+import replace from "@rollup/plugin-replace";
+import css from 'rollup-plugin-css-only';
+import html from '@rollup/plugin-html';
+import commonjs from "@rollup/plugin-commonjs";
+
+const template = async ({
+ files,
+}) => {
+ const scripts = (files.js || []).map(({ code }) => `<script>${code}</script>`).join('\n');
+ const css = (files.css || []).map(({ source }) => `<style>${source}</style>`).join('\n');
+ const ssr = (files.js || []).map(({ code }) => code).join('\n');
+ const page = new Function(`${ssr}; return page.buildTimeRendering();`)()
+ return `
+<!doctype html>
+<html>
+ <head>
+ ${page.head}
+ ${css}
+ </head>
+ <script id="built_time_data">
+ </script>
+ <body>
+ ${page.body}
+ ${scripts}
+ <script>page.mount()</script>
+ </body>
+</html>`;
+};
+
+const makePlugins = (name) => [
+ alias({
+ entries: [
+ { find: 'react', replacement: 'preact/compat' },
+ { find: 'react-dom', replacement: 'preact/compat' }
+ ]
+ }),
+
+ replace({
+ "process.env.NODE_ENV": JSON.stringify("production"),
+ preventAssignment: true,
+ }),
+
+ commonjs({
+ include: [/node_modules/, /dist/],
+ extensions: [".js"],
+ ignoreGlobal: true,
+ sourceMap: true,
+ }),
+
+ nodeResolve({
+ browser: true,
+ preferBuiltins: true,
+ }),
+
+ json(),
+ image(),
+
+ linaria({
+ sourceMap: process.env.NODE_ENV !== 'production',
+ }),
+ css(),
+ ts({
+ sourceMap: false,
+ outputToFilesystem: false,
+ }),
+ html({ template, fileName: name }),
+];
+
+function formatHtmlName(name) {
+ return name
+ .replace(/^[A-Z]/, letter => `${letter.toLowerCase()}`) //first letter lowercase
+ .replace(/[A-Z]/g, letter => `_${letter.toLowerCase()}`) //snake case
+ .concat(".en.html"); //extension
+}
+
+const pageDefinition = (name) => ({
+ input: `src/pages/${name}.tsx`,
+ output: {
+ file: `dist/pages/${name}.js`,
+ format: "iife",
+ exports: 'named',
+ name: 'page',
+ },
+ plugins: makePlugins(formatHtmlName(name)),
+});
+
+export default [
+ pageDefinition("OfferTip"),
+ pageDefinition("OfferRefund"),
+ pageDefinition("DepletedTip"),
+ pageDefinition("RequestPayment"),
+ pageDefinition("ShowOrderDetails"),
+]
generated by cgit v1.2.3 (git 2.39.1) at 2024-06-12 18:57:23 +0000