Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(v2): fix docs homepage permalink issues #2905

Merged
merged 18 commits into from
Jun 17, 2020

Conversation

slorber
Copy link
Collaborator

@slorber slorber commented Jun 8, 2020

Related to issues:

#2896
#2861
#2652
#2879


Current docs homepage code almost works but introduce workarounds at the "edges" (for example we have to handle if/else logic specific to the homepage in the theme components).

I think we should do the opposite, fix the feature at the core directly in the metadata, so that it works once and for all.

I've been able to simplify the docs homepage code, as well as fixing some issues at the same time (like the "previous" link not pointing correctly to /docs).

The idea is simple:

  • We should add a single /docs route per version, with exact: false, so that it can match both /docs and /docs/*
  • Docs home should have permalink: /docs/

This way, we are able to handle the homepage like any regular page, with the same data file and the same render path (renderRoutes()).

Having a single parent route is also a bit better for perf, because it permits to avoid unmounting/remounting the docs layout when navigation from /docs/ to /docs/nextDoc.

This enabled me to remove some code introduced in the themes, in both classic/bootstrap.

Even if it renders correctly for /docs, I had to put a trailing / in the permalink (so the canonical docs home is /docs/ not /docs), not easy to fix and probably not a big deal.

@facebook-github-bot facebook-github-bot added the CLA Signed Signed Facebook CLA label Jun 8, 2020
@docusaurus-bot
Copy link
Contributor

docusaurus-bot commented Jun 8, 2020

Deploy preview for docusaurus-2 ready!

Built with commit 258c6ac

https://deploy-preview-2905--docusaurus-2.netlify.app

@slorber slorber changed the title fix homepage permalink bug(v2): fix docs homepage permalink issues Jun 8, 2020
@slorber
Copy link
Collaborator Author

slorber commented Jun 8, 2020

Hi @lex111 @fanny , this PR is ready to review.

I was able to remove a few lines of code and simplify the docs home implementation. The themes should not need to handle the homepage in a specific way anymore.

This also fixes the "previous" link here: #2896 (comment)


return false;
};

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 code I was able to delete by using permalink = / in metadatas

content: metadataItem.source,
},
});
}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 code I was able to delete by using permalink = / in metadatas

) : (
renderRoutes(baseRoute.routes)
)}
{renderRoutes(baseRoute.routes)}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 was able to revert the changes that are no longer required for docs homepage support

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@fanny actually as it's bootstrap :)

) : (
renderRoutes(baseRoute.routes)
)}
{renderRoutes(baseRoute.routes)}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 was able to revert the changes that are no longer required for docs homepage support

const isActiveSidebarItem = (item, activePath) => {
if (item.type === 'link') {
return item.href === activePath;
return isSamePath(item.href, activePath);
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

consider /docs is active if path is /docs/

throw new Error(
`The docs homepage (homePageId=${homePageId}) is not allowed to have a frontmatter slug=${frontMatter.slug} => you have to chooser either homePageId or slug, not both`,
);
}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 introduce a new warning, as discussed in #2879

As we don't duplicate the docs home (ie no /docs + /docs/introduction), then we should rather prevent the user to use the :slug frontmatter, as that wouldn't make sense)

Copy link
Contributor

@lex111 lex111 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I feel so dumb because I really could go this easier, more natural way to implement the docs homepage feature 🤦

@slorber alright, thank you for carrying that forward to its meaningful conclusion!

However, I noticed some bugs:

  • "Nested" docs (with slashes/dirs) no longer work if you define it in homePageId (e.g. doc_cat/intro). You can look at an example on Chart.js https://github.com/chartjs/Chart.js/blob/master/docs/sidebars.js#L8

  • When in docs-only mode enabled (set to routeBasePath: '/') and homePageId set with any value (eg introduction), all docs routes display content for specified homePageId, and without a layout website:

image

@slorber
Copy link
Collaborator Author

slorber commented Jun 9, 2020

I feel so dumb because I really could go this easier, more natural way to implement the docs homepage feature 🤦

That happens 🤪


Thanks, will take a look to fix that.

I'm not sure to understand what you mean by nested docs for now ^^

@slorber
Copy link
Collaborator Author

slorber commented Jun 9, 2020

@lex111


I fixed the first issue related to docs in subfolders, deployed in the preview a test:

https://deploy-preview-2905--docusaurus-2.netlify.app/docs/next/

BTW this raises another question that's visible in the: as I selected as home doc id a new doc, and older versions do not have this doc, this basically breaks the homepage of other versions.

The home of current version is now broken:

https://deploy-preview-2905--docusaurus-2.netlify.app/docs/

Shouldn't we version this homeDocId? cc @yangshun

It looks like I should be able to say:

  • current version home is introduction
  • next version home is getting-started

For the 2nd issue about / as root for docs, that's quite complicated 🤪
It goes deep into the routesChunkName.json file, as 2 routes (docItem/docPage) tries to write the entry for "/", and we end up with a bad merge:

  "/": {
    "component": "component---theme-doc-item-178-a40",
    "docsMetadata": "docsMetadata---ec-1-ddf",
    "content": "content---ec-6-8fc"
  },

Before we had:

  "/": {
    "component": "component---theme-doc-page-1-be-9be",
    "docsMetadata": "docsMetadata---c-78-ad7",
    "content": "content---ec-6-8fc"
  },
  "/:route": {
    "component": "component---theme-doc-page-1-be-9be",
    "docsMetadata": "docsMetadata---routeec-1-f92"
  },

Will try to find a solution, not so simple :)

edit: found a workaround => #2917

BTW the current master isn't working perfectly either:

  • incorrect sidebar highlighting
  • the homepage works, but the sidebar link to the homepage (installation) does not lead anywhere

@yangshun
Copy link
Contributor

Shouldn't we version this homeDocId?

Yes I think so, but not sure how to do so or if it's even possible, given that we don't version the docusaurus.config.

@slorber
Copy link
Collaborator Author

slorber commented Jun 10, 2020

Yes I think so, but not sure how to do so or if it's even possible, given that we don't version the docusaurus.config.

Same, but not sure how to do that without introducing a new versioned file 🤪 I think it can be fine for now, it probably does not happen often that the user decides to change the homepage. Likely, The homepage feature is likely the most important for the current version IMHO, it's probably not a big deal if the user does not have the homepage on /next if he does the change.

One hacky way to solve that is to allow passing an array: homePageId: ["newNextVersionHomePageId","oldHomePageId"]. I'd rather not add that but this is a potential hack we can add if users complain.

@slorber
Copy link
Collaborator Author

slorber commented Jun 10, 2020

Hi @lex111

The first issue: already solved (currently deployed to netlify, will revert soon to prepare for merge)

The 2nd issue:
I've found a bug where the parent route ("/": docs layout/DocPage) is the same as the child route ("/": home of docs/DocItem).
Documented this here: #2917

I was able to find a workaround by using "" as parent route and "/" as child route, "/next" as parent route, and "/next/" as child route and it seems to work fine.

Here's a deployment if you want to test easily:

https://focused-hoover-167617.netlify.app/
https://focused-hoover-167617.netlify.app/next
https://focused-hoover-167617.netlify.app/2.0.0-alpha.50/

Do you see any problem?

@slorber slorber requested a review from lex111 June 10, 2020 15:30
// Important: the layout component should not end with /,
// as it conflicts with the home doc
// Workaround fix for https://github.com/facebook/docusaurus/issues/2917
const path = docsBaseRoute === '/' ? '' : docsBaseRoute;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 This is the workaround fix for the 2nd issue (ie base path for / is "", not "/", to not conflict with home doc which is also "/")

const id = dirName !== '.' ? `${dirName}/${baseID}` : baseID;
const idWithoutVersion = version ? removeVersionPrefix(id, version) : id;

const isDocsHomePage = idWithoutVersion === homePageId;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lex111 this is the fix for the 1st issue you reported

@slorber slorber linked an issue Jun 11, 2020 that may be closed by this pull request
@slorber
Copy link
Collaborator Author

slorber commented Jun 12, 2020

@lex111 @yangshun can you review this please?

# Conflicts:
#	packages/docusaurus-plugin-content-docs/src/index.ts
@slorber slorber changed the title bug(v2): fix docs homepage permalink issues fix(v2): fix docs homepage permalink issues Jun 17, 2020
@slorber slorber added pr: bug fix This PR fixes a bug in a past release. pr: maintenance This PR does not produce any behavior differences to end users when upgrading. and removed pr: maintenance This PR does not produce any behavior differences to end users when upgrading. labels Jun 17, 2020
@slorber slorber merged commit f6b1c85 into facebook:master Jun 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed Signed Facebook CLA pr: bug fix This PR fixes a bug in a past release.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Using _index id in sidebar.js
5 participants