How to change Firebase UI Phone Auth language in NextJs?

Viewed 110

Basically, I have added a Firebase UI widget to my NextJs application.

I can't change the default language of this widget.

Before post this question, I try to apply this solution from Firebase docs, but not working for me.

<script src="https://www.gstatic.com/firebasejs/ui/3.4.0/firebase-ui-auth__{LANGUAGE_CODE}.js"></script>
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/3.4.0/firebase-ui-auth.css" />

Below is exactly what I have implemented:

componentDidMount() {
    firebase.auth.languageCode = 'vi';
    const uiConfig = {
      signInSuccessUrl: '/', //This URL is used to return to that page when we got success response for phone authentication.
      signInOptions: [
        {
          provider: firebase.auth.PhoneAuthProvider.PROVIDER_ID,
        },
      ],
      tosUrl: '/',
    };
    var ui = new firebaseui.auth.AuthUI(firebase.auth());
    ui.start('#firebaseui-auth-container', uiConfig);
  }
  render() {
    return (
      <>
        <Head>
          <script
            async
            src="https://www.gstatic.com/firebasejs/ui/5.0.0/firebase-ui-auth__vi.js"
          ></script>
          <link
            type="text/css"
            rel="stylesheet"
            href="https://www.gstatic.com/firebasejs/ui/5.0.0/firebase-ui-auth.css"
          />
        </Head>
        <div id="firebaseui-auth-container"></div>
      </>
    );
  }

I can't change the default language from English to Vietnamese.

Any help is appreciated!

0 Answers
Related