I want to use the component through the section model in the next js

General
1

I’m sorry if I asked you a silly question.
I use the builder.io as nextj. and I want to create Navibar in the component folder and import Navibar into _app.tsx.

Key :3f32d6ed3ae64d03ad541ad7de7cc503

/component/Navigation.tsx

import {builder, BuilderComponent} from '@builder.io/react';
import Router from 'next/router';

builder.init('3f32d6ed3ae64d03ad541ad7de7cc503');

export const getStaticProps = async context => {
  const content = await builder
    .get('gnb', {url: context.resolvedUrl})
    .promise();

  return {
    props: {content},
    revalidate: true,
    notFound: !content,
  };
};

const MyComponent = () => {
  // console.log(props);

  const onLogin = () => {
    Router.push('/login');
  };
  return (
    <BuilderComponent
      content={props.content}
      context={{
        login: () => {
          onLogin();
        },
        Click: () => {
          alert('Hi');
        },
      }}
      model="gnb"
    />
  );
};
export default MyComponent;

_app.tsx

import MyComponent from 'components/Navigation';
function MyApp(props) {
   const {Component, pageProps} = props;
  return (
<>
                <MyComponent />
                <Component {...pageProps} />
</>
)
}
export default MyApp;