import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { connectionTypeNames, ImageColumn, StatusColumn, } from '../../../../lib/seam/components/SupportedDeviceTable/SupportedDeviceRow.js';
import { useDeviceProvider } from '../../../../lib/seam/components/SupportedDeviceTable/use-device-provider.js';
import { DotDivider } from '../../../../lib/ui/layout/DotDivider.js';
export function SupportedDeviceFilterResultRow({ deviceModel, }) {
    return (_jsxs("div", { className: 'seam-row filter-result-row', children: [_jsx(ImageColumn, { deviceModel: deviceModel }), _jsx(ModelColumn, { deviceModel: deviceModel }), _jsx(StatusColumn, { deviceModel: deviceModel })] }));
}
export function ModelColumn({ deviceModel, }) {
    const deviceProvider = useDeviceProvider(deviceModel.brand);
    return (_jsxs("div", { className: 'seam-col seam-model-col', children: [_jsxs("div", { className: 'seam-model-name', children: [_jsx("img", { src: deviceProvider.image_url, alt: deviceModel.brand, className: 'seam-brand-image' }), ' ', _jsx("div", { className: 'seam-truncated-text', children: deviceModel.model_name })] }), _jsx("div", { className: 'seam-model-id', children: _jsxs("div", { className: 'seam-truncated-text', children: [deviceModel.manufacturer_model_id, _jsx(DotDivider, {}), connectionTypeNames[deviceModel.connection_type]] }) })] }));
}
//# sourceMappingURL=SupportedDeviceFilterResultRow.js.map