Remix-inspired "Await" component for RSC / Next 13

Await.tsx

import { use } from "react";

type Props<T> = {
  resolve: Promise<T>;
  children: (value: T) => React.ReactElement;
};

export default function Await<T>({ resolve, children }: Props<T>) {
  const value = use(resolve);

  return children(value);
}

Example.tsx

import { Suspense } from "react";
import Await from "~/components/Await";

import {
  ProductView,
  ReviewsView,
  getProductReviews,
  getProduct,
  Skelly,
} from "somewhere-I-guess";

type Props = {
  id: string;
};

export default async function Product({ id }: Props) {
  const productReviewsPromise = getProductReviews(id);
  const product = await getProduct(id);

  return (
    <>
      <ProductView data={product} />
      <Suspense fallback={<Skelly />}>
        <Await resolve={productReviewsPromise}>
          {(reviews) => <ReviewsView data={reviews} />}
        </Await>
      </Suspense>
    </>
  );
}