'use client';

import { PropsWithChildren, createContext, useContext } from 'react';

import { OrpheusExperimentGroup } from '@/app/(root)/chat/types';
import useExperiment, { UseExperimentValue } from '@/hooks/useExperiment';
import { isMobileBrowser } from '@/utils/device';

export const ExperimentsContext = createContext<{
  [key: string]: UseExperimentValue;
} | null>(null);

export const ORPHEUS_EXPERIMENT_PARAMETER = 'orpheus_group';

export const ExperimentsProvider = ({ children }: PropsWithChildren) => {
  const orpheusExperiment = useExperiment({
    layerName: 'creation-layer',
    parameterName: ORPHEUS_EXPERIMENT_PARAMETER,
    parameterType: 'string',
    parameterDefault: OrpheusExperimentGroup.Control,
    suppressExperiment: isMobileBrowser(),
  });
  return (
    <ExperimentsContext.Provider
      value={{ [ORPHEUS_EXPERIMENT_PARAMETER]: orpheusExperiment }}
    >
      {children}
    </ExperimentsContext.Provider>
  );
};

export const useExperimentContext = (parameterName: string) => {
  const context = useContext(ExperimentsContext);
  if (!context) {
    return { data: null, error: null, isLoading: false };
  }
  return (
    context[parameterName] ?? { data: null, error: null, isLoading: false }
  );
};