build and test like other webapps
This commit is contained in:
Sebastian
parent
d5efb6198e
commit
770ab6f01d
@ -4,31 +4,20 @@
|
||||
"version": "0.0.4",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"build": "preact build --no-sw --no-esm",
|
||||
"compile": "tsc",
|
||||
"serve": "sirv build --port ${PORT:=8080} --cors --single",
|
||||
"build": "./build.mjs",
|
||||
"check": "tsc",
|
||||
"compile": "tsc && ./build.mjs",
|
||||
"dev": "preact watch --port ${PORT:=8080} --no-sw --no-esm",
|
||||
"lint-check": "eslint '{src,tests}/**/*.{js,jsx,ts,tsx}'",
|
||||
"lint-fix": "eslint --fix '{src,tests}/**/*.{js,jsx,ts,tsx}'",
|
||||
"test": "jest ./tests",
|
||||
"dev-test": "jest ./tests --watch",
|
||||
"test": "pnpm compile && mocha --require source-map-support/register 'dist/**/test.js'",
|
||||
"lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
|
||||
"i18n:extract": "pogen extract",
|
||||
"i18n:merge": "pogen merge",
|
||||
"i18n:emit": "pogen emit",
|
||||
"i18n": "pnpm i18n:extract && pnpm i18n:merge && pnpm i18n:emit",
|
||||
"typedoc": "typedoc src",
|
||||
"clean": "rimraf build storybook-static docs single",
|
||||
"build-single": "preact build --no-sw --no-esm -c preact.single-config.js --dest single && sh remove-link-stylesheet.sh",
|
||||
"serve-single": "sirv single --port ${PORT:=8080} --cors --single",
|
||||
"build-storybook": "build-storybook",
|
||||
"storybook": "start-storybook -p 6006"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12",
|
||||
"pnpm": ">=5"
|
||||
"pretty": "prettier --write src"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"extends": [
|
||||
"preact",
|
||||
"plugin:@typescript-eslint/recommended"
|
||||
],
|
||||
"plugins": [
|
||||
"header"
|
||||
],
|
||||
@ -38,8 +27,8 @@
|
||||
"copyleft-header.js"
|
||||
]
|
||||
},
|
||||
"ignorePatterns": [
|
||||
"build/"
|
||||
"extends": [
|
||||
"prettier"
|
||||
]
|
||||
},
|
||||
"dependencies": {
|
||||
@ -53,20 +42,11 @@
|
||||
"preact-router": "3.2.1",
|
||||
"qrcode-generator": "1.4.4",
|
||||
"swr": "1.3.0",
|
||||
"react": "npm:@preact/compat@^17.1.2",
|
||||
"yup": "^0.32.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.18.9",
|
||||
"@babel/plugin-transform-react-jsx-source": "7.18.6",
|
||||
"@creativebulma/bulma-tooltip": "^1.2.0",
|
||||
"@gnu-taler/pogen": "^0.0.5",
|
||||
"@storybook/addon-a11y": "^6.2.9",
|
||||
"@storybook/addon-actions": "^6.2.9",
|
||||
"@storybook/addon-essentials": "^6.2.9",
|
||||
"@storybook/addon-links": "^6.2.9",
|
||||
"@storybook/preact": "^6.2.9",
|
||||
"@storybook/preset-scss": "^1.0.3",
|
||||
"@testing-library/preact": "^2.0.1",
|
||||
"@testing-library/preact-hooks": "^1.1.0",
|
||||
"@types/history": "^4.7.8",
|
||||
@ -75,7 +55,6 @@
|
||||
"@types/node": "^18.8.5",
|
||||
"@typescript-eslint/eslint-plugin": "^4.22.0",
|
||||
"@typescript-eslint/parser": "^4.22.0",
|
||||
"babel-loader": "^8.2.2",
|
||||
"base64-inline-loader": "^1.1.1",
|
||||
"bulma": "^0.9.2",
|
||||
"bulma-checkbox": "^1.1.1",
|
||||
@ -94,15 +73,8 @@
|
||||
"inline-chunk-html-plugin": "^1.1.1",
|
||||
"jest": "^26.6.3",
|
||||
"jest-preset-preact": "^4.0.2",
|
||||
"po2json": "^0.4.5",
|
||||
"preact-cli": "^3.0.5",
|
||||
"preact-render-to-json": "^3.6.6",
|
||||
"preact-render-to-string": "^5.1.19",
|
||||
"rimraf": "^3.0.2",
|
||||
"sass": "^1.32.13",
|
||||
"sass-loader": "10.1.1",
|
||||
"script-ext-html-webpack-plugin": "^2.1.5",
|
||||
"sirv-cli": "^1.0.11",
|
||||
"sass": "1.56.1",
|
||||
"typedoc": "^0.20.36",
|
||||
"typescript": "4.8.4"
|
||||
},
|
||||
|
||||
109
packages/merchant-backoffice-ui/src/Application.tsx
Normal file
109
packages/merchant-backoffice-ui/src/Application.tsx
Normal file
@ -0,0 +1,109 @@
|
||||
/*
|
||||
This file is part of GNU Taler
|
||||
(C) 2021-2023 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/>
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
|
||||
import { h, VNode } from 'preact';
|
||||
import { route } from 'preact-router';
|
||||
import { useMemo } from "preact/hooks";
|
||||
import { ApplicationReadyRoutes } from "./ApplicationReadyRoutes.js";
|
||||
import { Loading } from "./components/exception/loading.js";
|
||||
import { NotificationCard, NotYetReadyAppMenu } from "./components/menu/index.js";
|
||||
import { BackendContextProvider, useBackendContext } from './context/backend.js';
|
||||
import { ConfigContextProvider } from './context/config.js';
|
||||
import { TranslationProvider } from './context/translation.js';
|
||||
import { useBackendConfig } from "./hooks/backend.js";
|
||||
import { useTranslator } from './i18n/index.js';
|
||||
import LoginPage from './paths/login/index.js';
|
||||
|
||||
export function Application(): VNode {
|
||||
return (
|
||||
// <FetchContextProvider>
|
||||
<BackendContextProvider>
|
||||
<TranslationProvider>
|
||||
<ApplicationStatusRoutes />
|
||||
</TranslationProvider>
|
||||
</BackendContextProvider>
|
||||
// </FetchContextProvider>
|
||||
);
|
||||
}
|
||||
|
||||
function ApplicationStatusRoutes(): VNode {
|
||||
const { updateLoginStatus, triedToLog } = useBackendContext()
|
||||
const result = useBackendConfig();
|
||||
const i18n = useTranslator()
|
||||
|
||||
const updateLoginInfoAndGoToRoot = (url: string, token?: string) => {
|
||||
updateLoginStatus(url, token)
|
||||
route('/')
|
||||
}
|
||||
|
||||
const { currency, version } = result.ok ? result.data : { currency: 'unknown', version: 'unknown' }
|
||||
const ctx = useMemo(() => ({ currency, version }), [currency, version])
|
||||
|
||||
if (!triedToLog) {
|
||||
return <div id="app">
|
||||
<NotYetReadyAppMenu title="Welcome!" />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
}
|
||||
|
||||
if (result.clientError && result.isUnauthorized) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Login" />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.clientError && result.isNotfound) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Server not found`,
|
||||
type: 'ERROR',
|
||||
description: `Check your url`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.serverError) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Couldn't access the server`,
|
||||
type: 'ERROR',
|
||||
description: i18n`Got message ${result.message} from ${result.info?.url}`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.loading) return <Loading />
|
||||
|
||||
if (!result.ok) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Unexpected Error`,
|
||||
type: 'ERROR',
|
||||
description: i18n`Got message ${result.message} from ${result.info?.url}`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
return <div id="app" class="has-navbar-fixed-top">
|
||||
<ConfigContextProvider value={ctx}>
|
||||
<ApplicationReadyRoutes />
|
||||
</ConfigContextProvider>
|
||||
</div>
|
||||
}
|
||||
@ -28,6 +28,9 @@ import { useInstanceKYCDetails } from "../../hooks/instance.js";
|
||||
import { Translate } from "../../i18n/index.js";
|
||||
import { LangSelector } from "./LangSelector.js";
|
||||
|
||||
const GIT_HASH = typeof __GIT_HASH__ !== "undefined" ? __GIT_HASH__ : undefined;
|
||||
const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined;
|
||||
|
||||
interface Props {
|
||||
onLogout: () => void;
|
||||
mobile?: boolean;
|
||||
@ -76,7 +79,7 @@ export function Sidebar({
|
||||
class="is-size-7 has-text-right"
|
||||
style={{ lineHeight: 0, marginTop: -10 }}
|
||||
>
|
||||
{process.env.__VERSION__} ({config.version})
|
||||
{VERSION} ({config.version})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -38,3 +38,5 @@ declare module '*.scss' {
|
||||
const content: Record<string, string>;
|
||||
export default content;
|
||||
}
|
||||
declare const __VERSION__: string;
|
||||
declare const __GIT_HASH__: string;
|
||||
|
||||
@ -18,35 +18,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="has-aside-left has-aside-mobile-transition has-navbar-fixed-top has-aside-expanded">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<meta name="mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
|
||||
<link rel="icon" href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==" />
|
||||
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
|
||||
|
||||
<% if (htmlWebpackPlugin.options.manifest.theme_color) { %>
|
||||
<meta name="theme-color" content="<%= htmlWebpackPlugin.options.manifest.theme_color %>">
|
||||
<% } %>
|
||||
|
||||
<% for (const index in htmlWebpackPlugin.files.css) { %>
|
||||
<% const file = htmlWebpackPlugin.files.css[index] %>
|
||||
<style data-href='<%= file %>' >
|
||||
<%= compilation.assets[file.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</style>
|
||||
<% } %>
|
||||
|
||||
<title>Merchant Backoffice</title>
|
||||
<!-- Optional customization script. -->
|
||||
<script src="merchant-backoffice-ui-settings.js"></script>
|
||||
<!-- Entry point for the demobank SPA. -->
|
||||
<script type="module" src="index.js"></script>
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script>
|
||||
<%= compilation.assets[htmlWebpackPlugin.files.chunks["polyfills"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</script>
|
||||
<script>
|
||||
<%= compilation.assets[htmlWebpackPlugin.files.chunks["bundle"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</script>
|
||||
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
@ -14,97 +14,11 @@
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
import {Application} from "./Application.js";
|
||||
|
||||
import { h, VNode } from 'preact';
|
||||
import { route } from 'preact-router';
|
||||
import { useMemo } from "preact/hooks";
|
||||
import { ApplicationReadyRoutes } from "./ApplicationReadyRoutes.js";
|
||||
import { Loading } from "./components/exception/loading.js";
|
||||
import { NotificationCard, NotYetReadyAppMenu } from "./components/menu/index.js";
|
||||
import { BackendContextProvider, useBackendContext } from './context/backend.js';
|
||||
import { ConfigContextProvider } from './context/config.js';
|
||||
import { TranslationProvider } from './context/translation.js';
|
||||
import { useBackendConfig } from "./hooks/backend.js";
|
||||
import { useTranslator } from './i18n/index.js';
|
||||
import LoginPage from './paths/login/index.js';
|
||||
import { h, render } from "preact";
|
||||
import "./scss/main.scss";
|
||||
|
||||
export default function Application(): VNode {
|
||||
return (
|
||||
// <FetchContextProvider>
|
||||
<BackendContextProvider>
|
||||
<TranslationProvider>
|
||||
<ApplicationStatusRoutes />
|
||||
</TranslationProvider>
|
||||
</BackendContextProvider>
|
||||
// </FetchContextProvider>
|
||||
);
|
||||
}
|
||||
const app = document.getElementById("app");
|
||||
|
||||
function ApplicationStatusRoutes(): VNode {
|
||||
const { updateLoginStatus, triedToLog } = useBackendContext()
|
||||
const result = useBackendConfig();
|
||||
const i18n = useTranslator()
|
||||
|
||||
const updateLoginInfoAndGoToRoot = (url: string, token?: string) => {
|
||||
updateLoginStatus(url, token)
|
||||
route('/')
|
||||
}
|
||||
|
||||
const { currency, version } = result.ok ? result.data : { currency: 'unknown', version: 'unknown' }
|
||||
const ctx = useMemo(() => ({ currency, version }), [currency, version])
|
||||
|
||||
if (!triedToLog) {
|
||||
return <div id="app">
|
||||
<NotYetReadyAppMenu title="Welcome!" />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
}
|
||||
|
||||
if (result.clientError && result.isUnauthorized) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Login" />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.clientError && result.isNotfound) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Server not found`,
|
||||
type: 'ERROR',
|
||||
description: `Check your url`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.serverError) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Couldn't access the server`,
|
||||
type: 'ERROR',
|
||||
description: i18n`Got message ${result.message} from ${result.info?.url}`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
if (result.loading) return <Loading />
|
||||
|
||||
if (!result.ok) return <div id="app">
|
||||
<NotYetReadyAppMenu title="Error" />
|
||||
<NotificationCard notification={{
|
||||
message: i18n`Unexpected Error`,
|
||||
type: 'ERROR',
|
||||
description: i18n`Got message ${result.message} from ${result.info?.url}`,
|
||||
}} />
|
||||
<LoginPage onConfirm={updateLoginInfoAndGoToRoot} />
|
||||
</div>
|
||||
|
||||
return <div id="app" class="has-navbar-fixed-top">
|
||||
<ConfigContextProvider value={ctx}>
|
||||
<ApplicationReadyRoutes />
|
||||
</ConfigContextProvider>
|
||||
</div>
|
||||
}
|
||||
render(<Application />, app as any);
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
width: $icon-base-width;
|
||||
|
||||
&.has-update-mark:after {
|
||||
right: ($icon-base-width / 2) - .85;
|
||||
right: calc($icon-base-width / 2) - .85;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
956
pnpm-lock.yaml
956
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user