feat: move the pin rules below the pin input

Signed-off-by: FarjadGov14 <[email protected]>
openwallet-foundation · Nov 14, 2024 · 600d001 · 600d001
1 parent 2397235
commit 600d001
Showing 1 changed file with 18 additions and 18 deletions.
diff --git a/packages/legacy/core/App/screens/PINCreate.tsx b/packages/legacy/core/App/screens/PINCreate.tsx
@@ -281,24 +281,6 @@ const PINCreate: React.FC<PINCreateProps> = ({ setAuthenticated, explainedStatus
             autoFocus={false}
             inlineMessage={inlineMessageField1}
           />
-          {PINSecurity.displayHelper && (
-            <View style={{ marginBottom: 16 }}>
-              {PINOneValidations.map((validation, index) => {
-                return (
-                  <View style={{ flexDirection: 'row' }} key={index}>
-                    {validation.isInvalid ? (
-                      <Icon name="clear" size={iconSize} color={ColorPallet.notification.errorIcon} />
-                    ) : (
-                      <Icon name="check" size={iconSize} color={ColorPallet.notification.successIcon} />
-                    )}
-                    <Text style={[TextTheme.normal, { paddingLeft: 4 }]}>
-                      {t(`PINCreate.Helper.${validation.errorName}`)}
-                    </Text>
-                  </View>
-                )
-              })}
-            </View>
-          )}
           <PINInput
             label={t('PINCreate.ReenterPIN', { new: updatePin ? t('PINCreate.NewPIN') + ' ' : '' })}
             onPINChanged={(p: string) => {
@@ -321,6 +303,24 @@ const PINCreate: React.FC<PINCreateProps> = ({ setAuthenticated, explainedStatus
             ref={PINTwoInputRef}
             inlineMessage={inlineMessageField2}
           />
+          {PINSecurity.displayHelper && (
+            <View style={{ marginBottom: 16 }}>
+              {PINOneValidations.map((validation, index) => {
+                return (
+                  <View style={{ flexDirection: 'row' }} key={index}>
+                    {validation.isInvalid ? (
+                      <Icon name="clear" size={iconSize} color={ColorPallet.notification.errorIcon} />
+                    ) : (
+                      <Icon name="check" size={iconSize} color={ColorPallet.notification.successIcon} />
+                    )}
+                    <Text style={[TextTheme.normal, { paddingLeft: 4 }]}>
+                      {t(`PINCreate.Helper.${validation.errorName}`)}
+                    </Text>
+                  </View>
+                )
+              })}
+            </View>
+          )}
           {modalState.visible && (
             <AlertModal
               title={modalState.title}