Hide checkcell on render - extjs 6.5.3 modern

I am trying to hide the checkcell of a checkcolumn if the value of another column is null. But unfortunately according to the sencha docs This config is only processed if the cell type is the default of Ext.grid.cell.Cell.

So the solution with the renderer config won't work.

For Example:

{
        xtype: 'checkcolumn',
        dataIndex: 'isSomething',
        text: '',
        width: 30,
        menuDisabled: true,
        headerCheckbox: false,
        renderer: function(value, record) {
            var relatedValue = record.get('somethingElse');
            return relatedValue ? new Ext.grid.column.Check().renderer(value) : '';
        }
    }

Any tips or tricks to accomplish that?

You could use gridcell and inside gridcell you can use checkbox to achieve your requirement.

In this FIDDLE, I have created a demo using gridcell and checkbox. I hope this will help/guide you to achieve your requirement.

CODE SNIPPET

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create({

            xtype: 'grid',

            title: 'Tree Grid Demo',

            // itemConfig: {
            //     viewModel: true
            // },

            store: {

                fields: [{
                    name: 'isCheck',
                    defaultValue: true
                }],
                data: [{
                    firstname: "Michael",
                    lastname: "Scott",
                    seniority: 7,
                    department: "Management",
                    hired: "01/10/2004"
                }, {
                    firstname: "Dwight",
                    lastname: "Schrute",
                    seniority: 2,
                    department: "Sales",
                    hired: "04/01/2004"
                }, {
                    firstname: "Jim",
                    lastname: "Halpert",
                    seniority: 3,
                    department: "Sales",
                    hired: "02/22/2006"
                }, {
                    firstname: "Kevin",
                    lastname: "Malone",
                    seniority: 4,
                    department: '',
                    hired: "06/10/2007"
                }, {
                    firstname: "Angela",
                    lastname: "Martin",
                    seniority: 5,
                    department: "Accounting",
                    hired: "10/21/2008"
                }]
            },

            columns: [{
                text: 'First Name',
                dataIndex: 'firstname'
            }, {
                text: 'Last Name',
                dataIndex: 'lastname'
            }, {
                text: 'Hired Month',
                dataIndex: 'hired'
            }, {
                text: '',
                width: 30,
                renderer: function (value, record, index, cell) {
                    if (record.get('department')) {
                        cell.setTools({
                            xtype: 'checkbox',
                            checked: record.get('isCheck')
                        });
                    } else {
                        return '';
                    }
                }

                /*cell: {
                    tools: {
                        xtype: 'checkbox',
                        bind: {
                            hidden: '{!record.department}',
                            checked: '{record.isCheck}'
                        }
                    }
                }*/
            }],

            fullscreen: true
        });
    }
});