import ErrorMessages from "@/components/common/error-messages";
import ZoneList from "@/components/zone/zone-list";
import getData from "@/utils/fetch";
import { Metadata } from "next";
import ZoneContent from "./content";
export const metadata: Metadata = {
  title: "zone",
};

export default async function UsersList() {
  const response = await getData("/api/v1/zones");
  if (!response?.success) {
    return <ErrorMessages message={response?.message} />;
  }
  const {
    data: { data: zones },
    data: { pagination },
  } = response;
  return (
    <>
      <ZoneContent />
      <div className="flex flex-col">
        <div className="overflow-x-auto">
          <div className="inline-block min-w-full align-middle">
            <div className="overflow-hidden shadow">
              <ZoneList initZone={zones} initPagination={pagination} />
            </div>
          </div>
        </div>
      </div>
    </>
  );
}