Include the ability to toggle between JavaScript and TypeScript

[ajcwebdev]

If we look at Prisma's documentation we see that we can toggle between JavaScript and TypeScript (and even between Postgres and MySQL).

The RTK docs do this for some examples as well and Mark opened an issue to Update all code blocks to toggle between TS and JS syntax.

The RTK docs currently use Lenz Weber's https://github.com/phryneas/remark-typescript-tools plugin to let us write TS syntax in code blocks, compile away the TS syntax to plain JS, and show both versions as a tab, as seen at https://redux-toolkit.js.org/api/createSlice:

The relevant RTK docs build config is at https://github.com/reduxjs/redux-toolkit/blob/818efb9c9e46df23c891feaab869d72f2d9ecc35/website/docusaurus.config.js#L12-L53 .

We might also want to look at https://shikijs.github.io/twoslash/ , which is built by one of the TS devs. Lenz has said he'd like to investigate switching the RTK docs over to that at some point, so worth considering now.

[Mihir008]

sir can i contribute??

[thedavidprice]

@Mihir008 contributions are very much welcome!

My concern about this Issue is that it's open ended and potentially has a massive scope. Additionally, it will include UI additions, which can also require a lot of discussion. My advice if you want to try working on something:

• pick one specific doc on Redwoodjs.com that has a small number of code snippets (and where TS would be applicable)
• keep the UI simple by just focusing on tabs for code blocks. See this example how Docusaurus does tabs + code blocks
• bonus (but may be out of scope): make tab selection global on a page; e.g. if I select TS for one code block, then all code block will toggle to TS

Given all that, what do you think?

[ajcwebdev]

@Mihir008 is this still something you're interested in contributing?