Querying referenced table with TanStack query returns different results on reload

  const { data: active_fronts } = useShortQuery(
    ["fronts", "active"],
    async () => {
      const { data, error } = await supabase
        .from('fronts')
        .select('*, member:member( id, color, avatar, name, pronouns )')
        .eq('account', account!.id)
        .is('end', null);
      if (error) console.error('active_fronts', error);
      return data;
    },
    [ account ],
  );

{
    "id": 21,
    "member": "V5A9niq86S-2dtwT2Gdrn",
    "start": "2026-03-21T02:45:21.548547+00:00",
    "end": null,
    "message": null,
    "account": "a64fd46c-78a3-4a41-aea7-4d5f60eec90f"
}

{
    "id": 21,
    "member": {
        "id": "V5A9niq86S-2dtwT2Gdrn",
        "name": "(name)",
        "color": "120, 120, 120",
        "avatar": "(avatar_url)",
        "pronouns": "he/they"
    },
    "start": "2026-03-21T02:45:21.548547+00:00",
    "end": null,
    "message": null,
    "account": "a64fd46c-78a3-4a41-aea7-4d5f60eec90f"
}

export const useShortQuery = <R>(key: QueryKey, fn: QueryFunction<R>, depends?: any[]) => {
  return useQuery({
    queryKey: key,
    queryFn: fn,
    ...(!depends ? {} : {
      enabled: depends.every(a => !!a),
    })
  });
};