AppFlowy-IO/AppFlowy

Fork 0

mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2026-03-24 12:56:59 +00:00

[GH-ISSUE #4282] [FR] Outline for subpages #1911

New issue

Open

opened 2026-03-23 21:18:12 +00:00 by mirror · 10 comments

mirror commented

2026-03-23 21:18:12 +00:00

Owner

Originally created by @PeterHero on GitHub (Jan 2, 2024).
Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/4282

Description

Outline for page can be created using /outline. It uses headlines.
The same functionality should be for creating the outline for sub pages. It would allow easy navigation in nested documents structure.

It could look like this:

Impact

Easy navigation through sub documents.
I like to have a nested structure of smaller documents. This would enable to have the top document as a overview of the structure. One could easily navigate to the specific document.

Additional Context

I don't have a good idea for the keyword when using '/'.
Maybe 'structure', 'overview'? Any suggestions?

Originally created by @PeterHero on GitHub (Jan 2, 2024). Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/4282 ### Description Outline for page can be created using `/outline`. It uses headlines. The same functionality should be for creating the outline for sub pages. It would allow easy navigation in nested documents structure. It could look like this: ![structure1](https://github.com/AppFlowy-IO/AppFlowy/assets/115150415/5ab3beac-6015-4656-8bbc-9e4c462c7ffd) ![structure2](https://github.com/AppFlowy-IO/AppFlowy/assets/115150415/3e767170-4fce-4a00-aab2-b8208eef027b) ### Impact Easy navigation through sub documents. I like to have a nested structure of smaller documents. This would enable to have the top document as a overview of the structure. One could easily navigate to the specific document. ### Additional Context I don't have a good idea for the keyword when using '/'. Maybe 'structure', 'overview'? Any suggestions?

mirror added the

2024

editor

improvements

labels

2026-03-23 21:18:12 +00:00

mirror commented

2026-03-23 21:18:12 +00:00

Author

Owner

@LucasXu0 commented on GitHub (Jan 2, 2024):

How about the 'hierarchy' or 'directory'?

@LucasXu0 commented on GitHub (Jan 2, 2024): How about the 'hierarchy' or 'directory'?

mirror commented

2026-03-23 21:18:13 +00:00

Author

Owner

@Jayaprakash-dev commented on GitHub (Jan 7, 2024):

Hey @LucasXu0 @annieappflowy,
I would like to work on this issue!

@Jayaprakash-dev commented on GitHub (Jan 7, 2024): Hey @LucasXu0 @annieappflowy, I would like to work on this issue!

mirror commented

2026-03-23 21:18:13 +00:00

Author

Owner

@LucasXu0 commented on GitHub (Jan 8, 2024):

Hey, @Jayaprakash-dev. Do you already have any idea on how to implement it? If so, please share it here.

@LucasXu0 commented on GitHub (Jan 8, 2024): Hey, @Jayaprakash-dev. Do you already have any idea on how to implement it? If so, please share it here.

mirror commented

2026-03-23 21:18:13 +00:00

Author

Owner

@PeterHero commented on GitHub (Jan 8, 2024):

It could be useful to change the depth of the outline. Could that be please added as a functionality?

@PeterHero commented on GitHub (Jan 8, 2024): It could be useful to change the depth of the outline. Could that be please added as a functionality?

mirror commented

2026-03-23 21:18:13 +00:00

Author

Owner

@Jayaprakash-dev commented on GitHub (Jan 8, 2024):

Hey, @Jayaprakash-dev. Do you already have any idea on how to implement it? If so, please share it here.

Hey @LucasXu0, I haven't fully figured out the optimal solution yet; currently, I'm surfing through the code base. Sure, I'll reach out to you once I've found a solution for it.

@Jayaprakash-dev commented on GitHub (Jan 8, 2024): > Hey, @Jayaprakash-dev. Do you already have any idea on how to implement it? If so, please share it here. Hey **@LucasXu0**, I haven't fully figured out the optimal solution yet; currently, I'm surfing through the code base. Sure, I'll reach out to you once I've found a solution for it.

mirror commented

2026-03-23 21:18:13 +00:00

Author

Owner

@Jayaprakash-dev commented on GitHub (Jan 8, 2024):

It could be useful to change the depth of the outline. Could that be please added as a functionality?

Hey @PeterHero, Could you please provide more details? Currently, the /outline command outputs all headings, including subheadings up to level 3. Are you suggesting it should only display headings at a certain depth, such as only top-level headings or outputs up to subheadings levels 1 or 2? Your clarification on this would be super helpful.

@Jayaprakash-dev commented on GitHub (Jan 8, 2024): > It could be useful to change the depth of the outline. Could that be please added as a functionality? Hey **@PeterHero**, Could you please provide more details? Currently, the `/outline` command outputs all headings, including subheadings up to level 3. Are you suggesting it should only display headings at a certain depth, such as only top-level headings or outputs up to subheadings levels 1 or 2? Your clarification on this would be super helpful.

mirror commented

2026-03-23 21:18:14 +00:00

Author

Owner

@PeterHero commented on GitHub (Jan 8, 2024):

The comment was connected to this issue. I meant the depth of the outline for subpages. There could be a selection next to the '/hierarchy' (or what it'd be called) where you could select the depth as a number. Hierarchy would be generated only to this depth.
Usecase: it is useful to create overview of subpages but not contain all of them because then it would become bloated and not clear.

@Jayaprakash-dev But yes, it could be applied to /outline as well.

@PeterHero commented on GitHub (Jan 8, 2024): The comment was connected to this issue. I meant the depth of the outline for subpages. There could be a selection next to the '/hierarchy' (or what it'd be called) where you could select the depth as a number. Hierarchy would be generated only to this depth. Usecase: it is useful to create overview of subpages but not contain all of them because then it would become bloated and not clear. @Jayaprakash-dev But yes, it could be applied to `/outline` as well.

mirror commented

2026-03-23 21:18:14 +00:00

Author

Owner

@Jayaprakash-dev commented on GitHub (Jan 10, 2024):

Hey @LucasXu0 & @PeterHero,

I've successfully implemented the feature that controls the depth of the OutlineBlockComponent block. Now, when a depth H1 is selected, the app displays headings up to level 1, and similarly for H2, it shows headings up to level 2, extending to subsequent H3 headings.

As of now, the app only supports options up to Heading 3, and that's why I limited this feature to H3 Heading.

However, I'm facing a challenge in generating Localkeys for lang translation in this implementation. If you have any guidance or suggestions on how to proceed, it would be helpful. If necessary, I can share the relevant code snippet here for your review.

Looking forward to your response and guidance on this matter.

https://github.com/AppFlowy-IO/AppFlowy/assets/68953739/63f0ea8e-c4f8-413d-9db8-e9cf2e57f4cc

https://github.com/AppFlowy-IO/AppFlowy/assets/68953739/e9d66143-ce55-4e05-b76f-34e9decb1c78

I understand the issue involves creating an outline-like structure for the pages. However, when @PeterHero commented about the possibility of implementing depth control for the Outline, I thought it would be relatively easier to implement.

@Jayaprakash-dev commented on GitHub (Jan 10, 2024): Hey @**LucasXu0** & @**PeterHero**, I've successfully implemented the feature that controls the depth of the `OutlineBlockComponent` block. Now, when a depth H1 is selected, the app displays headings up to level 1, and similarly for H2, it shows headings up to level 2, extending to subsequent H3 headings. As of now, the app only supports options up to Heading 3, and that's why I limited this feature to H3 Heading. However, I'm facing a challenge in generating `Localkeys` for lang translation in this implementation. If you have any guidance or suggestions on how to proceed, it would be helpful. If necessary, I can share the relevant code snippet here for your review. Looking forward to your response and guidance on this matter. https://github.com/AppFlowy-IO/AppFlowy/assets/68953739/63f0ea8e-c4f8-413d-9db8-e9cf2e57f4cc https://github.com/AppFlowy-IO/AppFlowy/assets/68953739/e9d66143-ce55-4e05-b76f-34e9decb1c78 _I understand the issue involves creating an outline-like structure for the pages. However, when @**PeterHero** commented about the possibility of implementing depth control for the `Outline`, I thought it would be relatively easier to implement._

mirror commented

2026-03-23 21:18:14 +00:00

Author

Owner

@PeterHero commented on GitHub (Jan 10, 2024):

@Jayaprakash-dev, I created a new issue where this feature could be tracked. It is better to have separate issues for separate features.

@PeterHero commented on GitHub (Jan 10, 2024): @Jayaprakash-dev, I created a new issue where this feature could be tracked. It is better to have separate issues for separate features.

mirror commented

2026-03-23 21:18:14 +00:00

Author

Owner

@Jayaprakash-dev commented on GitHub (Jan 19, 2024):

Hey @LucasXu0,

I've successfully implemented the feature and submitted a pull request. Now, users can create an outline/overview for the workspace folder and its sub-pages.

@Jayaprakash-dev commented on GitHub (Jan 19, 2024): Hey @LucasXu0, I've successfully implemented the feature and submitted a pull request. Now, users can create an outline/overview for the workspace folder and its sub-pages.

mirror referenced this issue

2026-03-23 22:16:48 +00:00

[PR #1911] [MERGED] fix: smart edit bugs #5009