[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-merchant-backoffice] branch master updated: fix storybook example
|
From: |
gnunet |
|
Subject: |
[taler-merchant-backoffice] branch master updated: fix storybook example to show QR details |
|
Date: |
Mon, 06 Sep 2021 19:15:19 +0200 |
This is an automated email from the git hooks/post-receive script.
sebasjm pushed a commit to branch master
in repository merchant-backoffice.
The following commit(s) were added to refs/heads/master by this push:
new 40f55ba fix storybook example to show QR details
40f55ba is described below
commit 40f55baff0001918c210e99935ab3df12f498b5f
Author: Sebastian <sebasjm@gmail.com>
AuthorDate: Mon Sep 6 14:14:59 2021 -0300
fix storybook example to show QR details
---
packages/backend/src/components/QR.tsx | 16 ++++++++++------
packages/backend/src/pages/DepletedTip.tsx | 4 +++-
packages/backend/src/pages/OfferRefund.stories.tsx | 6 +++++-
packages/backend/src/pages/OfferRefund.tsx | 4 +++-
packages/backend/src/pages/OfferTip.stories.tsx | 6 +++++-
packages/backend/src/pages/OfferTip.tsx | 4 +++-
packages/backend/src/pages/RequestPayment.stories.tsx | 10 ++++++----
packages/backend/src/pages/RequestPayment.tsx | 4 +++-
packages/backend/src/pages/ShowOrderDetails.stories.tsx | 13 ++++++++++++-
packages/backend/src/pages/ShowOrderDetails.tsx | 15 +++++++--------
10 files changed, 57 insertions(+), 25 deletions(-)
diff --git a/packages/backend/src/components/QR.tsx
b/packages/backend/src/components/QR.tsx
index 95aee36..4418f1c 100644
--- a/packages/backend/src/components/QR.tsx
+++ b/packages/backend/src/components/QR.tsx
@@ -18,15 +18,19 @@
import { useEffect, useRef } from "preact/hooks";
import qrcode from "qrcode-generator";
+export function createSVG(text:string):string {
+ const qr = qrcode(0, 'L');
+ qr.addData(text);
+ qr.make();
+ return qr.createSvgTag({
+ scalable: true,
+ });
+}
+
export function QR({ text }: { text: string; }):VNode {
const divRef = useRef<HTMLDivElement>(null);
useEffect(() => {
- const qr = qrcode(0, 'L');
- qr.addData(text);
- qr.make();
- divRef.current.innerHTML = qr.createSvgTag({
- scalable: true,
- });
+ divRef.current.innerHTML = createSVG(text)
});
return <div style={{ width: '100%', display: 'flex', flexDirection:
'column', alignItems: 'center' }}>
diff --git a/packages/backend/src/pages/DepletedTip.tsx
b/packages/backend/src/pages/DepletedTip.tsx
index 1e2e411..8345484 100644
--- a/packages/backend/src/pages/DepletedTip.tsx
+++ b/packages/backend/src/pages/DepletedTip.tsx
@@ -45,7 +45,9 @@ export function mount(): void {
render(<DepletedTip />, document.body);
} catch (e) {
console.error("got error", e);
- document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ if (e instanceof Error) {
+ document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ }
}
}
diff --git a/packages/backend/src/pages/OfferRefund.stories.tsx
b/packages/backend/src/pages/OfferRefund.stories.tsx
index 4a5e9ab..ce358b4 100644
--- a/packages/backend/src/pages/OfferRefund.stories.tsx
+++ b/packages/backend/src/pages/OfferRefund.stories.tsx
@@ -20,6 +20,7 @@
*/
import { h, VNode, FunctionalComponent } from 'preact';
+import { createSVG } from '../components/QR';
import { OfferRefund as TestedComponent } from './OfferRefund';
@@ -36,6 +37,9 @@ function createExample<Props>(Component:
FunctionalComponent<Props>, props: Part
return r
}
+const REFUND_URI_EXAMPLE =
'taler+http://refund/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0'
+
export const Example = createExample(TestedComponent, {
- refundURI:
'taler+http://refund/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0'
+ refundURI: REFUND_URI_EXAMPLE,
+ qr_code: createSVG(REFUND_URI_EXAMPLE)
});
diff --git a/packages/backend/src/pages/OfferRefund.tsx
b/packages/backend/src/pages/OfferRefund.tsx
index db006d3..0d71e88 100644
--- a/packages/backend/src/pages/OfferRefund.tsx
+++ b/packages/backend/src/pages/OfferRefund.tsx
@@ -142,7 +142,9 @@ export function mount(): void {
/>, document.body);
} catch (e) {
console.error("got error", e);
- document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ if (e instanceof Error) {
+ document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ }
}
}
diff --git a/packages/backend/src/pages/OfferTip.stories.tsx
b/packages/backend/src/pages/OfferTip.stories.tsx
index 9685fea..dfbf71f 100644
--- a/packages/backend/src/pages/OfferTip.stories.tsx
+++ b/packages/backend/src/pages/OfferTip.stories.tsx
@@ -20,6 +20,7 @@
*/
import { h, VNode, FunctionalComponent } from 'preact';
+import { createSVG } from '../components/QR';
import { OfferTip as TestedComponent } from './OfferTip';
@@ -36,6 +37,9 @@ function createExample<Props>(Component:
FunctionalComponent<Props>, props: Part
return r
}
+const TIP_URI_EXAMPLE =
'taler+http://tip/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0'
+
export const Example = createExample(TestedComponent, {
- tipURI:
'taler+http://tip/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0',
+ tipURI: TIP_URI_EXAMPLE,
+ qr_code: createSVG(TIP_URI_EXAMPLE)
});
diff --git a/packages/backend/src/pages/OfferTip.tsx
b/packages/backend/src/pages/OfferTip.tsx
index 1c9d84a..8fc3805 100644
--- a/packages/backend/src/pages/OfferTip.tsx
+++ b/packages/backend/src/pages/OfferTip.tsx
@@ -129,7 +129,9 @@ export function mount(): void {
render(<OfferTip tipURI={uri} tip_status_url={tsu} />, document.body);
} catch (e) {
console.error("got error", e);
- document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ if (e instanceof Error) {
+ document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ }
}
}
diff --git a/packages/backend/src/pages/RequestPayment.stories.tsx
b/packages/backend/src/pages/RequestPayment.stories.tsx
index 6c9db0f..5d6d79a 100644
--- a/packages/backend/src/pages/RequestPayment.stories.tsx
+++ b/packages/backend/src/pages/RequestPayment.stories.tsx
@@ -19,10 +19,9 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { h, VNode, FunctionalComponent } from 'preact';
+import { FunctionalComponent, h } from 'preact';
+import { createSVG } from '../components/QR';
import { RequestPayment as TestedComponent } from './RequestPayment';
-import { QR } from '../components/QR';
-import { render as renderToString } from 'preact-render-to-string';
export default {
@@ -38,6 +37,9 @@ function createExample<Props>(Component:
FunctionalComponent<Props>, props: Part
return r
}
+const PAYTO_URI_EXAMPLE =
'taler+http://pay/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0'
+
export const Example = createExample(TestedComponent, {
- payURI:
'taler+http://pay/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0'
+ payURI:
'taler+http://pay/merchant-backend.taler/2021.242-01G2X4275RBWG/?c=66BE594PDZR24744J6EQK52XM0',
+ qr_code: createSVG(PAYTO_URI_EXAMPLE)
});
diff --git a/packages/backend/src/pages/RequestPayment.tsx
b/packages/backend/src/pages/RequestPayment.tsx
index 6b2b84c..d171a75 100644
--- a/packages/backend/src/pages/RequestPayment.tsx
+++ b/packages/backend/src/pages/RequestPayment.tsx
@@ -170,7 +170,9 @@ export function mount(): void {
/>, document.body);
} catch (e) {
console.error("got error", e);
- document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ if (e instanceof Error) {
+ document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ }
}
}
diff --git a/packages/backend/src/pages/ShowOrderDetails.stories.tsx
b/packages/backend/src/pages/ShowOrderDetails.stories.tsx
index 5ed7d93..a78618f 100644
--- a/packages/backend/src/pages/ShowOrderDetails.stories.tsx
+++ b/packages/backend/src/pages/ShowOrderDetails.stories.tsx
@@ -20,6 +20,7 @@
*/
import { FunctionalComponent, h } from 'preact';
+import { MerchantBackend } from '../declaration';
import { ShowOrderDetails as TestedComponent } from './ShowOrderDetails';
@@ -38,5 +39,15 @@ function createExample<Props>(Component:
FunctionalComponent<Props>, props: Part
export const Example = createExample(TestedComponent, {
order_summary: 'here goes the order summary',
- refund_amount: 'USR:10',
+ refund_amount: 'USD:10',
+ contract_terms: {
+ amount: 'USD:10',
+ summary: 'this is a short summary',
+ pay_deadline: {
+ t_ms: new Date().getTime() + 6*24*60*60*1000
+ },
+ merchant: {
+ name: 'the merchant (inc)'
+ }
+ } as MerchantBackend.ContractTerms
});
diff --git a/packages/backend/src/pages/ShowOrderDetails.tsx
b/packages/backend/src/pages/ShowOrderDetails.tsx
index 526eafd..4bde798 100644
--- a/packages/backend/src/pages/ShowOrderDetails.tsx
+++ b/packages/backend/src/pages/ShowOrderDetails.tsx
@@ -81,21 +81,18 @@ export function ShowOrderDetails({ order_summary,
refund_amount, contract_terms
<pre>
<table>
<tr>
- <td>amount</td><td>{contract_terms?.amount || `{{
contract_terms.amount }}`}</td>
+ <td style={{fontWeight:
'bold'}}>amount</td><td>{contract_terms?.amount || `{{ contract_terms.amount
}}`}</td>
</tr>
<tr>
- <td>summary</td><td>{contract_terms?.summary || `{{
contract_terms.summary }}`}</td>
+ <td style={{fontWeight:
'bold'}}>summary</td><td>{contract_terms?.summary || `{{ contract_terms.summary
}}`}</td>
</tr>
<tr>
- <td>pay deadline</td><td>{pay_deadline || `{{
contract_terms.pay_deadline.t_ms }}`}</td>
+ <td style={{fontWeight: 'bold'}}>pay deadline</td><td>{pay_deadline
|| `{{ contract_terms.pay_deadline.t_ms }}`}</td>
</tr>
<tr>
- <td>merchant name</td><td>{contract_terms?.merchant?.name || `{{
contract_terms.merchant.name }}`}</td>
+ <td style={{fontWeight: 'bold'}}>merchant
name</td><td>{contract_terms?.merchant?.name || `{{
contract_terms.merchant.name }}`}</td>
</tr>
</table>
- <div>
- {`{{{contract_terms!stringify }}}`}
- </div>
</pre>
</Fragment>
@@ -119,7 +116,9 @@ export function mount(): void {
} catch (e) {
console.error("got error", e);
- document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ if (e instanceof Error) {
+ document.body.innerText = `Fatal error: "${e.message}". Please report
this bug at https://bugs.gnunet.org/.`;
+ }
}
}
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.
| [Prev in Thread] |
Current Thread |
[Next in Thread] |
- [taler-merchant-backoffice] branch master updated: fix storybook example to show QR details,
gnunet <=