import React, { createContext, useContext, useState, ReactNode } from "react";

// Create a context
export const HelloWorldContext = createContext({
  message: "",
});

// Create a provider component
export const HelloWorldProvider: React.FC<{ children: ReactNode }> = ({
  children,
}) => {
  const [message] = useState("Hello, World!");

  return (
    <HelloWorldContext.Provider value={{ message }}>
      {children}
    </HelloWorldContext.Provider>
  );
};

// Create a custom hook to use the HelloWorldContext
export const useHelloWorld = () => {
  let { message } = useContext(HelloWorldContext);
  if (message === undefined) {
    throw new Error("useHelloWorld must be used within a HelloWorldProvider");
  }
  return { message };
};
