Skip to content

docs: New route for read random article in documentation#68043

Open
aparzi wants to merge 1 commit intoangular:mainfrom
aparzi:feat-randomic-topin-in-adev
Open

docs: New route for read random article in documentation#68043
aparzi wants to merge 1 commit intoangular:mainfrom
aparzi:feat-randomic-topin-in-adev

Conversation

@aparzi
Copy link
Copy Markdown
Contributor

@aparzi aparzi commented Apr 5, 2026

Add random route: 'angular.dev/random' for read random article

Fixed #68038

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • angular.dev application / infrastructure changes
  • Other... Please describe:

Issue Number: #68038

What is the new behavior?

Add new route '/randon' in angular documentation for read a random article

Does this PR introduce a breaking change?

  • Yes
  • No

@angular-robot angular-robot bot added the area: docs Related to the documentation label Apr 5, 2026
@ngbot ngbot bot added this to the Backlog milestone Apr 5, 2026
@erkamyaman
Copy link
Copy Markdown
Contributor

erkamyaman commented Apr 5, 2026

My idea was to navigate directly to an existing route with a basic function in the search dialogue, like Wikipedia random article feature, I suppose you have a different idea with a new route and a page

Add random route: 'angular.dev/random' for read random article

Fixed angular#68038
@aparzi aparzi force-pushed the feat-randomic-topin-in-adev branch from 67c6485 to d9f55cc Compare April 5, 2026 21:56
@aparzi aparzi marked this pull request as ready for review April 5, 2026 21:57
@pullapprove pullapprove bot requested a review from josephperrott April 5, 2026 21:57
@aparzi
Copy link
Copy Markdown
Contributor Author

aparzi commented Apr 5, 2026

My idea was to navigate directly to an existing route with a basic function in the search dialogue, like Wikipedia random article feature, I suppose you have a different idea with a new route and a page

I wanted to set it up this way for now, and I'd like to see some feedback from the team.

Currently, the random route redirects to a random page.

@erkamyaman
Copy link
Copy Markdown
Contributor

My idea was to navigate directly to an existing route with a basic function in the search dialogue, like Wikipedia random article feature, I suppose you have a different idea with a new route and a page

I wanted to set it up this way for now, and I'd like to see some feedback from the team.

Currently, the random route redirects to a random page.

Tbh I'm excited to see it, as soon as i have a chance, I will have a look, thanks for effort 👌

},
{
path: PAGE_PREFIX.RANDOM,
loadComponent: () => import('../features/random/random'),
Copy link
Copy Markdown
Contributor

@SkyZeroZx SkyZeroZx Apr 5, 2026

Choose a reason for hiding this comment

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

Not really sure it’s worth the cost of adding an extra component.

We could just use redirectTo for this: https://angular.dev/guide/routing/redirecting-routes#conditional-redirects

Or maybe browserUrl for this case: https://angular.dev/guide/routing/navigate-to-routes#display-a-different-url-in-the-address-bar

Is there any specific reason to do it this way?

wdyt some like

export const randomRedirectGuard: CanActivateFn = () => {
   // logic to build random URL

  return router.navigateByUrl(random, {
    browserUrl: '/random',
  });
};

export const routes = [
  {
    path: 'random',
    children: [],
    canActivate: [randomRedirectGuard],
   } 
  ]

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

No, there's no specific technical reason. I just wanted to set it up this way and see the initial feedback. I agree that the component is perhaps excessive.

Copy link
Copy Markdown
Contributor

@erkamyaman erkamyaman left a comment

Choose a reason for hiding this comment

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

there's no UI link (like a nav item or button) that points to /random, it's only accessible by navigating to /random directly in the URL. i guess it was intentional for now.

i tried your code on my machine by navigating to /random directly in the URL, all works well, thank you!

Comment on lines +15 to +31
const allItems = [
...flatNavigationData(SUB_NAVIGATION_DATA.docs),
...flatNavigationData(SUB_NAVIGATION_DATA.reference),
...flatNavigationData(SUB_NAVIGATION_DATA.tutorials),
];

const paths = allItems
.map((item) => item.path)
.filter((path): path is string => !!path && !path.startsWith('http'));

if (paths.length > 0) {
const randomPath = paths[Math.floor(Math.random() * paths.length)];
this.router.navigateByUrl(`/${randomPath}`, {replaceUrl: true});
} else {
this.router.navigateByUrl('/', {replaceUrl: true});
}
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

this logic does the job well!
just one thing but nit!

The current implementation can redirect the user back to the page they came from.
If I'm on /guide/components/selectors and hit /random, it could randomly pick /guide/components/selectors again and send me right back where I started.

},
{
path: PAGE_PREFIX.RANDOM,
loadComponent: () => import('../features/random/random'),
Copy link
Copy Markdown
Contributor

@erkamyaman erkamyaman Apr 6, 2026

Choose a reason for hiding this comment

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

i agree on that one with @SkyZeroZx we don't need a new component

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: docs Related to the documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

add "Random Topic" button to angular.dev for exploratory learning

3 participants