Making my head hurt

test.tsx

import { createContext, useContext } from 'react';
import { MessagesContext } from '../messages/MessagesContext';
import { getDataFromMessage } from '../messages/messenger';

type DbContextValue = {
  getContexts: () => Promise<{
    name: string,
    active: boolean
  }[]>
};

export const DbContext = createContext<DbContextValue>(null!);


export function DbProvider({ children }: { children: React.ReactNode }) {
  const { subscribe } = useContext(MessagesContext);
  const initialContextValue: DbContextValue = {
    getContexts: async () => {
      const uuid = crypto.randomUUID();
      let promiseReject: (reason?: string) => void = null!;
      let unsubscribe: () => void = null!;
      // TODO: we're polluting here if not sub event is fired. Maybe introduce setTimeout
      const setupSub = new Promise<string[]>((resolve, reject) => {
        promiseReject = reject;
        unsubscribe = subscribe(uuid, (response) => {
          if (response[0] !== 'DB_GET') {
            console.error('DB_GET failed message type', response);
            unsubscribe();
            reject('DB_GET failed')
          }

          const contexts = response.slice(1);
          resolve(contexts)
        });
      });
      try {
        await getDataFromMessage(
          'DB_GET',
          {
            uuid,
            model: 'Context',
          }
        );
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      } catch (e : Error | any) {
        unsubscribe();
        promiseReject(e.message);
      }

      const contextsResult = await setupSub;
      return contextsResult.reduce((acc, context, idx) => {
        acc.push({
          name: context,
          active: !!contextsResult[idx+1],
        });
        return acc;
      }, [] as {
        name: string;
        active: boolean;
      }[]);
    }
  };

  return (
    <DbContext.Provider value={initialContextValue}>
      {children}
    </DbContext.Provider>
  );
}