Merge pull request #129 from WalletConnect/feature/new_colors_and_ema…

…il_theme_fix Chore: Fix theme synchronization, update colors, implement smart contracts on email wallet
WalletConnect · May 22, 2024 · 5d7a1a5 · 5d7a1a5
2 parents cbccf90 + c881794
commit 5d7a1a5
Show file tree

Hide file tree

Showing 16 changed files with 93 additions and 108 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+## 3.2.1
+
+- Email Wallet improvements:
+  - Smart Contract interaction
+  - Enhanced theming
+
 ## 3.2.0
 
 - New feature: Email Wallet. Now you can create wallets by just using an email and graduate them to self-custodial if desired! Just toggle `enableEmail` on `W3MService` instance.

diff --git a/example/android/gradle.properties b/example/android/gradle.properties
@@ -1,5 +1,5 @@
 org.gradle.jvmargs=-Xmx1536M
 android.useAndroidX=true
 android.enableJetifier=true
-versionName=3.2.0
-versionCode=58
+versionName=3.2.1
+versionCode=59
diff --git a/example/ios/Runner.xcodeproj/project.pbxproj b/example/ios/Runner.xcodeproj/project.pbxproj
@@ -470,7 +470,7 @@
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = W5R8AG9K22;
 				ENABLE_BITCODE = NO;
@@ -496,7 +496,7 @@
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				GENERATE_INFOPLIST_FILE = YES;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.web3modal.flutterExample.RunnerTests;
@@ -514,7 +514,7 @@
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				GENERATE_INFOPLIST_FILE = YES;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.web3modal.flutterExample.RunnerTests;
@@ -530,7 +530,7 @@
 			buildSettings = {
 				BUNDLE_LOADER = "$(TEST_HOST)";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				GENERATE_INFOPLIST_FILE = YES;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.web3modal.flutterExample.RunnerTests;
@@ -655,7 +655,7 @@
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = W5R8AG9K22;
 				ENABLE_BITCODE = NO;
@@ -686,7 +686,7 @@
 				CODE_SIGN_IDENTITY = "Apple Development";
 				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Distribution";
 				CODE_SIGN_STYLE = Manual;
-				CURRENT_PROJECT_VERSION = 58;
+				CURRENT_PROJECT_VERSION = 59;
 				DEVELOPMENT_TEAM = "";
 				"DEVELOPMENT_TEAM[sdk=iphoneos*]" = W5R8AG9K22;
 				ENABLE_BITCODE = NO;

diff --git a/example/ios/Runner/Info.plist b/example/ios/Runner/Info.plist
@@ -19,7 +19,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>3.2.0</string>
+	<string>3.2.1</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -36,7 +36,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>58</string>
+	<string>59</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

diff --git a/example/lib/home_page.dart b/example/lib/home_page.dart
@@ -61,8 +61,8 @@ class _MyHomePageState extends State<MyHomePage> {
           universal: 'https://web3modal.com',
         ),
       ),
-      // enableAnalytics: true, // OPTIONAL - null by default
-      // enableEmail: true, // OPTIONAL - false by default
+      enableAnalytics: true, // OPTIONAL - null by default
+      enableEmail: true, // OPTIONAL - false by default
       // requiredNamespaces: {},
       // optionalNamespaces: {},
       // excludedWalletIds: {
@@ -410,15 +410,15 @@ ButtonStyle buttonStyle(BuildContext context) {
         return Web3ModalTheme.getDataOf(context).textStyles.small600.copyWith(
               color: (states.contains(MaterialState.disabled))
                   ? Web3ModalTheme.colorsOf(context).foreground300
-                  : Web3ModalTheme.colorsOf(context).background100,
+                  : Web3ModalTheme.colorsOf(context).inverse100,
             );
       },
     ),
     foregroundColor: MaterialStateProperty.resolveWith<Color>(
       (states) {
         return (states.contains(MaterialState.disabled))
             ? Web3ModalTheme.colorsOf(context).foreground300
-            : Web3ModalTheme.colorsOf(context).background100;
+            : Web3ModalTheme.colorsOf(context).inverse100;
       },
     ),
   );

