How to remove "Create account" Signup from Amplify Auth UI with React Native?

0

I have a login screen in a react native app with Amplify Auth. below is the code with the default Authenticator configuration. I'm using Amplify V6 Does anyone know how to remove the Signup functionality? I need to remove "Create Account" my app doesn't need it. thanks

Enter image description here

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View, Button } from 'react-native';
import { Amplify } from 'aws-amplify';
import { USER_POOL_ID, USER_POOL_CLIENT_ID, IDENTITY_POOL_ID} from '@env'
import { getCurrentUser, signOut, signIn } from 'aws-amplify/auth';
import { withAuthenticator, useAuthenticator} from '@aws-amplify/ui-react-native';

const amplifyConfig = {
  Auth: {
    Cognito: {
      userPoolId: USER_POOL_ID,
      userPoolClientId: USER_POOL_CLIENT_ID,
      identityPoolId: IDENTITY_POOL_ID,
    }
  }
}
Amplify.configure(amplifyConfig);

async function handleSignOut() {
  try {
    await signOut();
  } catch (error) {
    console.log('error signing out: ', error);
  }
}

  function App() {
  return (
    <View style={styles.container}>
      <Text >Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
      <Button title="Sign Out" onPress={handleSignOut} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});


export default withAuthenticator(App);

mvp
已提问 2 个月前267 查看次数
2 回答
1

To remove the "Create Account" option from the Amplify Auth UI in your React Native app, set the hideSignUp option to true in the withAuthenticator component. Here’s how you do it in your code:

export default withAuthenticator(App, { hideSignUp: true });
profile picture
专家
已回答 2 个月前
  • Still doesn't work. I've reset simulator settings, cleared cache, rebuild the project. And it keeps showing the "Create Account" link I also tried the following code, but it doesn't work

      function App() {
      return (
        <Authenticator.Provider>
            <Authenticator hideSignUp={true}>
              <View style={styles.container}>
                <Text style={{ fontSize: 30}}>Open up App.js to start working on your app!</Text>
                <Text style={{ fontSize: 20, color: 'gray'}}>You should see this page only if you are authenticated</Text>
                <StatusBar style="auto" />
                <Button title="Sign Out" onPress={handleSignOut} />
              </View>
             </Authenticator>
        </Authenticator.Provider>         
      );
    }
    
0
已接受的回答

I missed this documentation: https://ui.docs.amplify.aws/react-native/connected-components/authenticator/configuration#hide-sign-up

here is the solution

<Authenticator.Provider>
      <Authenticator
        components={{
          SignIn: (props) => (
            <Authenticator.SignIn {...props} hideSignUp />
          ),
        }}
      >
......
      </Authenticator>
    </Authenticator.Provider>
mvp
已回答 2 个月前
profile picture
专家
已审核 1 个月前

您未登录。 登录 发布回答。

一个好的回答可以清楚地解答问题和提供建设性反馈,并能促进提问者的职业发展。

回答问题的准则