From 882d6b3710f82d85b2129f09c63f9db45985ef64 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Mon, 24 Jan 2022 14:12:12 -0300
Subject: last activity -> pending; fix downloadTos

---
 .../src/components/TransactionItem.tsx             | 26 ++++++----------------
 .../src/components/styled/index.tsx                | 13 ++++++-----
 2 files changed, 14 insertions(+), 25 deletions(-)

(limited to 'packages/taler-wallet-webextension/src/components')

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;
   }
 
-- 
cgit v1.2.3