import { DateField, FunctionField, SelectField, Show, SimpleShowLayout, TextField } from 'react-admin';
import { EquipmentAttachmentLink } from './EquipmentAttachmentLink';
import { equipmentLabels, equipmentStatusChoices } from './shared';

export function EquipmentShow() {
  return (
    <Show>
      <SimpleShowLayout>
        <TextField source="id" />
        <TextField source="name" label={equipmentLabels.name} />
        <TextField source="serialNumber" label={equipmentLabels.serialNumber} />
        <DateField source="dateOfInspection" label={equipmentLabels.dateOfInspection} />
        <DateField source="commissionedAt" label={equipmentLabels.commissionedAt} />
        <DateField source="installationDate" label={equipmentLabels.installationDate} />
        <DateField source="writeOffDate" label={equipmentLabels.writeOffDate} />
        <SelectField source="status" label={equipmentLabels.status} choices={equipmentStatusChoices} />
        <FunctionField
          label="Вложения"
          render={(record: {
            id: string;
            attachments?: { id: string; originalFileName?: string | null }[] | null;
          }) => {
            const items = Array.isArray(record.attachments) ? record.attachments : [];
            if (!items.length) {
              return '-';
            }
            return (
              <div>
                {items.map((att) => (
                  <div key={att.id}>
                    <EquipmentAttachmentLink
                      equipmentId={record.id}
                      attachmentId={att.id}
                      fileName={att.originalFileName ?? 'файл'}
                    />
                  </div>
                ))}
              </div>
            );
          }}
        />
      </SimpleShowLayout>
    </Show>
  );
}