Widget renderers

import { useUserWidgets, groupWidgetsBySlot } from '@cskn/sdk';
import { WidgetGrid, WidgetActions } from '@cskn/ui';

function Profile({ username }: { username: string }) {
  const { data } = useUserWidgets(username);
  const slots = groupWidgetsBySlot(data?.widgets);

  return (
    <>
      <Hero />
      <WidgetGrid widgets={slots.bio} />
      <WidgetActions widgets={slots.action} />
      <WidgetGrid widgets={slots.content} />
      <WidgetGrid widgets={slots.footer} />
    </>
  );
}