# Initialize HAX in your project
agntcy-hax init

# Add the component
agntcy-hax add artifact details

import { HAXDetails, useDetailsAction } from "@/hax/artifacts/details";
export function ProfileDashboard() {
  const [artifacts, setArtifacts] = useState([]);
  // Register details actions for AI agents
  useDetailsAction({
    addOrUpdateArtifact: (type, data) => {
      // Handle details updates
    }
  });
  return (
    <HAXDetails
      title="User Profile"
      description="Comprehensive user analytics and activity summary"
      stats={topLevelStats}
      subtitle="Performance Metrics"
      substats={detailedMetrics}
      table={activityTable}
    />
  );
}