CODEWITHSUNDEEP
reactjsfirebasegoogle-cloud-firestorefirebase-authentication
user8797729
user8797729

Reputation:

Delete user account Dialog - firebase with React JS

This dialog must delete the user authentication info of the currently signed user:

import React, { Component } from 'react';
import fire, { firestore } from '../config';

var user = fire.auth().currentUser;
var email = user ? user.email.toString() : "";
var password = "";
var typedPassword = "";

class DeleteConfirmationDialog extends Component {

    componentDidMount() {
        user = fire.auth().currentUser;
        email = fire.auth().currentUser.email;
        console.log(email)
        firestore.collection("User").where("email", "==", email)
            .get()
            .then((querySnapshot) => {
                querySnapshot.forEach((doc) => {
                    password = doc.data().password;
                });
            })
            .catch((error) => {
                console.log("Error getting documents: ", error);
            });
    }

    del = (e) => {
        e.preventDefault();
        if (password === typedPassword) {
            firestore.collection("User").where('email', '==', email).get().then((snap) => {
                snap.forEach((doc) => {
                    doc.ref.delete();
                    console.log("DOC FUNCTION")
                })
            }).then(function () {
                user.delete();
                console.log("SUCCESS")
            })
                .catch(function (error) {
                    console.log(error)
                })
        } else {
            console.log("Password is NOT correct")
        }
    }

    handleInputChange = (e) => {
        typedPassword = e.target.value;
        console.log(password)
        console.log(typedPassword)
    }

    render() {
        return (
            <center className='delete-Dialog' >
                <p style={{ margin: '3px' }}>For your security, please re-enter your password to continue</p>
                <form>
                    <input type='password' placeholder='Password' className='inputForDelete' onChange={this.handleInputChange} />
                    <br />
                    <button className='continue' onClick={this.del}>continue</button>
                </form>
            </center>
        );
    }
}
export default DeleteConfirmationDialog;

It should delete the authentication data and delete the User from firestore collection at the same time. When I click to submit, it says "SUCCESS" but I still see that user in the firebase and can login again, what may be the problem?

Upvotes: 1

Views: 124

Answers (1)

Sowam
Sowam

Reputation: 1736

Try adding e.preventDefault() at the beginning of the function del like:

const del = (e) => {
    e.preventDefault()
    // rest of your code
 }

It will not reload the page after clicking on the button. You can read more about it here

Did you check if it is been deleted in firebase database after click? Even if the page loads again?

Upvotes: 1

Related Questions