import React from "react";
import EditUserGroup from "./EditUserGroup";
import EditUserGroupLoading from "./EditUserGroupLoading";
import { fetchGroup, fetchIndivGroup } from "@/app/api/group";
import { fetchUser } from "@/app/api/user";
import { fetchAuth } from "@/app/api/group/actions";

interface SubComponents {
  Loading: typeof EditUserGroupLoading;
}

interface Props {
  id: number
}

const EditUserGroupWrapper: React.FC<Props> & SubComponents = async ({ id }) => {

    const [
        group,
        users,
        auths,
      ] = await Promise.all([
        fetchIndivGroup(id),
        fetchUser(),
        fetchAuth("group", id),
      ]);

  return <EditUserGroup users={users} auths={auths.records} group={group}/>;
};

EditUserGroupWrapper.Loading = EditUserGroupLoading;

export default EditUserGroupWrapper;
