summaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension/src/components
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2022-01-24 14:12:12 -0300
committerSebastian <sebasjm@gmail.com>2022-01-24 14:12:12 -0300
commit882d6b3710f82d85b2129f09c63f9db45985ef64 (patch)
treef6304b6bb539e78d3ca4711fa5483dc6657f2163 /packages/taler-wallet-webextension/src/components
parentec059d42d77a5f092135635f478790e77a2685df (diff)
downloadwallet-core-882d6b3710f82d85b2129f09c63f9db45985ef64.tar.gz
wallet-core-882d6b3710f82d85b2129f09c63f9db45985ef64.tar.bz2
wallet-core-882d6b3710f82d85b2129f09c63f9db45985ef64.zip
last activity -> pending; fix downloadTos
Diffstat (limited to 'packages/taler-wallet-webextension/src/components')
-rw-r--r--packages/taler-wallet-webextension/src/components/TransactionItem.tsx26
-rw-r--r--packages/taler-wallet-webextension/src/components/styled/index.tsx13
2 files changed, 14 insertions, 25 deletions
diff --git a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
index 206dcb0c5..db26abec6 100644
--- a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
+++ b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
@@ -15,6 +15,8 @@
*/
import {
+ AmountJson,
+ Amounts,
AmountString,
Timestamp,
Transaction,
@@ -37,10 +39,7 @@ import {
} from "./styled";
import { Time } from "./Time";
-export function TransactionItem(props: {
- tx: Transaction;
- multiCurrency: boolean;
-}): VNode {
+export function TransactionItem(props: { tx: Transaction }): VNode {
const tx = props.tx;
switch (tx.type) {
case TransactionType.Withdrawal:
@@ -53,7 +52,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageBank}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
case TransactionType.Payment:
@@ -67,7 +65,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageShoppingCart}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
case TransactionType.Refund:
@@ -80,7 +77,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageRefund}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
case TransactionType.Tip:
@@ -93,7 +89,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageHandHeart}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
case TransactionType.Refresh:
@@ -106,7 +101,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageRefresh}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
case TransactionType.Deposit:
@@ -119,7 +113,6 @@ export function TransactionItem(props: {
timestamp={tx.timestamp}
iconPath={imageRefresh}
pending={tx.pending}
- multiCurrency={props.multiCurrency}
/>
);
}
@@ -144,13 +137,12 @@ function TransactionLayout(props: TransactionLayoutProps): VNode {
</LightText>
)}
<SmallLightText style={{ marginTop: 5 }}>
- <Time timestamp={props.timestamp} format="dd MMM, hh:mm" />
+ <Time timestamp={props.timestamp} format="hh:mm" />
</SmallLightText>
</Column>
<TransactionAmount
pending={props.pending}
- amount={props.amount}
- multiCurrency={props.multiCurrency}
+ amount={Amounts.parseOrThrow(props.amount)}
debitCreditIndicator={props.debitCreditIndicator}
/>
</HistoryRow>
@@ -166,18 +158,15 @@ interface TransactionLayoutProps {
id: string;
iconPath: string;
pending: boolean;
- multiCurrency: boolean;
}
interface TransactionAmountProps {
debitCreditIndicator: "debit" | "credit" | "unknown";
- amount: AmountString | "unknown";
+ amount: AmountJson;
pending: boolean;
- multiCurrency: boolean;
}
function TransactionAmount(props: TransactionAmountProps): VNode {
- const [currency, amount] = props.amount.split(":");
let sign: string;
switch (props.debitCreditIndicator) {
case "credit":
@@ -204,9 +193,8 @@ function TransactionAmount(props: TransactionAmountProps): VNode {
>
<ExtraLargeText>
{sign}
- {amount}
+ {Amounts.stringifyValue(props.amount)}
</ExtraLargeText>
- {props.multiCurrency && <div>{currency}</div>}
{props.pending && <div>PENDING</div>}
</Column>
);
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index 2d16b496c..5dd7318b7 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -77,7 +77,7 @@ export const WalletBox = styled.div<{ noPadding?: boolean }>`
justify-content: space-between;
align-items: center;
& > * {
- width: 400px;
+ width: 500px;
}
& > section {
padding: ${({ noPadding }) => (noPadding ? "0px" : "8px")};
@@ -142,7 +142,7 @@ export const Middle = styled.div`
export const PopupBox = styled.div<{ noPadding?: boolean; devMode: boolean }>`
height: 290px;
- width: ${({ devMode }) => (!devMode ? "400px" : "500px")};
+ width: 500px;
display: flex;
flex-direction: column;
justify-content: space-between;
@@ -783,7 +783,7 @@ export const PopupNavigation = styled.div<{ devMode?: boolean }>`
display: flex;
& > div {
- width: ${({ devMode }) => (!devMode ? "400px" : "500px")};
+ width: 500px;
}
& > div > a {
@@ -815,15 +815,16 @@ export const NiceSelect = styled.div`
box-shadow: none;
background-image: ${image};
- background-position: right 8px center;
+ background-position: right 4px center;
background-repeat: no-repeat;
- background-size: 1.5em 1.5em;
+ background-size: 32px 32px;
background-color: white;
border-radius: 0.25rem;
font-size: 1em;
- padding: 0.5em 3em 0.5em 1em;
+ padding: 8px 32px 8px 8px;
+ /* 0.5em 3em 0.5em 1em; */
cursor: pointer;
}