我的应用程序 Package 在一个提供程序中，该提供程序应将会话状态传递给应用程序的其余部分。但是supabase auth listener代码似乎无限地重新呈现我的组件，我不知道如何修复它。提供商代码：

import React, { createContext, useState, useEffect } from "react";
import { createClient } from "@supabase/supabase-js";
import { supabasekey } from "../../constants";

const supabaseUrl = "https://**************.supabase.co";
const supabase = createClient(supabaseUrl, supabasekey["1"]);

const MyContext = createContext();

const AppStateProvider = ({ children }) => {
  const [state, setState] = useState(/* initial state */);

  //Supabase auth functions causing infinite re-rendering of components
  useEffect(() => {
    supabase.auth.getSession().then(({ data: { session } }) => {
      setState(session?.user ?? null);
    });

    supabase.auth.onAuthStateChange((_event, session) => {
      setState(session?.user ?? null);
    });
  }, []);

  console.log("provider running");

  // Create the context value
  const contextValue = {
    state,
    setState,
  };

  return (
    <MyContext.Provider value={contextValue}>{children}</MyContext.Provider>
  );
};

export { MyContext, AppStateProvider };

字符串
我的应用代码

<>
      <AppStateProvider>
          <Component {...pageProps} />
      </AppStateProvider>
    </>
  );
}

型