How to make header checkbox with drop dwon configurable.

I am using header checkbox wit drop down which has multiple option like All, Page,and None, But i want to make it configurable based on props value.

If my props value is true i want to show check box with drop down else, i want to render simple header checkbox. is there any way to achieve that.

I tried making headerCellRender configurable based on property but that doesn't seems to be working. Please find the logic of headerCellRender and let me know if i am something or is it really possible or not.

const headerCellRender = (cell: any, gridProps: GridColumnProps) => {
if (props.showdropDown) {
if (gridProps.field === 'selected') {
return <DropDownList
data={["All", "Page", "None"]}
style={{ width: 35, paddingLeft: 0 }}
popupSettings={{ width: '200' }}
valueRender={valueRender}
onChange={handleHeaderDropDownChange} />
}
return cell
}
else {
return <GridColumn field="selected" width="30px"
filterable={false}
headerSelectionValue={dataResult.data !== undefined ? (dataResult.data[0] !== undefined && props.data.findIndex((dataItem: any) => dataItem.selected !== true) === -1) : false}
/>
}
}