May I know how am I supposed to retrieve the details of the user once he or she has logged in using his email and password, and parse these user authentication details on to the chat interface using vue and firebase?

Currently I have managed to retrieve the login details and parse it over to the chat UI component using Google sign-in method. I am wondering if I could be able to do this using custom login authentication via "Email/Password" method in Firebase.

The following is the code for Login.vue:

<template>
  <div class="login-container">
    <button @click="loginSubmit">Login with Google!</button>
  </div>
</template>

<script>
import firebase from 'firebase'

export default {
  methods: {
    loginSubmit() {
      const provider = new firebase.auth.GoogleAuthProvider()

      firebase.auth().signInWithRedirect(provider)
        .catch(console.log)
    }
  }
}
</script>

And this is the code for firebase initialization:

import Vue from 'vue'
import App from './App.vue'
import firebase from 'firebase'

Vue.config.productionTip = false


// NOTE: PASTE YOUR OWN CONFIG HERE!

const firebaseConfig = {
  apiKey: "AIzaSyDt21oJOol8S75a4wuE_h0Z5m-KRZzkkWk",
  authDomain: "vue-chat-app-787e0.firebaseapp.com",
  projectId: "vue-chat-app-787e0",
  storageBucket: "vue-chat-app-787e0.appspot.com",
  messagingSenderId: "769347326095",
  appId: "1:769347326095:web:bf9c45908a25f9e107e0fa",
};

firebase.initializeApp(firebaseConfig)

firebase.auth().onAuthStateChanged(() => new Vue({
  render: h => h(App),
}).$mount('#app'))