import React, { type FC, type PropsWithChildren } from 'react';
import { usePromise } from '@wener/reaction';
import { NonIdealState } from '../../daisy';
import { resolveErrorMessage } from '../../toast';
import { LoadingIndicator } from '../components';
import { getUserStore } from '../context';
import type { UserProfileData } from '../store/UserStore';

export const UserLoader: FC<
	PropsWithChildren & {
		load?: () => Promise<UserProfileData>;
	}
> = ({ children, load }) => {
	const { loading, error } = usePromise(async () => {
		if (!load) return;
		let data = await load();
		data && getUserStore().getState().load(data);
	}, []);

	if (loading) {
		return <LoadingIndicator />;
	}

	if (error) {
		return <NonIdealState title={'Failed to load user'} description={String(resolveErrorMessage(error))} />;
	}

	return children;
};