Firebase authentication & netlify functions

[msm1227]

I am using netlify and am having trouble turning the following js into a function

import { initializeApp } from "https://www.gstatic.com/firebasejs/10.4.0/firebase-app.js";
import {
  getAuth,
  createUserWithEmailAndPassword,
  signInWithEmailAndPassword,
  onAuthStateChanged,
  signOut
} from "https://www.gstatic.com/firebasejs/10.4.0/firebase-auth.js";
import {
    doc,
    getDoc, 
    addDoc, 
    collection, 
    onSnapshot,
    getFirestore,
    query,  
    where, 
    getDocs 
} from 'https://www.gstatic.com/firebasejs/10.4.0/firebase-firestore.js';
import {
    getFunctions, 
    httpsCallable 
} from 'https://www.gstatic.com/firebasejs/10.4.0/firebase-functions.js';


const firebaseConfig = {
apiKey: firebaseApiKey,
authDomain: firebaseAuthDomain,
projectId: firebaseProjectID,
storageBucket: firebaseStorageBucket,
messagingSenderId: firebaseMessagingSenderID,
appId: firebaseAppID 
};


const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getFirestore(app);

const LoginUserEmail = document.querySelector("#LoginUserEmail");
const LoginUserPassword = document.querySelector("#LoginUserPassword");
const signUpUserEmail = document.querySelector("#signUpUserEmail");
const signUpUserPassword = document.querySelector("#signUpUserPassword");
const signUpButton = document.querySelector("#signUpButton");
const manSubButton = document.querySelector("#manSubButton");
const logInButton = document.querySelector("#logInButton");
const logOutButton = document.querySelector("#logOutButton");
const modalLogInButton = document.querySelector("#modalLogInButton");
const modalSignUpButton = document.querySelector("#modalSignUpButton");
var plan = 'free';
var priceID = 'price_1';
var loggedIn = false;

onAuthStateChanged(auth, async (user)=>{
    if(user){
        console.log("Logged in ", user)
        loggedIn = true;
        console.log("Logged in value is "+loggedIn)
        logOutButton.style.display = 'flex';
        logInButton.style.display = 'none';
        manSubButton.style.display = 'flex';
        signUpButton.style.display = 'none';
        const functions = getFunctions(app, 'us-central1');
        const createPortalLink = httpsCallable(
        functions, 
        'ext-firestore-stripe-payments-createPortalLink');
    
        // request Stripe to create a portal link, and redirect user there
        createPortalLink({
            returnUrl: window.location.origin, // can set this to a custom page
        })
        .then((result) => {
            manage_url = result.data.url;
        }).catch((error) => {
            const errorCode = error.code;
            const errorMessage = error.message;
            console.log(errorCode + errorMessage)
        });
    }else{
        console.log("Not logged in")
        loggedIn = false;
        logOutButton.style.display = 'none';
        logInButton.style.display = 'flex';
        signUpButton.style.display = 'flex';
        manSubButton.style.display = 'none';
    }
})


let paidUserCreds

const paidUser = async(paidUserCreds) => {
    console.log("paidUserCreds is: "+ paidUserCreds)
    const user = paidUserCreds.user;
            let checkoutSessionData = {
                price: priceID,
                success_url: window.location.origin,
                cancel_url: window.location.origin
            };
        
            const checkoutSessionRef = await addDoc(
                // currentUser is provided by firebase, via getAuth().currentUser
                collection(db, `customers/${user.uid}/checkout_sessions`), 
                checkoutSessionData,
                console.log("The user uid is: "+user.uid)
        
            );
            
            // The Stripe extension creates a payment link for us
            onSnapshot(checkoutSessionRef, (snap) => {
                const { error, url } = snap.data();
                if (error) {
                console.log(error);
                }
                if (url) {
                console.log("The stripe url is: "+url)
                stripe_url = url;  // redirect to payment link
                window.location.assign(url);
                }
            });
        }

const userSignUp = async(event) => {
    event.preventDefault()
    const signUpEmail = signUpUserEmail.value;
    const signUpPassword = signUpUserPassword.value;
    createUserWithEmailAndPassword(auth, signUpEmail, signUpPassword)
    .then((userCredential) => {
        findSelectedRadio();
        return userCredential;
    })
    .then((userCredential) => {
        console.log("plan is "+plan)
        if (plan !== 'free'){
            showLoader();
            paidUserCreds = userCredential
            paidUser(paidUserCreds);
        }
        else{
            return userCredential;
        }
    })
    .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        console.log(errorCode + errorMessage)
    })
}

const userSignIn = async(event) => {
    event.preventDefault()
    const signInEmail = LoginUserEmail.value;
    const signInPassword = LoginUserPassword.value;
    signInWithEmailAndPassword(auth, signInEmail, signInPassword)
    .then((userCredential) => {
        const user = userCredential.user;
    })
    .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        console.log(errorCode + errorMessage)
    })
}


const manSub = async(event) => {
    event.preventDefault()
        console.log("manage_url is: "+manage_url)
        window.location.assign(manage_url);
}


const userSignOut = async() => {
    await signOut(auth);
}

modalSignUpButton.addEventListener('click', userSignUp);
modalLogInButton.addEventListener('click', userSignIn);
logOutButton.addEventListener('click', userSignOut);
manSubButton.addEventListener('click', manSub);

The const firebaseConfig is the reason why I am looking to move it to a function since it has api keys in it. How would I go about doing this? Is this something that is better suited as a function or edge function? Does it need to be broken out in to multiple functions or can it be just one? The other thing that I am not totally sure on is how would I get the function to fire when one of the buttons is clicked?

Any help would be greatly appreciated as I've been struggling with this the last few days.