import PageHeader from "@/components/PageHeder";
import ActionButton from "@/components/action-button";
import ErrorMessages from "@/components/common/error-messages";
import getData from "@/utils/fetch";
import Product from "./product";

export default async function View({ params }: any) {
  const { Id } = params;
  const response = await getData(`/api/v1/products-out/${Id}`);
  if (!response?.success) {
    return <ErrorMessages message={response?.message} />;
  }
  const {
    data: { data: productOut = {}, reports: reports, pagination },
  } = response;
  return (
    <div className="overflow-hidden">
      <PageHeader>
        <div className="flex justify-between !p-0">
          <h2 className="text-xl font-semibold">Product Out Details</h2>
          <ActionButton type="back" href="/products" />
        </div>
      </PageHeader>
      {productOut && (
        <Product
          productOut={productOut}
          pagination={pagination}
          reports={reports}
          productId={Id}
        />
      )}
    </div>
  );
}