lti-web-client/src/app/production/transfer-to-laying/detail/page.tsx

'use client';

import { useRouter, useSearchParams } from 'next/navigation';
import useSWR from 'swr';

import TransferToLayingForm from '@/components/pages/production/transfer-to-laying/form/TransferToLayingForm';

import { TransferToLayingApi } from '@/services/api/production/transfer-to-laying';
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';

import { TransferToLaying } from '@/types/api/production/transfer-to-laying';

// TODO: delete dummy data
const DUMMY_TRANSFER_TO_LAYING_DETAIL: TransferToLaying = {
  id: 1,
  transfer_date: '2025-10-14',
  flock_source: {
    id: 1,
    name: 'Flock asal test',
  },
  flock_destination: {
    id: 2,
    name: 'Flock tujuan destination',
  },
  quantity: 10,
  kandangs: [
    {
      kandang: {
        id: 1,
        name: 'Kandang test',
        status: 'ACTIVE',
        location: {
          id: 1,
          name: 'test location',
          address: 'test address 1',
          area: { id: 1, name: 'test area 1' },
        },
        pic: {
          id: 1,
          id_user: 2,
          email: 'test@gmail.com',
          name: 'test',
        },
        created_user: {
          id: 1,
          id_user: 2,
          email: 'test@gmail.com',
          name: 'test',
        },
        created_at: '14-10-2025',
        updated_at: '14-10-2025',
      },
      quantity: 8,
    },
    {
      kandang: {
        id: 1,
        name: 'Kandang test 2',
        status: 'ACTIVE',
        location: {
          id: 1,
          name: 'test location',
          address: 'test address 1',
          area: { id: 1, name: 'test area 1' },
        },
        pic: {
          id: 1,
          id_user: 2,
          email: 'test@gmail.com',
          name: 'test',
        },
        created_user: {
          id: 1,
          id_user: 2,
          email: 'test@gmail.com',
          name: 'test',
        },
        created_at: '14-10-2025',
        updated_at: '14-10-2025',
      },
      quantity: 2,
    },
  ],
  reason: 'Test alasan',

  created_user: {
    id: 1,
    id_user: 2,
    email: 'test@gmail.com',
    name: 'test',
  },
  created_at: '14-10-2025',
  updated_at: '14-10-2025',
};

const TransferToLayingDetail = () => {
  const router = useRouter();
  const searchParams = useSearchParams();

  const transferToLayingId = searchParams.get('transferToLayingId');

  const { data: transferToLaying, isLoading: isLoadingTransferToLaying } =
    useSWR(transferToLayingId, (id: number) =>
      TransferToLayingApi.getSingle(id)
    );

  if (!transferToLayingId) {
    router.back();

    return (
      <div className='w-full flex flex-row justify-center items-center p-4'>
        <span className='loading loading-spinner loading-xl' />
      </div>
    );
  }

  // TODO: remove dummy data and integrate with real API
  if (
    !isLoadingTransferToLaying &&
    (!transferToLaying ||
      (isResponseError(transferToLaying) && !DUMMY_TRANSFER_TO_LAYING_DETAIL))
  ) {
    router.replace('/404');
    return;
  }

  return (
    <div className='w-full p-4 flex flex-row justify-center'>
      {isLoadingTransferToLaying && (
        <span className='loading loading-spinner loading-xl' />
      )}
      {/* {!isLoadingTransferToLaying && isResponseSuccess(transferToLaying) && (
        <TransferToLayingForm
          type='detail'
          initialValues={transferToLaying.data}
        />
      )} */}

      {/* TODO: remove this dummy data and integrate to real API */}
      <TransferToLayingForm
        type='detail'
        initialValues={DUMMY_TRANSFER_TO_LAYING_DETAIL}
      />
    </div>
  );
};

export default TransferToLayingDetail;