Supabase api function not call after switching tab

Question

i have this useEffect in my component file

   const loadFeeSettings = async () => {
     console.log("1", 1);
     const settings = await getMembershipFeeSettings();
     console.log("settings", settings);
     setFeeSettings(settings);
   };
   loadFeeSettings();
 }, []);

in this console log 1 is printed and getMembershipFeeSettings this function called

export const getMembershipFeeSettings = async (): Promise<MembershipFeeSettings | null> => {
  try {
    console.log(123)
    const response = await fetch('https://jsonplaceholder.typicode.com/users');
    console.log('response', response)

    const { data, error } = await supabase
      .from('abc')
      .select('*')
      .limit(1)
      .single();
      console.log('data, error', data, error)
    if (error) throw error;
    return data;
  } catch (error) {
    console.error('Error fetching membership fee settings:', error);
    return null;
  }
};

inside this console 123 and response will printed but supabase api not call.