import * as React from "react";
import { valueOrDefault } from "@intelligentgraphics/ig.utilities";
import { useCatalogContext } from "./Context";
import { defaultFetchContent } from "./DefaultContentFetcher";
export const useCatalogView = (props) => {
    const catalogContext = useCatalogContext();
    const path = valueOrDefault(props.path, catalogContext.path);
    const addableTargetId = valueOrDefault(props.addableTargetId, catalogContext.addableTargetId);
    const [state, setState] = React.useState({
        loading: true,
        data: undefined,
        error: undefined,
        path,
        addableTargetId,
    });
    const fetchParams = React.useMemo(() => ({
        path,
        addableTargetId,
        flat: props.flat,
        filterContent: props.filterContent,
        data: props.data,
    }), [
        catalogContext,
        addableTargetId,
        props.fetchContent,
        props.filterContent,
        props.flat,
        path,
        props.data,
    ]);
    React.useEffect(() => {
        const fetchContent = props.fetchContent === undefined
            ? defaultFetchContent
            : props.fetchContent;
        let canceled = false;
        try {
            const fetchResult = fetchContent(fetchParams, catalogContext.catalogFetcher);
            if (typeof fetchResult === "object" && "then" in fetchResult) {
                setState({
                    loading: true,
                    error: undefined,
                    data: state.data,
                    path: state.path,
                    addableTargetId: state.addableTargetId,
                });
                const fetchResultPromise = fetchResult;
                fetchResultPromise
                    .then(data => [undefined, data])
                    .catch(err => [err, undefined])
                    .then(([err, data]) => {
                    if (canceled) {
                        return;
                    }
                    if (data !== undefined &&
                        props.onPathContentFetched !== undefined) {
                        props.onPathContentFetched(data, fetchParams.data);
                    }
                    setState({
                        error: err,
                        data,
                        loading: false,
                        path,
                        addableTargetId,
                    });
                });
            }
            else {
                if (props.onPathContentFetched !== undefined) {
                    props.onPathContentFetched(fetchResult, fetchParams.data);
                }
                setState({
                    data: fetchResult,
                    loading: false,
                    error: undefined,
                    path,
                    addableTargetId,
                });
            }
        }
        catch (err) {
            setState({
                data: undefined,
                loading: false,
                error: err,
                path,
                addableTargetId,
            });
        }
        return () => {
            canceled = true;
        };
    }, [fetchParams]);
    return state;
};
const CatalogView = (props) => {
    const state = useCatalogView(props);
    return props.children(state);
};
CatalogView.displayName = "CatalogView";
export default CatalogView;
