import { authClient } from '@lib/auth-client';
import { m } from '@paraglide/messages';
import { GearIcon } from '@phosphor-icons/react';
import { Card, CardContent, CardHeader, CardTitle } from '@ui/card';
import { Skeleton } from '../ui/skeleton';
import DeleteUserHouseAction from './delete-user-house-dialog';
import EditUserHouseAction from './edit-user-house-dialog';
import LeaveHouseAction from './leave-house-dialog';

type CurrentUserActionGroupProps = {
  oneHouse: boolean;
  activeHouse: ReturnType<typeof authClient.useActiveOrganization>['data'];
};

const CurrentUserActionGroup = ({
  oneHouse,
  activeHouse,
}: CurrentUserActionGroupProps) => {
  if (!activeHouse) {
    return <Skeleton className="col-span-1" />;
  }

  return (
    <Card className="col-span-1">
      <CardHeader>
        <CardTitle className="flex items-center gap-2">
          <GearIcon />
          {m.houses_user_page_block_action_title()}
        </CardTitle>
      </CardHeader>
      <CardContent className="flex flex-row gap-2">
        <EditUserHouseAction data={activeHouse} />
        {!oneHouse && <DeleteUserHouseAction activeHouse={activeHouse} />}
        <LeaveHouseAction activeHouseId={activeHouse.id} />
      </CardContent>
    </Card>
  );
};

export default CurrentUserActionGroup;