## Merchant Admin Frontend

The Merchant Admin Frontend is a Single Page Application (SPA) that connects with a running Taler Merchant Backend. It allows you to manage instances, orders, products, and tipping.

## System requirements

- Node: v16.15.0
- pnpm: 7.14.2
- make

## Compiling from source

Run `pnpm install --frozen-lockfile --filter @gnu-taler/merchant-backoffice...` to install all the nodejs dependencies.

Then, entering the command `pnpm build` creates the distribution in the `dist` folder.

By default, the installation prefix will be `/usr/local/share/taler/merchant-backoffice/` but it can be overridden by `--prefix` by the configuration process:

```shell
./configure --prefix=/another/directory
```

To install run `make install`

## Local testing

To have the Merchant SPA point to a different server, override the local storage:

```js
localStorage.setItem("merchant-base-url", "http://backend.taler.localhost:4321/");
```

## Running develop

In order to run a development server you will have to apply

```shell
./dev.mjs
```

This should start a watch process that will reload the server every time a file is saved.

The application needs to connect to a merchant-backend properly configured to run.

## Building for deploy

To build and deploy the SPA on your local server run the install script:

```shell
make install
```

## Runtime dependencies
```
*   preact: Fast 3kB alternative to React with the same modern API

*   preact-router: URL component router for Preact

*   SWR: React Hooks library for data fetching (stale-while-revalidate)

*   Yup: Schema builder for value parsing and validation (to be deprecated)

*   Date-fns: A library for manipulating javascript dates

*   qrcode-generator: Simplest QR-code implementation based on JIS X 0510:1999

*   @gnu-taler/taler-util: Types and tooling

*   history: Manage the history stack, navigate, and make states persist in between sessions

*   jed: gettext as a library for internationalization


## Reading errors from prod stacks

You can use the map file to recreate all the source

```shell
pnpx reverse-sourcemap index.js.map -o dir
```

And to create a unminified version of the stacktrace

```shell
pnpx stacktracify index.js.map --file error.txt
```

So for a file `error.txt` with the content:

```
Error response did not even contain JSON. The request URL might be wrong or the service might be unavailable. 
at e.fromException (https://merchant.taler/webui/index.js:12:78107) 
at J1 (https://merchant.taler/webui/index.js:12:126903) 
at e7 (https://merchant.taler/webui/index.js:15:133135) 
at cf (https://merchant.taler/webui/index.js:15:133256) 
at JP (https://merchant.taler/webui/index.js:18:132360) 
at nn.Q0 [as constructor] (https://merchant.taler/webui/index.js:18:162168) 
at nn.EF [as render] (https://merchant.taler/webui/index.js:5:9452) 
at qb (https://merchant.taler/webui/index.js:5:7112) 
at https://merchant.taler/webui/index.js:5:2658 
at Array.some (<anonymous>)
```

you can get 

```
Error response did not even contain JSON. The request URL might be wrong or the service might be unavailable. 
    at [unknown] (../../../taler-util/src/errors.ts:305:11)
    at [unknown] (../../../taler-util/src/operation.ts:250:19)
    at opUnknownFailure (../../../web-util/src/hooks/useAsync.ts:51:20)
    at useAsync (../../../web-util/src/hooks/useAsync.ts:100:17)
    at useLongPolling (../../src/hooks/order.ts:68:17)
    at useOrderDetailsWithLongPoll (../../src/paths/instance/orders/details/index.tsx:41:17)
    at constructor (../../../../node_modules/.pnpm/preact@10.11.3/node_modules/preact/src/diff/index.js:554:13)
    at render (../../../../node_modules/.pnpm/preact@10.11.3/node_modules/preact/src/diff/index.js:203:13)
    at diff (../../../../node_modules/.pnpm/preact@10.11.3/node_modules/preact/src/component.js:132:2)
    at Array.some
```
