qwik global app context

global.tsx

import {
  Slot,
  component$,
  createContextId,
  useContextProvider,
  useSignal,
  useStore,
  type Signal,
} from '@builder.io/qwik';

export interface AppStore {
  themeModal: Signal<boolean>;
  showThemes: Signal<boolean>;
  contactModal: Signal<boolean>;
  organization: Signal<string>;
  currentDate: Signal<string>;
}

export const AppContext = createContextId<AppStore>('app-context');

export const AppProvider = component$(() => {
  const showThemes = useSignal(false);
  const themeModal = useSignal(false);
  const organization = useSignal('');
  const currentDate = useSignal(new Date().toDateString());

  const contactModal = useSignal(false);

  const app = useStore({
    themeModal,
    contactModal,
    showThemes,
    organization,
    currentDate,
  });

  useContextProvider(AppContext, app);

  return <Slot />;
});