import { PropsWithChildren, createContext, useContext, useMemo } from "react";
import { use<%= namePascalCase %> } from '../../hooks/<%= nameDashCase %>/use-<%= nameDashCase %>';
import { <%= namePascalCase %>Model } from "<%= importPath %>";

interface <%= namePascalCase %>Type {
  model?: <%= namePascalCase %>Model;
}
export const <%= namePascalCase %> = createContext<
  <%= namePascalCase %>Type | undefined
>(undefined);

interface <%= namePascalCase %>ProviderProps {
  <% if (!singleton) { %>id: string;<% } %>
}

export const <%= namePascalCase %>Provider: React.FunctionComponent<
  PropsWithChildren<<%= namePascalCase %>ProviderProps>
> = ({ children<% if (!singleton) { %>, id<% } %> }) => {
  const { model, ready } = use<%= namePascalCase %>(<% if (!singleton) { %>id<% } %>);
  const value: <%= namePascalCase %>Type = useMemo(() => {
    if (ready && model) {
      return { model };
    }
    return {};
  }, [ready, model]);
  return (
    <<%= namePascalCase %>.Provider value={value}>
      {children}
    </<%= namePascalCase %>.Provider>
  );
};
export const use<%= namePascalCase %>Context = () => {
  const context = useContext(<%= namePascalCase %>);
  if (!context) {
    throw new Error(
      "use<%= namePascalCase %>Context must be used within a <%= namePascalCase %>Provider"
    );
  }
  return context;
};