Selected framework is not consistent across multiple Code components in the page.

[FeedMyCat54]

What is the improvement or update you wish to see?

The code block components in a page can get out of sync with each other and start showing code from different frameworks. I was able to spot this in the oauth getting started page but I guess this might be happening to other pages as well.

Is there any context that might help us understand?

The code block component gives the user the option to select a framework and view only the code for the selected framework. This then makes all the other code components show the code for that framework. However in the case where the list of available frameworks doesn't stay the same for every code component in the page, this behavior creates a few issues.

1. The code components always so the n-th element of the list instead of the framework that was selected:

In the example above, the user selects "SvelteKit" in the components above. The parts that have 4 options update properly. The part "Add Signin button" however, contains an additional option (Next.js (Client)) before that and ends up showing the code for qwik.

2. If the user tries to use the code component selector in a component that has more options than the other components they can potentially get out of sync.

In the example above I selected "Express" from the "Add Signin button". All the other components, that had less options, now show the code for Next.js

Does the docs page already exist? Please link to it.

https://authjs.dev/getting-started/authentication/oauth

[github-actions]

This issue was marked with the good first issue label by a maintainer.

This means that it is a good candidate for someone interested in contributing to the project, but does not know where to start.

Have a look at the Contributing Guide first.

This will help you set up your development environment to get started. When you are ready, open a PR, and link back to this issue in the form of adding Fixes #1234 to the PR description, where 1234 is the issue number. This will auto-close the issue when the PR gets merged, making it easier for us to keep track of what has been fixed.

Please make sure that - if applicable - you add tests for the changes you make.

If you have any questions, feel free to ask in the comments below or the PR. Generally, you don't need to @mention anyone directly, as we will get notified anyway and will respond as soon as we can)

Note

There is no need to ask for permission "can I work on this?" Please, go ahead if there is no linked PR 🙂