AuthUi Email Login not working

'use client'
import { Auth } from '@supabase/auth-ui-react'
import { ThemeSupa } from '@supabase/auth-ui-shared'

export default function AuthForm() {
  return (
    <Auth
      supabaseClient={supabase}
      providers={["google"]}
      view="sign_in"
      redirectTo="/auth/callback"
      showLinks={false}
      appearance={{ theme: ThemeSupa }}
      theme="dark"
    />
  )
}

'use client'
import styles from '../page.module.css'
import { createClientComponentClient } from '@supabase/auth-helpers-nextjs'
import { useRouter } from 'next/navigation'
import {Container, Row, Button, Col} from 'react-bootstrap'
import AuthLogin from '../auth-login.js'

export default function Login() {
  const router = useRouter()
  const supabase = createClientComponentClient()

  return (
  <>
    <Container>
    <div className={styles.main}>
      <Row>
        <div className={styles.login_card}> 
        <h3> Login </h3>
        <Col>
          <AuthLogin />
          <Button href="/forgot-password" variant='link'> Forgot Password </Button><br/>
          <Button href="/" variant='link'> Back </Button>
        </Col>
        </div>
      </Row>
    </div>
    </Container>
  </>
  )
}

NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_ANON_KEY=