import {useState} from 'react';
import {Select,Window,WindowFooterActions} from '@nodedc/ui-react';
import {wirelessContributions,type SensorEnrollmentProps,type SensorUiContribution} from './extensions';

export function WirelessEnrollmentWindow({contributions,transport,onClose,onChange}:{
 contributions:readonly SensorUiContribution[];
 transport:SensorEnrollmentProps['transport'];onClose:()=>void;onChange:()=>void;
}) {
 const [selected,setSelected]=useState('');
 const supported=wirelessContributions(contributions);
 const Enrollment=supported.find(value=>value.kind===selected)?.wirelessEnrollment?.View;
 const renderWindow:SensorEnrollmentProps['renderWindow']=({content,actions,busy=false})=>(
  <Window open title="Подключение беспроводных устройств к БК" onClose={onClose}
   footer={actions?<WindowFooterActions>{actions}</WindowFooterActions>:undefined}>
   <div className="sensor-content">
    <Select label="Выбор поддерживаемого устройства" value={selected} disabled={busy}
     options={[{value:'',label:'Выберите поддерживаемое устройство',disabled:true},
      ...supported.map(value=>({value:value.kind,label:value.wirelessEnrollment!.label}))]}
     onChange={setSelected}/>
    {content}
   </div>
  </Window>
 );
 return Enrollment?<Enrollment key={selected} transport={transport} onClose={onClose} onChange={onChange} renderWindow={renderWindow}/>:renderWindow({content:null});
}