如何编写带有firebase身份验证的原生react按钮

import React from 'react';
import firebase from 'firebase/app';
import 'firebase/auth';

class FirebaseAuthButton extends React.Component {
  constructor(props) {
    super(props);
    // 初始化Firebase
    firebase.initializeApp({
      apiKey: 'YOUR_API_KEY',
      authDomain: 'YOUR_AUTH_DOMAIN',
      projectId: 'YOUR_PROJECT_ID',
      // 其他配置信息...
    });
  }

  render() {
    return (
      <button onClick={this.handleAuth}>登录</button>
    );
  }

  handleAuth = () => {
    const provider = new firebase.auth.GoogleAuthProvider();
    firebase.auth().signInWithPopup(provider)
      .then((result) => {
        // 处理登录成功后的逻辑
        console.log('登录成功', result.user);
      })
      .catch((error) => {
        // 处理登录失败后的逻辑
        console.error('登录失败', error);
      });
  }
}

export default FirebaseAuthButton;