diff --git a/example/lib/utils/crypto/eip155.dart b/example/lib/utils/crypto/eip155.dart
@@ -283,7 +283,7 @@ class EIP155 {
           rpcUrl: w3mService.selectedChain!.rpcUrl,
         );
         final d = (decimals.first as BigInt);
-        final requestValue = _formatValue(0.12, decimals: d);
+        final requestValue = _formatValue(0.01, decimals: d);
         return w3mService.requestWriteContract(
           topic: w3mService.session?.topic ?? '',
           chainId: w3mService.selectedChain!.namespace,

diff --git a/example/pubspec.lock b/example/pubspec.lock
@@ -1139,7 +1139,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "3.2.0"
+    version: "3.2.1"
   web_socket_channel:
     dependency: transitive
     description:

diff --git a/example/pubspec.yaml b/example/pubspec.yaml
@@ -3,7 +3,7 @@ description: A dApp showing how to use WalletConnect v2 with Flutter
 
 publish_to: "none"
 
-version: 3.2.0
+version: 3.2.1
 
 environment:
   sdk: ">=3.0.1 <4.0.0"

diff --git a/lib/services/coinbase_service/coinbase_service.dart b/lib/services/coinbase_service/coinbase_service.dart
@@ -111,12 +111,13 @@ class CoinbaseService implements ICoinbaseService {
   @protected
   @override
   Future<dynamic> cbRequest({
-    String? chainId,
+    required String chainId,
     required SessionRequestParams request,
   }) async {
     await _checkInstalled();
+    final cid = chainId.contains(':') ? chainId.split(':').last : chainId;
     try {
-      final req = Request(actions: [request.toCoinbaseRequest(chainId)]);
+      final req = Request(actions: [request.toCoinbaseRequest(cid)]);
       final result = (await CoinbaseWalletSDK.shared.makeRequest(req)).first;
       if (result.error != null) {
         final errorCode = result.error?.code;
@@ -128,7 +129,7 @@ class CoinbaseService implements ICoinbaseService {
       switch (req.actions.first.method) {
         case 'wallet_switchEthereumChain':
         case 'wallet_addEthereumChain':
-          final event = CoinbaseSessionEvent(chainId: chainId);
+          final event = CoinbaseSessionEvent(chainId: cid);
           onCoinbaseSessionUpdate.broadcast(event);
           break;
         case 'eth_requestAccounts':
@@ -220,14 +221,19 @@ extension on SessionRequestParams {
         );
       case MethodsConstants.ethSendTransaction:
         final jsonData = _getTransactionFromParams(params);
-        final hexValue = jsonData['value'].toString().replaceFirst('0x', '');
-        final value = int.parse(hexValue, radix: 16);
+        String? weiValue;
+        if (jsonData.containsKey('value')) {
+          final hexValue = jsonData['value'].toString().replaceFirst('0x', '');
+          final value = int.parse(hexValue, radix: 16);
+          weiValue = BigInt.from(value).toString();
+        }
+        final data = jsonData['data']?.toString() ?? '';
         return SendTransaction(
-          fromAddress: jsonData['from'],
-          toAddress: jsonData['to'],
+          fromAddress: jsonData['from'].toString(),
+          toAddress: jsonData['to'].toString(),
           chainId: chainId!,
-          weiValue: BigInt.from(value).toString(),
-          data: jsonData['data'] ?? '',
+          weiValue: weiValue,
+          data: data,
         );
       case MethodsConstants.walletSwitchEthChain:
       case MethodsConstants.walletAddEthChain:

diff --git a/lib/services/magic_service/magic_service.dart b/lib/services/magic_service/magic_service.dart
@@ -14,7 +14,6 @@ import 'package:web3modal_flutter/services/magic_service/i_magic_service.dart';
 import 'package:web3modal_flutter/services/magic_service/models/magic_data.dart';
 import 'package:web3modal_flutter/services/magic_service/models/magic_events.dart';
 import 'package:web3modal_flutter/services/magic_service/models/frame_message.dart';
-import 'package:web3modal_flutter/utils/util.dart';
 import 'package:web3modal_flutter/web3modal_flutter.dart';
 import 'package:webview_flutter/webview_flutter.dart';
 
@@ -39,7 +38,6 @@ class MagicService implements IMagicService {
   ];
   //
   final IWeb3App _web3app;
-  Web3ModalTheme? _currentTheme;
   Timer? _timeOutTimer;
   String? _connectionChainId;
   int _onLoadCount = 0;
@@ -223,7 +221,6 @@ class MagicService implements IMagicService {
   @override
   Future<void> syncTheme(Web3ModalTheme? theme) async {
     if (!isEnabled.value || !isReady.value) return;
-    _currentTheme = theme;
     final message = SyncTheme(theme: theme).toString();
     await _webViewController.runJavaScript('sendW3Message($message)');
   }
@@ -547,17 +544,6 @@ class MagicService implements IMagicService {
         console.log('w3mMessage posted =====> ' + JSON.stringify(message))
         iframeFL.contentWindow.postMessage(message, '*')
       }
-
-      // TODO this would have to be removed after proper implementation of syncTheme()
-      // const setModalColor = (color) => {
-      //   console.log('setModalColor =====> ' + color)
-      //   iframeFL.style.background = color
-      //   iframeFL.style.backgroundColor = color
-      //   iframeFL.contentWindow.document.body.style.backgroundColor = color
-      //   document.body.style.backgroundColor = color
-      //   const buttons = document.getElementsByClassName("signWrapper")
-      //   buttons[0].style.backgroundColor = color
-      // }
     ''');
   }
 
@@ -581,18 +567,6 @@ class MagicService implements IMagicService {
     }
   }
 
-  // ignore: unused_element
-  Future<void> _setModalColor() async {
-    await Future.delayed(Duration(milliseconds: 50));
-    final isDarkMode = _currentTheme?.isDarkMode ?? false;
-    final themeData = _currentTheme?.themeData ?? Web3ModalThemeData();
-    final rbgColor = isDarkMode
-        ? themeData.darkColors.background125
-        : themeData.lightColors.background125;
-    final jsColor = Util.colorToRGBA(rbgColor);
-    return await _webViewController.runJavaScript('setModalColor("$jsColor")');
-  }
-
   bool _isAllowedDomain(String domain) {
     final domains = _safeDomains.join('|');
     return RegExp(r'' + domains).hasMatch(domain);

diff --git a/lib/services/magic_service/models/frame_message.dart b/lib/services/magic_service/models/frame_message.dart
@@ -244,7 +244,6 @@ class SyncTheme extends MessageData {
   @override
   String toString() {
     final mode = theme?.isDarkMode == true ? 'dark' : 'light';
-    final tm = 'themeMode:\'$mode\'';
     final themeData = theme?.themeData ?? Web3ModalThemeData();
     late Web3ModalColors colors;
     if (mode == 'dark') {
@@ -253,22 +252,20 @@ class SyncTheme extends MessageData {
       colors = themeData.lightColors;
     }
 
-    // Available keys:
-    // '--w3m-accent'?: string
-    // '--w3m-color-mix'?: string
-    // '--w3m-color-mix-strength'?: number
-    // '--w3m-font-family'?: string
-    // '--w3m-font-size-master'?: string
-    // '--w3m-border-radius-master'?: string
-    // '--w3m-z-index'?: number
-
-    final c1 = '\'--w3m-accent\':\'${Util.colorToRGBA(colors.accent100)}\'';
-    // final c2 = '\'--w3m-color-mix\':\'${Util.colorToRGBA(colors.background125)}\'';
-    // final c3 = '\'--w3m-color-mix-strength\':100';
-    // final c4 = '\'--w3m-z-index\':100000000';
-    final tv = 'themeVariables:{$c1}';
-
-    return '{type:\'${super.type}\',payload:{$tm,$tv}}';
+    final tm = 'themeMode:\'$mode\'';
+
+    final mix = Util.colorToRGBA(colors.background125);
+    final tv1 = '\'--w3m-color-mix\':\'$mix\'';
+    // final tv2 = '\'--w3m-color-mix-strength\':\'0%\'';
+    final tv = 'themeVariables:{$tv1}';
+
+    final accent = Util.colorToRGBA(colors.accent100);
+    final wtv1 = '\'--w3m-accent\':\'$accent\'';
+    final background = Util.colorToRGBA(colors.background125);
+    final wtv2 = '\'--w3m-background\':\'$background\'';
+    final w3mtv = 'w3mThemeVariables:{$wtv1,$wtv2}';
+
+    return '{type:\'${super.type}\',payload:{$tm, $tv,$w3mtv}}';
   }
 }
 

diff --git a/lib/services/w3m_service/w3m_service.dart b/lib/services/w3m_service/w3m_service.dart
@@ -209,14 +209,13 @@ class W3MService with ChangeNotifier, CoinbaseService implements IW3MService {
     await _web3App.init();
 
     _currentSession = await _getStoredSession();
-    if (_currentSession != null) {
-      if (_currentSession!.sessionService.isMagic ||
-          _currentSession!.sessionService.isCoinbase) {
-        final chainId = _currentSession!.chainId;
-        _currentSelectedChain = W3MChainPresets.chains[chainId];
-        await _setSesionAndChainData(_currentSession!);
-      }
-      if (_currentSession!.sessionService.isMagic) {
+    final isMagic = _currentSession?.sessionService.isMagic == true;
+    final isCoinbase = _currentSession?.sessionService.isCoinbase == true;
+    if (isMagic || isCoinbase) {
+      final chainId = _currentSession!.chainId;
+      _currentSelectedChain = W3MChainPresets.chains[chainId];
+      await _setSesionAndChainData(_currentSession!);
+      if (isMagic) {
         await magicService.instance.init();
       }
     } else {
@@ -886,23 +885,27 @@ class W3MService with ChangeNotifier, CoinbaseService implements IW3MService {
     List parameters = const [],
   }) async {
     try {
-      // TODO [W3MService] Support Smart Contract with email if possible
-      if (_currentSession!.sessionService.isMagic) {
-        throw 'Write to Smart Contract is currently not supported with Email Wallet';
-      }
-      // TODO [W3MService] Support Smart Contract with Coinbase if possible
-      if (_currentSession!.sessionService.isCoinbase) {
-        throw 'Write to Smart Contract is currently not supported with Coinbase Wallet';
-      }
-      return await _web3App.requestWriteContract(
+      final requestParams = SessionRequestParams(
+        method: MethodsConstants.ethSendTransaction,
+        params: [
+          Transaction.callContract(
+            contract: deployedContract,
+            function: deployedContract.function(functionName),
+            from: transaction.from,
+            value: transaction.value,
+            maxGas: transaction.maxGas,
+            gasPrice: transaction.gasPrice,
+            nonce: transaction.nonce,
+            maxFeePerGas: transaction.maxFeePerGas,
+            maxPriorityFeePerGas: transaction.maxPriorityFeePerGas,
+            parameters: parameters,
+          ).toJson(),
+        ],
+      );
+      return request(
         topic: topic,
         chainId: chainId,
-        rpcUrl: rpcUrl,
-        deployedContract: deployedContract,
-        functionName: functionName,
-        transaction: transaction,
-        method: method,
-        parameters: parameters,
+        request: requestParams,
       );
     } catch (e) {
       rethrow;
@@ -928,7 +931,7 @@ class W3MService with ChangeNotifier, CoinbaseService implements IW3MService {
       }
       if (_currentSession!.sessionService.isCoinbase) {
         return await cbRequest(
-          chainId: switchToChainId ?? chainId.split(':').last,
+          chainId: switchToChainId ?? chainId,
           request: request,
         );
       }
@@ -1017,7 +1020,7 @@ class W3MService with ChangeNotifier, CoinbaseService implements IW3MService {
         (key, value) => MapEntry(
           key,
           RequiredNamespace(
-            chains: value.chains ?? [W3MChainPresets.chains['1']!.namespace],
+            chains: value.chains,
             methods: value.methods,
             events: value.events,
           ),
@@ -1036,8 +1039,7 @@ class W3MService with ChangeNotifier, CoinbaseService implements IW3MService {
         (key, value) => MapEntry(
           key,
           RequiredNamespace(
-            chains: value.chains ??
-                W3MChainPresets.chains.values.map((e) => e.namespace).toList(),
+            chains: value.chains,
             methods: value.methods,
             events: value.events,
           ),