// components/ArticlesProvider.tsx
'use client';

import { ReactNode, useEffect } from 'react';
import { useEventCatalogResourcesStore } from '@/stores/eventcatalog-resources-store';
import { useFlowStoreActions } from '@/stores/flow-store';
import { useDesignStore } from '@/stores/design-store';
import { useSettingsStore } from '@/stores/settings-store';

export function ResourceProvider({ resources, children, studioFilesFromEventCatalogDirectory, defaultDesign, eventCatalogPath, templates }: { resources: any[]; children: ReactNode, studioFilesFromEventCatalogDirectory: { id: string, creationDate: string }[], defaultDesign?: any, eventCatalogPath?: string, templates?: any[] }) {
    const setResources = useEventCatalogResourcesStore((s) => s.setResources);
    const setStudioFilesFromEventCatalogDirectory = useEventCatalogResourcesStore((s) => s.setStudioFilesFromEventCatalogDirectory);
    const setTemplates = useEventCatalogResourcesStore((s) => s.setTemplates);
    const { importFlow } = useFlowStoreActions();
    const { updateDesignName } = useDesignStore();
    const { setEventCatalogPath } = useSettingsStore();

    useEffect(() => {
        setResources(resources);
        setStudioFilesFromEventCatalogDirectory(studioFilesFromEventCatalogDirectory);

        if(templates) {
            setTemplates(templates);
        }

        if(eventCatalogPath) {
            setEventCatalogPath(eventCatalogPath);
        }

        if(defaultDesign) {
            importFlow(defaultDesign);
            const designName = defaultDesign.name || defaultDesign.metadata?.name || defaultDesign.id;
            if (defaultDesign.id && designName) {
                updateDesignName(defaultDesign.id, designName);
            }
        }
    }, []);

  return <>{children}</>;
}