A better UI for the nested docs plugin

[sriechersrc]

Hi everyone,

at the moment it is hard to see relations between nested docs. It would be really nice to have visual groups in the admin panel, so pages like "/blog/my-first-blog-post", "/blog/my-second-blog-post", "/blog/my-second-blog-post/recommendations" are also visually nested under the first parent, in this case "blog".

Thank you for building such a nice product! Really pleased how v3 is coming along!

[andershermansen]

A suggestion here is to add a new readonly field in the collection which contains the full slug (based on the breadcrumb created by the nested docs plugin):

        {
            name: 'fullslug',
            label: 'Full Slug',
            type: 'text',
            admin: {
                readOnly: true,
            },
            hooks: {
                beforeChange: [
                    ({ data }) => {
                        return data.breadcrumbs[data.breadcrumbs.length - 1].url;
                    },
                ],
            }
        },

Then you can order by this field in the overview.

You don't get fully nested nice UI. So I understand this is not fully what you are after, but you get a bit better overview.

[sriechersrc]

@andershermansen this already helped quiet a lot, thanks!

[Twansparant]

Yes, this would be a massive improvement!
Being able to see the hierarchy in the collection list view would be awesome 👍

[kmiddlesworth]

Is there any update on this? Having a true, nested tree view would make life a lot easier for client content authors. Thanks!

[Grimmrobe]

To me this is a pretty essential feature for hierachical documents. We need to see them nested in the document list. I did experiment with adjusting the title table cell based on breadcrumb length and then adding a └─ .When combined with the sorting approach above this nearly does something. But it's not very good.

[CarloBu]

@sriechersrc, I've built a companion plugin for the nested-docs plugin.

you can check it out:
payload-nested-docs-page-tree