React context API when wrapped around index.js file it's display nothing

Question

I am learning about context API and creating an add basket functionality in the Context.js file I have created a context that which will I use for my application it's code is

import React, { createContext } from "react";

const Cart = createContext();

function Context({ childern }) {
  return <Cart.Provider>{childern}</Cart.Provider>;
}

export default Context;

now I am wrapping my App component around it in the index.js file

import Context from "./context/Context";

<Context>
      <App />
    </Context>

but after doing this on the browser it display nothing no error not a single component that I have created is displayed but when I unwrapped the component it works fine