Sencha treepanel에서 값은 바뀌지 않고, depth에 따라 indent처리해서 보여주기

Ext.application({
    name: 'ImageApp',

    launch: function () {
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: [
                {
                    xtype: 'panel',
                    title: 'Image Display',
                    html: '<img src="path/to/your/image.jpg" style="width:100%;height:auto;" alt="Example Image"/>'
                }
            ]
        });
    }
});
{ 
    text: '순서', dataIndex: 'index', flex: 1,
    editor: {
        xtype: 'textfield',
        allowBlank: false
    },
    renderer: function(value, metaData, record) {
        const depth = record.getDepth();
        const indent = depth * 20;
        return `<div style="margin-left: ${indent}px;">${value}</div>`;
    }
},