Fix TypeScript errors in "Configuration" & "Routing and navigation" code snippets

[ArmandPhilippot]

Description (required)

Fixes TypeScript errors in "Configuration" and "Routing and navigation" pages:

• view-transitions.mdx:
  • add missing Astro.props
  • querySelector can return null
  • event.target.value is not available without narrowing the type
  • redirect can be null when using params.get
  • unclosed <script /> tag
  • consistency: other snippets are wrapped in script tags
  • setupStuff() comes from nowhere, a fake import can be helpful
• prefetch.mdx
  • document.getElementById can be null
  • forEach doesn't work with HTMLCollectionOf
  • getAttribute can return null
• internationalization.mdx
  • ctx.url is a URL, startsWith is not available
  • missing prop in redirectToDefaultLocale (we should pass ctx)
  • useless async
• middleware.mdx
  • missing context. before locals
  • missing import
• endpoints.mdx
  • params.id is string | undefined and undefined "cannot be used as an index type". If we narrow the type to string (using APIRoute type parameters), TypeScript complains because a string can't be used for index access... Number() might not be the best (NaN) but it's the easier fix to make it TS friendly.
  • without satisfies APIRoute, TypeScript complains about the destructured properties.
  • TypeScript complains about Buffer and, unlike process.env, there is no clues in the editor to fix this, adding a comment might be helpful
  • missing import
• routing.mdx:
  • TypeScript complains about page without satisfies GetStaticPaths
  • because function getStaticPaths has been updated to const getStaticPaths above, the following code snippet should use the same syntax
  • missing closing fence
  • TS complains about post.frontmatter.tag, we need post: any
• typescript.mdx:
  • showing as Params when satisfies GetStaticPaths is used is misleading: we don't need a cast here

To help review and explain my changes I made a commit per code snippet (with a few exceptions where the changes were the same), with a short explanation of why in the commit message. But, I also repeat the explanation above. Choose what is easier for you!

I haven't updated a few code snippets in view-transitions.mdx as I'm not really familiar with the API but:

• https://docs.astro.build/en/guides/view-transitions/#fallback-control a transition on <title> seems weird to me
• https://docs.astro.build/en/guides/view-transitions/#astrobefore-swap the second code snippet uses diff() in an is:inline script... not sure this is clear to everyone where diff() comes from.

If you're interested in the "why," here's my reasoning:

Code snippets should work with minimal friction for users: TypeScript red squiggles or missing imports provide bad DX, especially for people new with web dev. I guess this can help AI too now.

Also, since Astro v5, the default Typescript preset is strict instead of base. This means TypeScript is now reporting errors for some code snippets that could work before. We had some reports before, we fixed them. We still get new reports from time to time, so I'm starting to check all our code snippets.

re: formatting changes
In the core repo they tend to use single quotes, but in a new project without custom configuration (in VSCode, with the Astro extension enabled), this is automatically formatted with double quotes: I think minimal visual changes for the user are a good thing. So, I haven't undone the formatting changes made when correcting the code snippets.

kinda related to #10073

Related issues & labels (optional)

• Suggested label: code snippet update

[astrobot-houston]

Lunaria Status Overview

🌕 This pull request will trigger status changes.

Learn more

By default, every PR changing files present in the Lunaria configuration's files property will be considered and trigger status changes accordingly.

You can change this by adding one of the keywords present in the ignoreKeywords property in your Lunaria configuration file in the PR's title (ignoring all files) or by including a tracker directive in the merged commit's description.

Tracked Files

File	Note
en/guides/endpoints.mdx	Source changed, localizations will be marked as outdated.
en/guides/internationalization.mdx	Source changed, localizations will be marked as outdated.
en/guides/middleware.mdx	Source changed, localizations will be marked as outdated.
en/guides/prefetch.mdx	Source changed, localizations will be marked as outdated.
en/guides/routing.mdx	Source changed, localizations will be marked as outdated.
en/guides/typescript.mdx	Source changed, localizations will be marked as outdated.
en/guides/view-transitions.mdx	Source changed, localizations will be marked as outdated.

Warnings reference

Icon	Description
🔄️	The source for this localization has been updated since the creation of this pull request, make sure all changes in the source have been applied.

[github-actions]

Preview deployment

✅ Deployment complete!

• Latest commit: 44d1c60
• Preview: https://armand-fix-guides-code-snippets.previews.docs.astro.build
• Workflow run: View logs

[ArmandPhilippot]

This is ready for review... but I can see this is a lot to review at once. I'll split it!

This is now focused on "Configuration" & "Routing and navigation" code snippets, follow-up PRs:

• Fix TypeScript errors in "Build your UI" code snippets #14090
• Fix TypeScript errors in "Add content to your site" code snippets #14091
• Fix TypeScript errors in "Server rendering" code snippets #14092

Well, the PR is smaller but the description is now bigger. 😅 Feel free to ask for more details!