import { useMemo } from 'react';

import ErrorText from '~/src/components/ErrorText';
import {
  useAppAlert,
  useAppLoading,
} from '~/src/components/NextApp/lib/CoreUi';
import { useSelector } from '~/src/store/redux';
import { selectUserLanguage } from '~/src/store/session/selectors';
import useFetchSessionUser from '../useFetchSessionUser';

const useZendesk = () => {
  const { user } = useFetchSessionUser();
  const language = useSelector(selectUserLanguage);
  const setAppLoading = useAppLoading();
  const appAlert = useAppAlert();

  return useMemo(() => {
    return {
      open: async () => {
        try {
          setAppLoading(true);

          const organization = user?.orchardBrand;

          if (!organization) {
            throw new Error('OrchardUser missing `brand`');
          }

          const { loadZendesk } = await import('./loadZendesk');

          const zendesk = await loadZendesk({
            organization,
            userId: user.id,
            language,
          });

          await zendesk.open();
        } catch (error) {
          appAlert({
            title: 'Failed to load help widget',
            content: <ErrorText error={error} />,
          });
        } finally {
          setAppLoading(false);
        }
      },
    };
  }, []);
};

export default useZendesk;