import React from "react";
import { ScreenFeedLoader } from "../ScreenFeedLoader/ScreenFeedLoader";

/** Resolves screen-feed for a given screen `id` by using the provided `useFeedData` hook */
export const ScreenResolverFeedProvider = ({
  id,
  children,
  useFeedData,
}: {
  id: string;
  children: React.ReactNode;
  useFeedData: (id: string) => Option<ZappDataSource>;
}) => {
  const feedData = useFeedData(id);

  if (feedData?.source) {
    return (
      <ScreenFeedLoader id={id} feedData={feedData}>
        {children}
      </ScreenFeedLoader>
    );
  } else {
    return <>{children}</>;
  }
};
