Displaying full-width row data with the RowBody feature

2. Our next step is to create a new Ext.grid.feature.RowBody instance and add it
to our grid's features configuration option:
...
features: [Ext.create('Ext.grid.feature.RowBody', {})],
...

3. If we view the result so far, we can see the RowBody being added but it is empty.

4. We must now configure it to display the data we want. We do this by overriding the
getAdditionalData method of the Ext.grid.feature.RowBody class, which
returns an object literal that is applied to the RowBody's markup template. We set
the rowBody property of the returned object to the description contained in our
Model's data.
features: [Ext.create('Ext.grid.feature.RowBody', {
getAdditionalData: function(data){
var headerCt = this.view.headerCt,
colspan = headerCt.getColumnCount();
return {
rowBody: data.Description,
rowBodyCls: this.rowBodyCls,
rowBodyColspan: colspan
};
}

6. We solve this problem by adding another grid feature called the Ext.grid.
feature.RowWrap to the grid's features array. We do this by using its ftype
(which, as mentioned earlier, is similar to an xtype but is specific for features):
...
{
ftype: 'rowwrap'
}
...