Nested with component ? Draggable in draggable ?

[bnbc]

Hello,

I have a list of folders containing projects. I want to be able to reorder the folders (which works), and I also want to reorder the projects within each folder and move them from one folder to another.
However, with this code, the projects don't move at all.

An idea ?

Do i have to use Nested ? but how with my component CardProject ?

Thks a lot !

    <draggable v-model="folderGroups" item-key="id" handle=".drag-handle-folder" @end="onFolderDragEnd">
        <template #item="{ element: folder }">         
                 <div class="text-h5">{{ folder.title }}</div>
                 <v-icon class="drag-handle-folder cursor-move">mdi-drag</v-icon>
                <v-divider class="mb-2"></v-divider>
                <div class="projects-drop-zone">
                    <draggable v-model="folder.projects" item-key="id" group="projects" class="d-flex ga-6 flex-wrap min-height-drop-zone"
                        >
                        <template #item="{ element: project }">
                            <CardProject :project="project" />
                        </template>
                    </draggable>
                </div>
            </div>
        </template>
    </draggable>