import { defineNuxtPlugin } from '#app';
import { initializeApp } from 'firebase/app';
import {
  getAuth,
  signInWithPopup,
  GoogleAuthProvider,
  RecaptchaVerifier,
  signInWithPhoneNumber,
} from 'firebase/auth';
import { getFirestore, collection } from 'firebase/firestore';
import { getStorage } from 'firebase/storage';
import { getFunctions } from 'firebase/functions';
import { getAnalytics } from 'firebase/analytics';
//import types
import type { FirebasePlugin } from '@/types';

export default defineNuxtPlugin((nuxtApp) => {
  const config = useRuntimeConfig();

  const firebaseConfig = {
    apiKey: config.public.firebaseApiKey,
    authDomain: config.public.firebaseAuthDomain,
    projectId: config.public.firebaseProjectId,
    storageBucket: config.public.firebaseStorageBucket,
    messagingSenderId: config.public.firebaseMessagingSenderId,
    appId: config.public.firebaseAppId,
  };

  const firebaseApp = initializeApp(firebaseConfig);
  const auth = getAuth(firebaseApp);
  auth.languageCode = 'kr';
  const db = getFirestore(firebaseApp);
  const storage = getStorage(firebaseApp);
  const functions = getFunctions(firebaseApp);
  const analytics = getAnalytics(firebaseApp);

  // Collections
  const usersCollection = collection(db, 'users');
  const wadizesCollection = collection(db, 'wadizes');
  const faqboardsCollection = collection(db, 'faqboards');
  const countersCollection = collection(db, 'counters');
  const attendsCollection = collection(db, 'attends');
  const noticesCollection = collection(db, 'notices');
  const videosCollection = collection(db, 'videos');
  const quizzesCollection = collection(db, 'quizzes');
  const coursesCollection = collection(db, 'courses');
  const progressesCollection = collection(db, 'progresses');
  const usergroupsCollection = collection(db, 'usergroups');
  const surveysCollection = collection(db, 'surveys');
  const questionsCollection = collection(db, 'questions');
  const programsCollection = collection(db, 'programs');
  const headersCollection = collection(db, 'headers');
  const certificatesCollection = collection(db, 'certificates');
  const projectsCollection = collection(db, 'projects');
  // Google Sign-In
  const provider = new GoogleAuthProvider();
  async function signInWithGoogle() {
    const result = await signInWithPopup(auth, provider);
    return result.user;
  }

  // Recaptcha
  const createRecaptchaVerifier = (elementId: string) => {
    return new RecaptchaVerifier(auth, elementId, {
      size: 'invisible',
      callback: () => {
        // reCAPTCHA solved
      },
    });
  };

  const firebase: FirebasePlugin = {
    firebaseApp,
    auth,
    db,
    storage,
    functions,
    analytics,
    usersCollection,
    wadizesCollection,
    faqboardsCollection,
    countersCollection,
    attendsCollection,
    noticesCollection,
    videosCollection,
    quizzesCollection,
    coursesCollection,
    progressesCollection,
    usergroupsCollection,
    surveysCollection,
    questionsCollection,
    programsCollection,
    headersCollection,
    certificatesCollection,
    projectsCollection,
    signInWithGoogle,
    createRecaptchaVerifier,
  };

  nuxtApp.provide('firebase', firebase);
});
