Decisions on what to make an Input

[tiagomsmagalhaes]

This is awesome. I have one question about the "decisions" when transforming this

<app-card *ngFor="let task of tasks" cdkDrag><ion-icon cdkDragHandle [src]="iconsService.getIconPath('drag')"> </ion-icon>
   <div class="content">    
      <p>{{task.title}}</p>    
      <p>{{task.instructions}}</p>    
   </div>    
   <app-delete-card-button></app-delete-card-button>    
</app-card>

Into this:

<app-drag-task [tasks]="tasks" [iconsService]="iconsService" [task]="task"></app-drag-task>

Would it be possible to keep the ng-for in the new component, and remove the task array?

[obenjiro]

Can you highlight what part of original code you are extracting?

[tiagomsmagalhaes]

The first chunk was the code I highlighted and executed the command to extract

[obenjiro]

Ok got it.

What i can do quickly is to convert this

<app-card *ngFor="let task of tasks" cdkDrag><ion-icon cdkDragHandle [src]="iconsService.getIconPath('drag')"> </ion-icon>
   <div class="content">    
      <p>{{task.title}}</p>    
      <p>{{task.instructions}}</p>    
   </div>    
   <app-delete-card-button></app-delete-card-button>    
</app-card>

To this

<app-drag-task [tasks]="tasks" [iconsService]="iconsService"></app-drag-task>

If you want to go even deeper and inline tasks from parent component into child component is little bit harder. I need to analyze parent component code and figure out a way to extract items and add them to child component to do this:

<app-drag-task  [iconsService]="iconsService"></app-drag-task>

---

So will it be ok to settle on for now?

<app-drag-task [tasks]="tasks" [iconsService]="iconsService"></app-drag-task>

And create a new issue (becouse it will make much more time?)

[obenjiro]

Done in v0.1.0, now we getting correct code

<app-drag-task [tasks]="tasks" [iconsService]="iconsService"></app-drag-task>