How to update RTK Query cache when Firebase RTDB change event fired (update, write, create, delete)

I am using redux-tookit, rtk-query (for querying other api’s and not just Firebase) and Firebase (for authentication and db).

The code below works just fine for retrieving and caching the data but I wish to take advantage of both rtk-query caching as well as Firebase event subscribing, so that when ever a change is made in the DB (from any source even directly in firebase console) the cache is updated.

I have tried both updateQueryCache and invalidateTags but so far I am not able to find an ideal approach that works.

Any assistance in pointing me in the right direction would be greatly appreciated.

// firebase.ts
export const onRead = (
  collection: string,
  callback: (snapshort: DataSnapshot) => void,
  options: ListenOptions = { onlyOnce: false }
) => onValue(ref(db, collection), callback, options);

export async function getCollection<T>(
  collection: string,
  onlyOnce: boolean = false
): Promise<T> {
  let timeout: NodeJS.Timeout;
  return new Promise<T>((resolve, reject) => {
    timeout = setTimeout(() => reject('Request timed out!'), ASYNC_TIMEOUT);
    onRead(collection, (snapshot) => resolve(snapshot.val()), { onlyOnce });
  }).finally(() => clearTimeout(timeout));
}

// awards.ts
const awards = dbApi
  .enhanceEndpoints({ addTagTypes: ['Themes'] })
  .injectEndpoints({
    endpoints: (builder) => ({
      getThemes: builder.query<ThemeData[], void>({
        async queryFn(arg, api) {
          try {
            const { auth } = api.getState() as RootState;
            const programme = auth.user?.unit.guidingProgramme!;
            const path = `/themes/${programme}`;
            const themes = await getCollection<ThemeData[]>(path, true);
            return { data: themes };
          } catch (error) {
            return { error: error as FirebaseError };
          }
        },
        providesTags: ['Themes'],
        keepUnusedDataFor: 1000 * 60
      }),

      getTheme: builder.query<ThemeData, string | undefined>({
        async queryFn(slug, api) {
          try {
            const initiate = awards.endpoints.getThemes.initiate;
            const getThemes = api.dispatch(initiate());
            const { data } = (await getThemes) as ApiResponse<ThemeData[]>;
            const name = slug
              ?.split('-')
              .map(
                (value) =>
                  value.substring(0, 1).toUpperCase() +
                  value.substring(1).toLowerCase()
              )
              .join(' ');

            return { data: data?.find((theme) => theme.name === name) };
          } catch (error) {
            return { error: error as FirebaseError };
          }
        },
        keepUnusedDataFor: 0
      })
    })
  });