Hi Skirtle,
I managed to add grids into each cell with your method... now my problem is this (IDK if It can be done)
I call the store for each grid like this:

{text: 'Nivel 1',dataIndex: 'Codigo_Asignatura', xtype: 'componentcolumn',width: 202,
renderer: function(Codigo_Asignatura) {
return {
xtype: 'grid',
scope: this,
columns:[{text: 'Asignaturas', dataIndex: 'Codigo_Asignatura',width: 152}]

It obviously shows the same little grid inside each row of the main colum so.... how could I show different grids (different data) in each of the main rows?? is this possible?? like calling the store again in each row or something....