I am doing server side rendering in my next.js applicaton

This component just returns html .Is there any better way

import Feature from 'components/home/Feature/Feature';
import HeroArea from 'components/home/HeroArea/HeroArea';
import HeroFeatures from 'components/home/HeroFeatures/HeroFeatures';
import Newsletter from 'components/home/Newsletter/Newsletter';
import PopularCryptocurrencies from 'components/home/PopularCryptocurrencies/PopularCryptocurrencies';
import Testimonial from 'components/home/Testimonial/Testimonial';
import SponsorCard from 'components/sponsor_card/SponserCard';
import type { NextPage } from 'next';
import { renderToString } from 'react-dom/server';

import { getTranslations } from '../utils/translations';
interface IndexType {
  popularCryptoData: {
    current_price: number;
    high_24h: number;
    id: string;
    low_24h: number;
    market_cap: number;
    market_cap_rank: 1;
    name: string;
    price_change_24h: number;
    symbol: string;
    total_volume: number;
    image: string;
  }[];
}

const Home: NextPage<any> = ({ heroFeatures, feature, testimonial, t }) => {
  return (
    <div data-theme='dark'>
      <main className='relative overflow-hidden'>
        <div className="bg-[url('../public/images/DarkBlueBG.svg')] bg-cover    ">
          <HeroArea />
          <div dangerouslySetInnerHTML={{ __html: heroFeatures }} />

          <PopularCryptocurrencies />

          <div dangerouslySetInnerHTML={{ __html: feature }} />
          <div dangerouslySetInnerHTML={{ __html: testimonial }} />
          <Newsletter />
          <div className='block absolute'>
            <SponsorCard />
          </div>
        </div>
      </main>
    </div>
  );
};
export const getServerSideProps = async ({ locale }: any) => {
  const t = getTranslations(locale);

  const heroFeatures = renderToString(<HeroFeatures t={t} />);
  const feature = renderToString(<Feature t={t} />);
  const testimonial = renderToString(<Testimonial t={t} />);

  return {
    props: {
      heroFeatures,
      feature,
      testimonial,
      t,
    },
  };
};

export default Home;

This is my Home page. i am using react/dom-server.renderToString and dangerouslySetInnerHTML and _html

It is doing server side rendering properly.But is there any better way