/* eslint-disable canonical/id-match */
'use client';

import FloatingActionPanel from '@/components/shared/action-panel';
import { useCustomerQuery } from '@/hooks/api/customers';
import { usePushWithData } from '@/hooks/url';
import { Enum_Customer_Role } from '@repo/graphql/types';

type QuickAppointmentProps = {
  readonly telegramId: number;
};

export function ProfileButtons({ telegramId }: Readonly<QuickAppointmentProps>) {
  const push = usePushWithData();

  const { data: { customer: profile } = {}, isLoading: isLoadingProfile } = useCustomerQuery({
    telegramId,
  });
  const { data: { customer: currentUser } = {}, isLoading: isLoadingCurrentUser } =
    useCustomerQuery();

  const isLoading = isLoadingProfile || isLoadingCurrentUser;

  const handleBook = () => {
    if (profile?.role === Enum_Customer_Role.Client) {
      push('/orders/add', { client: profile, slot: { master: currentUser } });
    } else {
      push('/orders/add', { client: currentUser, slot: { master: profile } });
    }
  };

  if (!telegramId) return null;

  return <FloatingActionPanel isLoading={isLoading} onQuickBook={handleBook} />;
}
