import { Suspense } from "react";

import { MobileShell } from "@/app/_components/core";

import { SubscriptionPageClient } from "./subscription-page-client";

export default function SubscriptionPage() {
  return (
    <Suspense fallback={<SubscriptionFallback />}>
      <SubscriptionPageClient />
    </Suspense>
  );
}

function SubscriptionFallback() {
  return (
    <MobileShell>
      <div
        style={{
          minHeight: "60vh",
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          padding: "2rem",
          color: "#666",
        }}
      >
        Loading subscription...
      </div>
    </MobileShell>
  );
}
