add transfer UI style

lib/apps/primitives.dart

@@ -117,7 +117,7 @@ extension MessageTypeExtension on MessageType {
         return MessageType.Video;
       case 8:
         return MessageType.Invite;
-      case 8:
+      case 9:
         return MessageType.Transfer;
       default:
         return MessageType.String;
@@ -198,13 +198,13 @@ class BaseMessage {
     return [type, gid, addr, name, proof, key];
   }
 
-  // [hash, to, amount, name]
+  // [hash, to, amount, name, network]
   List<String> showTransfer() {
     return this.content.split(";");
   }
 
-  static String mergeTransfer(String hash, String to, String amount, String name) {
-    return "${hash};${to};${amount};${name}";
+  static String mergeTransfer(String hash, String to, String amount, String name, int network, int decimal) {
+    return "${hash};${to};${amount};${name};${network};${decimal}";
   }
 
   static String rawRecordName(int time, String name) {

lib/apps/wallet/models.dart

@@ -287,8 +287,10 @@ class Token {
 
   double get amount => double.parse(this.balance);
 
-  String get logo {
-    switch (name.toUpperCase()) {
+  String get logo => getLogo(name, chain);
+
+  static String getLogo(String n, [ChainToken c = ChainToken.ERC20]) {
+    switch (n.toUpperCase()) {
       case 'ETH':
         return 'assets/logo/logo_eth.png';
       case 'USDT':
@@ -296,9 +298,9 @@ class Token {
       case 'ESNFT':
         return 'assets/logo/logo_esse_nft.png';
       default:
-        if (chain == ChainToken.ERC20) {
+        if (c == ChainToken.ERC20) {
           return 'assets/logo/logo_erc20.png';
-        } else if (chain == ChainToken.ERC721) {
+        } else if (c == ChainToken.ERC721) {
           return 'assets/logo/logo_nft.png';
         } else {
           return 'assets/logo/logo_btc.png';

lib/widgets/chat_input.dart

@@ -128,11 +128,11 @@ class ChatInputState extends State<ChatInput> {
     });
   }
 
-  _tokenCallback(String hash, String to, String amount, String name) {
+  _tokenCallback(String hash, String to, String amount, String name, int network, int decimal) {
     _restore();
     widget.callback(
       MessageType.Transfer,
-      BaseMessage.mergeTransfer(hash, to, amount, name)
+      BaseMessage.mergeTransfer(hash, to, amount, name, network, decimal)
     );
   }
 

lib/widgets/chat_message.dart

@@ -18,6 +18,7 @@ import 'package:esse/rpc.dart';
 import 'package:esse/apps/primitives.dart';
 import 'package:esse/apps/chat/models.dart' show Request;
 import 'package:esse/apps/file/models.dart' show FileType, FileTypeExtension, parseFileType;
+import 'package:esse/apps/wallet/models.dart' show NetworkExtension, Network, Token, unitBalance;
 
 class ChatMessage extends StatelessWidget {
   final Widget? avatar;
@@ -287,6 +288,51 @@ class ChatMessage extends StatelessWidget {
     }
   }
 
+  Widget _showTransfer(context, lang, color, maxWidth) {
+    // transfer [hash, to, amount, name, network, decimal]
+    final infos = message.showTransfer();
+    if (infos.length > 3) {
+      final logo = Token.getLogo(infos[3]);
+      final network = infos.length > 4 ? NetworkExtension.fromInt(int.parse(infos[4])) : Network.EthMain;
+      final decimal = infos.length > 5 ? int.parse(infos[5]) : 18;
+      final amount = unitBalance(infos[2], decimal, 4);
+      return Container(
+        padding: const EdgeInsets.only(top: 10, bottom: 6.0, left: 10.0, right: 10.0),
+        width: 200.0,
+        decoration: BoxDecoration(
+          color: network.params()[1].withOpacity(0.3),
+          borderRadius: BorderRadius.circular(10.0)
+        ),
+        child: Column(crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Row(children: [
+                Container(
+                  width: 36.0,
+                  height: 36.0,
+                  decoration: BoxDecoration(
+                    image: DecorationImage(
+                      image: AssetImage(logo),
+                      fit: BoxFit.cover,
+                    ),
+                  ),
+                ),
+                Container(width: 135.0, padding: const EdgeInsets.only(left: 10.0),
+                  child: Column(children: [
+                      Text("${amount} ${infos[3]}", maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(color: color.onPrimary, fontSize: 16.0)),
+                      const SizedBox(height: 4.0),
+                      Text(infos[1], maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(color: Colors.grey, fontSize: 12.0)),
+            ]))]),
+            const SizedBox(height: 5.0),
+            const Divider(height: 1.0, color: Color(0x40ADB0BB)),
+            const SizedBox(height: 3.0),
+            Text(infos[0], maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(color: Colors.grey, fontSize: 10.0)),
+        ])
+      );
+    } else {
+      return _showText(context, color, maxWidth);
+    }
+  }
+
 
   Widget _show(context, color, lang, isDesktop, maxWidth) {
     //final width = MediaQuery.of(context).size.width * 0.6;
@@ -303,6 +349,8 @@ class ChatMessage extends StatelessWidget {
       return  _showRecord();
     } else if (message.type == MessageType.Invite) {
       return  _showInvite(context, lang, color, maxWidth);
+    } else if (message.type == MessageType.Transfer) {
+      return  _showTransfer(context, lang, color, maxWidth);
     }
     return _showText(context, color, maxWidth);
   }

lib/widgets/transfer.dart

@@ -310,7 +310,36 @@ class _TransferState extends State<Transfer> {
           controller: _amountController,
           focus: _amountFocus
         ),
-        const SizedBox(height: 20.0),
+        const SizedBox(height: 10.0),
+        if (this._checked)
+        Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Icon(Icons.arrow_forward, color: Colors.green),
+            const SizedBox(width: 10.0),
+            Expanded(
+              child: this._networkError.length > 1
+              ? Text(this._networkError,
+                textAlign: TextAlign.center, style: TextStyle(color: Colors.red))
+              : RichText(
+                textAlign: TextAlign.center,
+                text: TextSpan(
+                  text: 'Estimated Price = ',
+                  style: TextStyle(
+                    fontSize: 14.0, fontStyle: FontStyle.italic, color: Colors.green),
+                  children: <TextSpan>[
+                    TextSpan(text: this._price + ' Gwei',
+                      style: TextStyle(fontWeight: FontWeight.bold)),
+                    TextSpan(text: ', Gas ≈ '),
+                    TextSpan(text: this._gas + ' ETH',
+                      style: TextStyle(fontWeight: FontWeight.bold)),
+                  ],
+                ),
+              )
+            ),
+          ]
+        ),
+        const SizedBox(height: 10.0),
         this._checked
         ? ButtonText(
           text: lang.send,
@@ -345,7 +374,10 @@ class _TransferState extends State<Transfer> {
                     final addressId = res.params[0];
                     final network = NetworkExtension.fromInt(res.params[1]);
                     final tx = Transaction.fromList(res.params[2]);
-                    widget.callback(tx.hash, tx.to, amount, this._selectedToken.name);
+                    widget.callback(tx.hash, tx.to, amount,
+                      this._selectedToken.name, this._selectedNetwork.toInt(),
+                      this._selectedToken.decimal,
+                    );
                     Navigator.of(context).pop();
                   } else {
                     this._networkError = res.error;