anastasis build instruction and some fixes

This commit is contained in:
Sebastian 2022-06-27 15:12:44 -03:00
parent d7dfdb1e27
commit dfb385aac9
No known key found for this signature in database
GPG Key ID: BE4FF68352439FC1
7 changed files with 52 additions and 65 deletions

1
.gitignore vendored
View File

@ -26,6 +26,7 @@ prebuilt/
taler-wallet-*.tar.gz
anastasis-webui.zip
# debian packaging leftovers
packages/taler-wallet-cli/debian/.debhelper

79
README
View File

@ -1,7 +1,7 @@
# GNU Taler Wallet
# GNU Taler Wallet & Anastasis Web UI
This repository contains the implementation of a wallet for GNU Taler written
in TypeScript.
in TypeScript and Anastasis Web UI
## Dependencies
@ -41,54 +41,6 @@ This will create the zip file with the WebExtension in the directory
packages/taler-wallet-webextension/extension/
```
We also provide a `Dockerfile` for a container that can build the
WebExtension. After you install docker, make sure the user is in group
`docker` and (re-)start the docker daemon:
```shell
# Make sure there is a docker group.
$ grep docker: /etc/group
$ sudo groupadd docker
# Make sure USER is defined and is in the docker group.
$ echo $USER
$ sudo usermod -aG docker $USER
# Restart the docker daemon.
# (This command is OS-specific.)
# Obtain a new shell. Make sure it includes the `docker` group.
$ newgrp docker
$ id
```
Then, you can proceed with these instructions:
```shell
# Download wallet source code and unpack it
(host)$ tar -xf wallet-core-$version.tar.gz
# Build the image
(host)$ docker build --tag walletbuilder wallet-core-$version/contrib/wallet-docker
# Start the container
(host)$ docker run -dti --name walletcontainer walletbuilder /bin/bash
# Copy wallet source to container
(host)$ docker cp ./wallet-core-$version/ walletcontainer:/
# Attach to container
(host)$ docker attach walletcontainer
# Run build inside container
(container)$ cd wallet-core-$version
(container)$ ./configure && make webextension
(container)$ exit
# Copy build artefact(s) to host
(host)$ docker cp walletcontainer:/wallet-core-$version/packages/taler-wallet-webextension/extension extension
```
### Reviewing WebExtension UI examples
The WebExtension can be tested using example stories.
@ -153,3 +105,30 @@ from the source tree is executed, and not the globally installed one:
PATH="$PWD/packages/taler-wallet-cli/bin:$PATH" \
nyc ./packages/taler-integrationtests/testrunner '*'
```
## Anastasis Web UI
## Building for deploy
To build the Anastasis SPA run:
```shell
make anastasis-webui
```
It will run the test suite and put everything into the dist folder under the project root (packages/anastasis-webui).
You can run the SPA directly using the file:// protocol.
```shell
firefox packages/anastasis-webui/dist/ui.html
```
Additionally you can create a zip file with the content to upload into a web server:
```shell
make anastasis-webui-dist
```
It creates the zip file named `anastasis-webui.zip`

View File

@ -61,10 +61,10 @@ anastasis-webui:
pnpm install --frozen-lockfile --filter . --filter @gnu-taler/anastasis-webui...
pnpm run --filter @gnu-taler/anastasis-webui... build
.PHONY: anastasis-webui-dev
anastasis-webui-dev:
pnpm install --frozen-lockfile --filter @gnu-taler/anastasis-webui...
pnpm run --filter @gnu-taler/anastasis-webui... dev
.PHONY: anastasis-webui-dist
anastasis-webui-dist: anastasis-webui
(cd packages/anastasis-webui/dist && zip -r - fonts ui.html) > anastasis-webui.zip
.PHONY: webextension
webextension:

View File

@ -10,14 +10,17 @@ cp \
src/scss/fonts/materialdesignicons-webfont-4.9.95.woff2 \
dist/fonts
VERSION=$(jq -r .version package.json)
GIT_HASH=$(git rev-parse --short HEAD)
function build_css() {
pnpm exec sass -I . ./src/scss/main.scss dist/main.css
}
function build_js() {
pnpm exec esbuild --log-level=error --bundle $1 --outdir=dist --target=es6 --loader:.svg=dataurl --format=iife --sourcemap --jsx-factory=h --jsx-fragment=Fragment --platform=browser
pnpm exec esbuild --log-level=error --define:process.env.__VERSION__=\"${VERSION}\" --define:process.env.__GIT_HASH__=\"${GIT_HASH}\" --bundle $1 --outdir=dist --target=es6 --loader:.svg=dataurl --format=iife --sourcemap --jsx-factory=h --jsx-fragment=Fragment --platform=browser --minify
}
function bundle() {
function bundle_html() {
cat html/$1.html \
| sed -e '/ANASTASIS_SCRIPT_CONTENT/ {' -e 'r dist/main.js' -e 'd' -e '}' \
| sed -e '/ANASTASIS_STYLE_CONTENT/ {' -e 'r dist/main.css' -e 'd' -e '}' \
@ -27,12 +30,13 @@ function bundle() {
function cleanup {
trap - SIGHUP SIGINT SIGTERM SIGQUIT
echo -n "Cleaning up... "
wait
kill -- -$$
exit 1
}
trap cleanup SIGHUP SIGINT SIGTERM SIGQUIT
set -e
echo compile
build_css &
build_js src/main.ts &
@ -45,9 +49,8 @@ wait -n
pnpm run --silent test -- -R dot
echo html
bundle ui
bundle ui-dev
bundle_html ui
bundle_html ui-dev
if [ "WATCH" == "$1" ]; then

View File

@ -1,7 +1,7 @@
{
"private": true,
"name": "@gnu-taler/anastasis-webui",
"version": "0.0.2",
"version": "0.2.99",
"license": "MIT",
"scripts": {
"build": "./clean_and_build.sh",
@ -49,4 +49,4 @@
"typescript": "^4.5.4",
"ws": "7.4.5"
}
}
}

View File

@ -49,14 +49,14 @@ export function NavigationBar({ onMobileMenu, title }: Props): VNode {
>
Report a bug
</a>
<a
{/* <a
style={{
alignSelf: "center",
padding: "0.5em",
}}
>
Settings
</a>
</a> */}
{/* <a
role="button"
class="navbar-burger"

View File

@ -28,6 +28,10 @@ interface Props {
mobile?: boolean;
}
const VERSION: string = process.env.__VERSION__ || "dev";
const GIT_HASH: string | undefined = process.env.__GIT_HASH__;
const VERSION_WITH_HASH = GIT_HASH ? `${VERSION}-${GIT_HASH}` : VERSION;
export function Sidebar({ mobile }: Props): VNode {
// const config = useConfigContext();
const config = { version: "none" };
@ -57,7 +61,7 @@ export function Sidebar({ mobile }: Props): VNode {
class="is-size-7 has-text-right"
style={{ lineHeight: 0, marginTop: -10 }}
>
Version {process.env.__VERSION__} ({config.version})
Version {VERSION_WITH_HASH}
</div>
</div>
</div>