be-components 3.3.6 → 3.3.7

package/lib/module/Authenticator/Components/StrategyForm.js

@@ -1,16 +1,15 @@
 import React, { useEffect, useState } from 'react';
-import { Button, Checkbox, Icons, Text, TextInput } from "../../Components";
-import Colors from "../../constants/colors";
+import { Checkbox, Icons, TextInput } from "../../Components";
 import { AuthenticateApi, AuthenticateHelpers } from '../api';
-import { Linking, TouchableOpacity, View, FlatList, Image } from 'react-native';
-import { view_styles } from '../../constants/styles';
+import { Linking, TouchableOpacity, FlatList } from 'react-native';
 import { ProfileHelpers } from '../../ProfileManager/api';
 import AuthStrategyIdentifier from './AuthStrategyIdentifier';
-const mini_steps = ['intro', 'execution', 'verify'];
+import { useColors } from '../../constants/useColors';
+import { Text, View, Button } from '../../Components/Themed';
+//const mini_steps = ['intro', 'execution', 'verify']
+
 const StrategyForm = ({
   visible,
-  company,
-  theme,
   strategy,
   auth_strategy_id,
   company_id,
@@ -18,17 +17,18 @@ const StrategyForm = ({
   source,
   show_referral,
   referral_code,
-  width,
+  maxWidth,
   opt_in_url,
   onAuthenticated,
   onLogin
 }) => {
+  const C = useColors();
   const [action_loading, setActionLoading] = useState(false);
   const [active_view, setActiveView] = useState('authenticate');
   const [code_details, setCodeDetails] = useState({});
-  const [active_mini_index, setActiveMiniIndex] = useState(0);
+  //const [ active_mini_index, setActiveMiniIndex ] = useState(0);
   const [opted_in, setOptedIn] = useState(true);
-  const [active_index, setActiveIndex] = useState(0);
+  //const [ active_index, setActiveIndex ] = useState<number>(0)
   const [token, setToken] = useState('');
   const [verify_error, setVerifyError] = useState();
   const [verify_attempt_allowed, setVeryAttemptAllowed] = useState(true);
@@ -55,7 +55,6 @@ const StrategyForm = ({
     setUpWizard(auth_strategy.auth_strategy_id);
   }, [auth_strategy, referral_code]);
   const setUpWizard = async auth_strategy_id => {
-    console.log('setting up wizard!!');
     //Get auth strategy from server
     if (referral_code && show_referral) {
       const code_response = await AuthenticateApi.getReferralByCode(referral_code);
@@ -80,8 +79,6 @@ const StrategyForm = ({
     });
   };
   const verifyAuthStrategyIdentifier = async () => {
-    console.log(`verifying strategy!`);
-    console.log(authenticated);
     if (authenticated) {
       return;
     }
@@ -96,7 +93,6 @@ const StrategyForm = ({
     }
     setVeryAttemptAllowed(false);
     setActionLoading(true);
-    console.log('Submitting password!!!');
     const {
       result,
       player_id,
@@ -104,7 +100,6 @@ const StrategyForm = ({
       refresh_token,
       expire_datetime
     } = await AuthenticateApi.verifyAuthStrategyIdentifier(verify_state.auth_strategy_identifier_id, verify_state.verification_session_id, token, distinct_id);
-    console.log(result);
     if (result == 'fail' || !access_token || !refresh_token || !player_id || !auth_strategy_id) {
       setVerifyError(`Invalid code / password.  Please try again after 10 seconds`);
       setTimeout(() => {
@@ -127,7 +122,6 @@ const StrategyForm = ({
     }
   };
   const executeAuthStrategy = async () => {
-    console.log('exeuting strategy!!!');
     setActionLoading(true);
     const {
       result,
@@ -177,269 +171,24 @@ const StrategyForm = ({
   if (!visible || !auth_strategy) {
     return /*#__PURE__*/React.createElement(React.Fragment, null);
   }
-  if (theme == 'mini') {
-    const active_mini_step = mini_steps[active_mini_index];
-    const active_strategy_identifier = auth_strategy_identifiers[active_index];
-    const auth_request = auth_execution_request.attributes.find(a => a.attribute == active_strategy_identifier?.auth_identifier?.attribute);
-    const last_index = auth_strategy_identifiers.length - 1 == active_index ? true : false;
-    if (!auth_request || !active_mini_step) {
-      return /*#__PURE__*/React.createElement(React.Fragment, null);
-    }
-    return /*#__PURE__*/React.createElement(View, {
-      style: {
-        width
-      }
-    }, active_mini_step == 'intro' ? /*#__PURE__*/React.createElement(View, {
-      style: {
-        flex: 1
-      }
-    }, /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row'
-      }
-    }, company ? /*#__PURE__*/React.createElement(View, {
-      style: {
-        padding: 10
-      }
-    }, /*#__PURE__*/React.createElement(Image, {
-      source: {
-        uri: company.company_image?.url
-      },
-      style: {
-        height: 60,
-        width: 60
-      },
-      resizeMode: "cover"
-    })) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(View, {
-      style: {
-        flex: 1,
-        padding: 10
-      }
-    }, /*#__PURE__*/React.createElement(Text, {
-      size: 16,
-      color: Colors.brand.midnight,
-      weight: "bold"
-    }, "Welcome!"), /*#__PURE__*/React.createElement(Text, {
-      style: {
-        marginTop: 4
-      },
-      size: 14,
-      color: Colors.brand.midnight
-    }, "Please complete the required steps to participate with ", company?.company_name ?? 'Bettoredge'))), /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row',
-        padding: 10,
-        paddingTop: 0
-      }
-    }, opt_in_url ? /*#__PURE__*/React.createElement(View, {
-      style: {
-        flex: 1,
-        flexDirection: 'row',
-        alignItems: 'center'
-      }
-    }, /*#__PURE__*/React.createElement(Checkbox, {
-      size: 20,
-      checked: opted_in,
-      onSelect: checked => setOptedIn(checked)
-    }), /*#__PURE__*/React.createElement(Text, {
-      style: {
-        marginLeft: 15
-      },
-      size: 14,
-      color: Colors.brand.midnight
-    }, "By continuing, you agree to the terms and conditions outlined", /*#__PURE__*/React.createElement(TouchableOpacity, {
-      onPress: () => Linking.openURL(opt_in_url)
-    }, /*#__PURE__*/React.createElement(Text, {
-      size: 14,
-      color: Colors.brand.electric,
-      weight: "bold"
-    }, " here.")))) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(Button, {
-      title: `Next`,
-      style: {
-        opacity: opt_in_url && !opted_in ? 0.5 : 1
-      },
-      disabled: opt_in_url && !opted_in ? true : false,
-      title_color: Colors.shades.white,
-      backgroundColor: Colors.brand.electric
-      //borderRadius={8}
-      ,
-      padding: 15,
-      onPress: () => {
-        setActiveMiniIndex(active_mini_index + 1);
-      }
-    }))) : active_mini_step == 'execution' ? /*#__PURE__*/React.createElement(View, null, active_view == 'authenticate' && active_strategy_identifier ? /*#__PURE__*/React.createElement(View, {
-      style: {
-        maxWidth: 600
-      }
-    }, /*#__PURE__*/React.createElement(AuthStrategyIdentifier, {
-      auth_strategy_identifier: active_strategy_identifier,
-      auth_request: auth_request,
-      auto_focus: true,
-      onChangeIdentifier: (text, is_valid, pretty_value) => {
-        setAuthExecutionRequest({
-          ...auth_execution_request,
-          attributes: auth_execution_request.attributes.filter(a => a.attribute != auth_request.attribute).concat({
-            attribute: auth_request.attribute,
-            value: text,
-            pretty_value,
-            is_valid
-          })
-        });
-      }
-    }), /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        padding: 10,
-        paddingTop: 0
-      }
-    }, active_index != 0 ? /*#__PURE__*/React.createElement(Button, {
-      title: `Back`,
-      style: {
-        flex: 1,
-        marginRight: 5
-      },
-      title_color: Colors.brand.electric,
-      borderWidth: 1,
-      borderColor: Colors.brand.electric,
-      backgroundColor: Colors.shades.white
-      //borderRadius={8}
-      ,
-      padding: 15,
-      onPress: () => {
-        setActiveIndex(active_index - 1);
-      }
-    }) : /*#__PURE__*/React.createElement(React.Fragment, null), last_index ? /*#__PURE__*/React.createElement(Button, {
-      title: `Let's Go!`,
-      loading: action_loading,
-      style: {
-        flex: 3,
-        opacity: strategy_valid && opted_in && !action_loading ? 1 : 0.5
-      },
-      disabled: action_loading || !strategy_valid || !opted_in,
-      title_color: Colors.shades.white,
-      backgroundColor: Colors.brand.electric
-      //borderRadius={8}
-      ,
-      padding: 15,
-      onPress: () => {
-        executeAuthStrategy();
-      }
-    }) : /*#__PURE__*/React.createElement(Button, {
-      title: `Next`,
-      style: {
-        flex: 3,
-        opacity: auth_request?.is_valid ? 1 : 0.5
-      },
-      disabled: !auth_request?.is_valid,
-      title_color: Colors.shades.white,
-      backgroundColor: Colors.brand.electric
-      //borderRadius={8}
-      ,
-      padding: 15,
-      onPress: () => {
-        setActiveIndex(active_index + 1);
-      }
-    }))) : active_view == 'verify' && verify_strategy_identifier ? /*#__PURE__*/React.createElement(View, {
-      nativeID: "sign_up",
-      style: {
-        flex: 1,
-        maxWidth: 600
-      }
-    }, /*#__PURE__*/React.createElement(View, {
-      style: {
-        padding: 10
-      }
-    }, /*#__PURE__*/React.createElement(Text, {
-      size: 18,
-      color: Colors.brand.midnight,
-      weight: "semibold"
-    }, verify_strategy_identifier.verify_label ?? 'Enter Verification Code'), /*#__PURE__*/React.createElement(View, {
-      style: {
-        padding: 10
-      }
-    }, /*#__PURE__*/React.createElement(TextInput, {
-      style: {
-        textAlign: 'center',
-        fontFamily: 'barlow-bold',
-        fontSize: 14,
-        borderWidth: 1,
-        borderColor: Colors.shades.shade600
-      },
-      value: token,
-      keyboardType: "default",
-      placeholder: "Enter Code",
-      autoFocus: true,
-      textContentType: verify_strategy_identifier.secure_text_entry ? undefined : 'oneTimeCode',
-      secureTextEntry: verify_strategy_identifier.secure_text_entry,
-      placeholderTextColor: Colors.brand.slate,
-      onChangeText: text => {
-        setToken(text);
-      }
-    })), verify_error ? /*#__PURE__*/React.createElement(Text, {
-      style: {
-        marginTop: 10
-      },
-      size: 14,
-      color: Colors.utility.warning
-    }, verify_error) : /*#__PURE__*/React.createElement(React.Fragment, null)), /*#__PURE__*/React.createElement(View, {
-      nativeID: "action_row",
-      style: {
-        flexDirection: 'row',
-        padding: 10,
-        paddingTop: 0
-      }
-    }, /*#__PURE__*/React.createElement(Button, {
-      title: 'BACK',
-      loading: action_loading,
-      style: {
-        flex: 1,
-        marginRight: 5
-      },
-      title_color: Colors.brand.electric,
-      borderColor: Colors.brand.electric,
-      borderWidth: 1,
-      padding: 15,
-      onPress: () => {
-        setActiveView('authenticate');
-        setVerifyState(undefined);
-      }
-    }), /*#__PURE__*/React.createElement(Button, {
-      title: verify_attempt_allowed && !action_loading ? 'Verify' : 'Retry in 10 seconds',
-      loading: action_loading,
-      style: {
-        flex: 3,
-        opacity: token && verify_attempt_allowed ? 1 : 0.5
-      },
-      disabled: !token || action_loading || !verify_attempt_allowed,
-      title_color: Colors.shades.white,
-      backgroundColor: Colors.utility.success
-      //borderRadius={8}
-      ,
-      padding: 15,
-      onPress: () => {
-        verifyAuthStrategyIdentifier();
-      }
-    }))) : /*#__PURE__*/React.createElement(React.Fragment, null)) : /*#__PURE__*/React.createElement(React.Fragment, null));
-  }
   return /*#__PURE__*/React.createElement(View, {
     style: {
-      width: width,
-      flex: 1
+      maxWidth,
+      flexGrow: 1
     }
   }, active_view == 'authenticate' ? /*#__PURE__*/React.createElement(View, {
     nativeID: "sign_up",
     style: {
-      flex: 1
+      flexGrow: 1
     }
   }, show_referral && code_details.player_referral && code_details.promo ? /*#__PURE__*/React.createElement(View, {
     style: {
       margin: 15,
       flexDirection: 'row',
-      backgroundColor: Colors.shades.white,
-      borderRadius: 8,
-      ...view_styles.float
-    }
+      backgroundColor: C.views.background,
+      borderRadius: 8
+    },
+    float: true
   }, /*#__PURE__*/React.createElement(View, {
     style: {
       padding: 10,
@@ -447,44 +196,32 @@ const StrategyForm = ({
     }
   }, /*#__PURE__*/React.createElement(Icons.GiftIcon, {
     size: 40,
-    color: Colors.incentive.gold
+    color: C.text.gold
   })), /*#__PURE__*/React.createElement(View, {
     style: {
       flex: 1,
-      backgroundColor: Colors.incentive.gold_faded,
+      backgroundColor: C.views.gold,
       padding: 10
     }
   }, /*#__PURE__*/React.createElement(Text, {
-    style: {
-      paddingBottom: 10,
-      borderBottomWidth: 1,
-      borderBottomColor: Colors.shades.shade600
-    },
-    size: 16,
-    color: Colors.brand.midnight,
-    weight: "bold"
+    theme: "h1"
   }, "@", code_details.referrer?.username, " has a gift for you"), /*#__PURE__*/React.createElement(Text, {
     style: {
       paddingTop: 5
     },
-    size: 12,
-    color: Colors.brand.midnight,
-    weight: "semibold"
+    theme: "h2"
   }, ProfileHelpers.getReferralDescription(code_details.promo)))) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(View, {
     style: {
-      flex: 1,
-      padding: 10
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      padding: 10
+      padding: 20,
+      flexGrow: 1
     }
   }, /*#__PURE__*/React.createElement(FlatList, {
     data: auth_strategy_identifiers.sort((a, b) => a.priority - b.priority),
     renderItem: renderAuthStrategyIdentifiers,
     keyExtractor: item => item.auth_strategy_identifier_id.toString()
-  }))), /*#__PURE__*/React.createElement(View, {
+  })), /*#__PURE__*/React.createElement(View, {
     nativeID: "action_row",
+    type: "footer",
     style: {
       padding: 10,
       paddingLeft: 20,
@@ -497,23 +234,17 @@ const StrategyForm = ({
       opacity: strategy_valid && opted_in ? 1 : 0.5
     },
     disabled: action_loading || !strategy_valid || !opted_in,
-    title_color: Colors.shades.white,
-    backgroundColor: Colors.brand.electric
-    //borderRadius={8}
-    ,
-    padding: 15,
+    type: "success",
     onPress: () => {
       executeAuthStrategy();
     }
   })), auth_strategy?.allow_login ? /*#__PURE__*/React.createElement(View, {
     style: {
-      padding: 10,
-      backgroundColor: Colors.shades.shade100
+      padding: 10
     }
   }, /*#__PURE__*/React.createElement(Button, {
     title: "Already Signed Up? Login Here",
-    title_color: Colors.brand.electric,
-    backgroundColor: "transparent",
+    type: "text",
     onPress: () => onLogin()
   })) : /*#__PURE__*/React.createElement(React.Fragment, null), active_view == 'authenticate' && opt_in_url ? /*#__PURE__*/React.createElement(View, {
     style: {
@@ -529,13 +260,12 @@ const StrategyForm = ({
     style: {
       marginLeft: 15
     },
-    size: 14,
-    color: Colors.brand.midnight
+    theme: "h2"
   }, "By continuing, you agree to the terms and conditions outlined", /*#__PURE__*/React.createElement(TouchableOpacity, {
     onPress: () => Linking.openURL(opt_in_url)
   }, /*#__PURE__*/React.createElement(Text, {
     size: 14,
-    color: Colors.brand.electric,
+    color: C.text.action,
     weight: "bold"
   }, " here.")))) : /*#__PURE__*/React.createElement(React.Fragment, null)) : active_view == 'verify' && verify_strategy_identifier ? /*#__PURE__*/React.createElement(View, {
     nativeID: "sign_up",
@@ -550,9 +280,7 @@ const StrategyForm = ({
       padding: 20
     }
   }, /*#__PURE__*/React.createElement(Text, {
-    size: 18,
-    color: Colors.brand.midnight,
-    weight: "semibold",
+    theme: "h2",
     textAlign: "center"
   }, verify_strategy_identifier.verify_label ?? 'Enter Verification Code'), /*#__PURE__*/React.createElement(View, {
     style: {
@@ -564,14 +292,15 @@ const StrategyForm = ({
       fontFamily: 'barlow-bold',
       fontSize: 14,
       borderWidth: 1,
-      borderColor: Colors.shades.shade600
+      borderColor: C.borders.light,
+      minWidth: 175
     },
     value: token,
     keyboardType: "default",
     autoFocus: true,
     textContentType: verify_strategy_identifier.secure_text_entry ? undefined : 'oneTimeCode',
     secureTextEntry: verify_strategy_identifier.secure_text_entry,
-    placeholderTextColor: Colors.brand.slate,
+    placeholderTextColor: C.text.description,
     onChangeText: text => {
       setToken(text);
     }
@@ -579,8 +308,7 @@ const StrategyForm = ({
     style: {
       marginTop: 10
     },
-    size: 14,
-    color: Colors.utility.warning
+    theme: "warning"
   }, verify_error) : /*#__PURE__*/React.createElement(React.Fragment, null)), /*#__PURE__*/React.createElement(View, {
     nativeID: "action_row",
     style: {
@@ -595,16 +323,8 @@ const StrategyForm = ({
     style: {
       flex: 1,
       marginRight: 5
-    }
-    //disabled={!token || action_loading || !verify_attempt_allowed}
-    ,
-    title_color: Colors.brand.electric,
-    borderColor: Colors.brand.electric,
-    borderWidth: 1
-    //backgroundColor={Colors.utility.success}
-    //borderRadius={8}
-    ,
-    padding: 15,
+    },
+    type: "close",
     onPress: () => {
       setActiveView('authenticate');
       setVerifyState(undefined);
@@ -617,15 +337,200 @@ const StrategyForm = ({
       opacity: token && verify_attempt_allowed ? 1 : 0.5
     },
     disabled: !token || action_loading || !verify_attempt_allowed,
-    title_color: Colors.shades.white,
-    backgroundColor: Colors.utility.success
-    //borderRadius={8}
-    ,
-    padding: 15,
+    type: "success",
     onPress: () => {
       verifyAuthStrategyIdentifier();
     }
   }))) : /*#__PURE__*/React.createElement(React.Fragment, null));
 };
 export default StrategyForm;
+
+/*
+
+    if(theme == 'mini'){
+        const active_mini_step = mini_steps[active_mini_index];
+        const active_strategy_identifier = auth_strategy_identifiers[active_index]
+        const auth_request = auth_execution_request.attributes.find(a => a.attribute == active_strategy_identifier?.auth_identifier?.attribute)
+        const last_index = auth_strategy_identifiers.length - 1 == active_index ? true : false
+        if(!auth_request || !active_mini_step){ return <></> }
+        return (
+            <View style={{ maxWidth }}>
+                {active_mini_step == 'intro' ?
+                <View style={{ }}>
+                    <View style={{ flexDirection:'row' }}>
+                        {company ?
+                        <View style={{ padding:10 }}>
+                            <Image
+                                source={{ uri: company.company_image?.url }}
+                                style={{ height:60, width:60 }}
+                                resizeMode='cover'
+                            />
+                        </View>
+                        :<></>}
+                        <View style={{ flex:1, padding:10 }}>
+                            <Text size={16} color={Colors.brand.midnight} weight='bold'>Welcome!</Text>
+                            <Text style={{ marginTop:4 }} size={14} color={Colors.brand.midnight}>Please complete the required steps to participate with {company?.company_name ?? 'Bettoredge'}</Text>
+                        </View>
+                    </View>
+                    <View style={{ flexDirection:'row', padding:10, paddingTop:0 }}>
+                        {opt_in_url ?
+                        <View style={{ flex:1, flexDirection:'row', alignItems:'center' }}>
+                            <Checkbox 
+                                size={20}
+                                checked={opted_in}
+                                onSelect={(checked) => setOptedIn(checked)}
+                            />
+                            <Text style={{ marginLeft:15 }} size={14} color={Colors.brand.midnight}>By continuing, you agree to the terms and conditions outlined
+                            <TouchableOpacity onPress={() => Linking.openURL(opt_in_url) }>
+                                <Text size={14} color={Colors.brand.electric} weight='bold'> here.</Text>
+                            </TouchableOpacity>
+                            </Text>
+                        </View>
+                        :<></>}
+                        <Button
+                            title={`Next`}
+                            style={{  opacity:opt_in_url && !opted_in ? 0.5:1 }}
+                            disabled={opt_in_url && !opted_in ? true : false}
+                            title_color={Colors.shades.white}
+                            backgroundColor={Colors.brand.electric}
+                            //borderRadius={8}
+                            padding={15}
+                            onPress={() => {
+                                setActiveMiniIndex(active_mini_index + 1)
+                            }}
+                        />
+                    </View>
+                </View>
+                :active_mini_step == 'execution' ?
+                <View>
+
+                {active_view == 'authenticate' && active_strategy_identifier?
+                <View style={{ maxWidth: 600 }}>
+                    <AuthStrategyIdentifier
+                        auth_strategy_identifier={active_strategy_identifier}
+                        auth_request={auth_request}
+                        auto_focus={true}
+                        onChangeIdentifier={(text, is_valid, pretty_value) => {
+                            setAuthExecutionRequest({ 
+                                ...auth_execution_request, 
+                                attributes: auth_execution_request.attributes.filter(a => a.attribute != auth_request.attribute).concat({ 
+                                    attribute: auth_request.attribute, 
+                                    value: text,
+                                    pretty_value,
+                                    is_valid
+                                }) 
+                            })
+                        }}
+                    />
+                    <View style={{ flexDirection:'row', alignItems:'center', padding:10, paddingTop:0 }}>
+                    {active_index != 0 ?
+                    <Button
+                        title={`Back`}
+                        style={{ flex:1, marginRight:5}}
+                        title_color={Colors.brand.electric}
+                        borderWidth={1}
+                        borderColor={Colors.brand.electric}
+                        backgroundColor={Colors.shades.white}
+                        //borderRadius={8}
+                        padding={15}
+                        onPress={() => {
+                            setActiveIndex(active_index - 1)
+                        }}
+                    />
+                    :<></>}
+                    {last_index ?
+                    <Button
+                        title={`Let's Go!`}
+                        loading={action_loading}
+
+                        style={{ flex:3, opacity:strategy_valid && opted_in && !action_loading?1:0.5 }}
+                        disabled={action_loading || !strategy_valid || !opted_in}
+                        title_color={Colors.shades.white}
+                        backgroundColor={Colors.brand.electric}
+                        //borderRadius={8}
+                        padding={15}
+                        onPress={() => {
+                            executeAuthStrategy()
+                        }}
+                    />
+                    :
+
+                        <Button
+                            title={`Next`}
+                            style={{ flex:3, opacity:auth_request?.is_valid?1:0.5 }}
+                            disabled={!auth_request?.is_valid}
+                            title_color={Colors.shades.white}
+                            backgroundColor={Colors.brand.electric}
+                            //borderRadius={8}
+                            padding={15}
+                            onPress={() => {
+                                setActiveIndex(active_index + 1)
+                            }}
+                        />
+                    }
+                    </View>
+                </View>
+                : active_view == 'verify' && verify_strategy_identifier ?
+                <View nativeID="sign_up" style={{ maxWidth:600 }}>
+                <View style={{ padding:10 }}>
+                    <Text size={18} color={Colors.brand.midnight} weight='semibold'>{verify_strategy_identifier.verify_label??'Enter Verification Code'}</Text>
+                    <View style={{ padding:10 }}>
+                        <TextInput
+                            style={{ textAlign:'center', fontFamily:'barlow-bold', fontSize:14, borderWidth:1, borderColor:Colors.shades.shade600 }}
+                            value={token}
+                            keyboardType='default'
+                            placeholder='Enter Code'
+                            autoFocus
+                            textContentType={verify_strategy_identifier.secure_text_entry ? undefined : 'oneTimeCode'}
+                            secureTextEntry={verify_strategy_identifier.secure_text_entry}
+                            placeholderTextColor={Colors.brand.slate}
+                            onChangeText={(text) => {
+                                setToken(text);
+                            }}
+                        />
+                    </View>
+                    {verify_error ?
+                    <Text style={{ marginTop:10 }} size={14} color={Colors.utility.warning}>{verify_error}</Text>
+                    :<></>}
+                </View>
+                <View nativeID="action_row" style={{ flexDirection:'row', padding:10, paddingTop:0 }}>
+                <Button
+                        title={'BACK'}
+                        loading={action_loading}
+                        style={{ flex:1, marginRight:5 }}
+                        title_color={Colors.brand.electric}
+                        borderColor={Colors.brand.electric}
+                        borderWidth={1}
+                        padding={15}
+                        onPress={() => {
+                            setActiveView('authenticate');
+                            setVerifyState(undefined)
+                        }}
+                    />
+                    <Button
+                        title={verify_attempt_allowed && !action_loading? 'Verify': 'Retry in 10 seconds'}
+                        loading={action_loading}
+                        style={{ flex:3, opacity:token&&verify_attempt_allowed?1:0.5 }}
+                        disabled={!token || action_loading || !verify_attempt_allowed}
+                        title_color={Colors.shades.white}
+                        backgroundColor={Colors.utility.success}
+                        //borderRadius={8}
+                        padding={15}
+                        onPress={() => {
+                            verifyAuthStrategyIdentifier()
+                        }}
+                    />
+                </View>
+            </View>
+               :<></> }
+
+                </View>
+                :<></>}
+                
+                
+            </View>
+        )
+    }
+
+*/
 //# sourceMappingURL=StrategyForm.js.map