Fixed misalignment issue with multiselect cells

MetaMask · Jul 25, 2023 · 29acce5 · 29acce5
1 parent 32ea4dd
commit 29acce5
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 5 deletions.
diff --git a/...omponent-library/components/Cells/Cell/variants/CellMultiSelect/CellMultiSelect.styles.ts b/...omponent-library/components/Cells/Cell/variants/CellMultiSelect/CellMultiSelect.styles.ts
@@ -24,6 +24,9 @@ const styleSheet = (params: {
 
   return StyleSheet.create({
     base: Object.assign({} as ViewStyle, style) as ViewStyle,
+    cell: {
+      flex: 1,
+    },
   });
 };
 

diff --git a/app/component-library/components/Cells/Cell/variants/CellMultiSelect/CellMultiSelect.tsx b/app/component-library/components/Cells/Cell/variants/CellMultiSelect/CellMultiSelect.tsx
@@ -39,6 +39,7 @@ const CellMultiSelect = ({
         secondaryText={secondaryText}
         tertiaryText={tertiaryText}
         tagLabel={tagLabel}
+        style={styles.cell}
       >
         {children}
       </CellBase>

diff --git a/...omponents/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap b/...omponents/Cells/Cell/variants/CellMultiSelect/__snapshots__/CellMultiSelect.test.tsx.snap
@@ -16,6 +16,11 @@ exports[`CellMultiSelect - Snapshot should render default settings correctly 1`]
         "variant": "Account",
       }
     }
+    style={
+      Object {
+        "flex": 1,
+      }
+    }
     title="Orangefox.eth"
   />
 </MultiSelectItem>
@@ -37,6 +42,11 @@ exports[`CellMultiSelect - Snapshot should render the proper selected state 1`]
         "variant": "Account",
       }
     }
+    style={
+      Object {
+        "flex": 1,
+      }
+    }
     title="Orangefox.eth"
   />
 </MultiSelectItem>

diff --git a/...component-library/components/Select/MultiSelect/MultiSelectItem/MultiSelectItem.styles.ts b/...component-library/components/Select/MultiSelect/MultiSelectItem/MultiSelectItem.styles.ts
@@ -25,7 +25,6 @@ const styleSheet = (params: {
   return StyleSheet.create({
     base: Object.assign(
       {
-        flexDirection: 'row',
         alignItems: 'flex-start',
         backgroundColor: colors.background.default,
         opacity: isDisabled ? 0.5 : 1,

diff --git a/...components/Select/MultiSelect/MultiSelectItem/__snapshots__/MultiSelectItem.test.tsx.snap b/...components/Select/MultiSelect/MultiSelectItem/__snapshots__/MultiSelectItem.test.tsx.snap
@@ -7,7 +7,6 @@ exports[`MultiSelectItem should render snapshot correctly 1`] = `
     Object {
       "alignItems": "flex-start",
       "backgroundColor": "#FFFFFF",
-      "flexDirection": "row",
       "opacity": 1,
     }
   }

diff --git a/ios/Podfile.lock b/ios/Podfile.lock
@@ -823,11 +823,11 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/yoga"
 
 SPEC CHECKSUMS:
-  boost: a7c83b31436843459a1961bfd74b96033dc77234
+  boost: 57d2868c099736d80fcd648bf211b4431e51a558
   Branch: 4ac024cb3c29b0ef628048694db3c4cfa679beb0
   BVLinearGradient: e3aad03778a456d77928f594a649e96995f1c872
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
-  DoubleConversion: 831926d9b8bf8166fd87886c4abab286c2422662
+  DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
   FBLazyVector: a83ceaa8a8581003a623facdb3c44f6d4f342ac5
   FBReactNativeSpec: 85eee79837cb797ab6176f0243a2b40511c09158
   Flipper: 26fc4b7382499f1281eb8cb921e5c3ad6de91fe0
@@ -840,7 +840,7 @@ SPEC CHECKSUMS:
   Flipper-RSocket: d9d9ade67cbecf6ac10730304bf5607266dd2541
   FlipperKit: cbdee19bdd4e7f05472a66ce290f1b729ba3cb86
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 5337263514dd6f09803962437687240c5dc39aa4
+  glog: 04b94705f318337d7ead9e6d17c019bd9b1f6b1b
   JitsiWebRTC: f441eb0e2d67f0588bf24e21c5162e97342714fb
   libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
   lottie-ios: 016449b5d8be0c3dcbcfa0a9988469999cd04c5d
-Original file line number
+Diff line change
@@ Expand Up / @@ -24,6 +24,9 @@ const styleSheet = (params: { @@
       return StyleSheet.create({
         base: Object.assign({} as ViewStyle, style) as ViewStyle,
+        cell: {
+          flex: 1,
+        },
       });
     };
@@ Expand Down @@