typescript - ¿Cuál es la mejor práctica para pasar el tipo de getServerSideProps a las props de una página de Next.Js?

Encontré dos soluciones que funcionan correctamente, pero no puedo estar seguro de cuál es el enfoque más consistente.

interface ICatalogHome {
    response: Result<CatalogHomePageResponse>;
}

export const getServerSideProps: GetServerSideProps<ICatalogHome> = async (context) => {
    const appSlug = context.params?.appSlug;
    const { locale } = context;
    const response = await getCatalogHomePageData(appSlug as string, locale!);

    const notFound = !response;

    return {
        props: {
            response,
            ...(await serverSideTranslations(context.locale!, ['common', 'login']))
        }, // will be passed to the page component as props
        notFound
    };
};

Primer enfoque:

const CatalogHome: NextPage<InferGetServerSidePropsType<typeof getServerSideProps>> = ({ response }) => {...}

Segundo enfoque:

const CatalogHome = ({ response }: InferGetServerSidePropsType<typeof getServerSideProps>) => {...}

Respuesta #1

Ambos están bien, especialmente si solo quieres que tus props tengan tipo.

Prefiero el primer enfoque ya que también escribe otros props inyectados por next, como req, res o pathname. También añadirá un tipo de retorno, lo cual no ocurre en el segundo enfoque.