Mobile language syntax highlighting

[KillianSmith0]

After doing some digging in the developer-docs repo,
I realized the documentation is getting syntax highlighting through this repo's use of the prism-react-renderer plugin. After looking at the supported languages, it seems like they don't support languages used by our mobile integrators.

Expectations

I expected code snippet syntax highlighting to support common mobile development languages like java/kotlin/swift.

Reality

Code snippet syntax highlighting doesn't support common mobile development languages.

Steps to Reproduce

1. Visit some public mobile documentation
2. Observe lack of syntax highlighting.

Note: Ignore the fact objective-c snippets aren't being highlighted, this is down to typos in the language keyword after the 3 back-ticks.

Hint to a solution
There is an FAQ on the repo's README.
This sections states how one could add these languages to Prism, in order for them to be picked up.

I've put up a PR on the repo, to add these languages to the default list, but it might be rejected.

Fine Print

• Component: CodeBlock ?
• Version: latest? 🤔
• Browsers: all

[jzempel]

@KillianSmith0 thanks for bringing this to our attention. After taking a closer look, I have a few thoughts on this. Although objectivec is a currently supported language, it appears that Garden does pretty well if you just go with the default CodeBlock, leaving language undefined. CodeSandbox https://codesandbox.io/s/code-block-mobile-d656h renders the following:

Compare this with a test against https://prismjs.com/test.html#language=swift which yields the following:

In this case swift is only slightly more accurate with identifying class-name tokens, where Garden's default falls back on maybe-class-name (which, given the other language testing anomalies, we've declined to style).

I appreciate your PR addition with FormidableLabs. If they allow it through, hopefully it won't add too much weight to the library. However, even if it makes it through, Garden will likely need to go through a follow-on design+dev phase to pick off and style the primary tokens of interest based on the new languages.

Currently, I would encourage using default CodeBlock on developer.zendesk.com. I think you'll render an immediately elevated and more accessible experience. In the short term, we might be able to work with you to enhance objectivec styling. However, my initial tests with https://prismjs.com/test.html#language=objectivec show that Prism's Objective-C parsing is pretty weak – a majority of non-punctuation tokens are simply getting missed.

Hope this helps and let me know what you think. Cheers.

[KillianSmith0]

Hey @jzempel

Appreciate the response and the code sample!
This is all good info, it seems I misunderstood how Garden's react-component gets its syntax highlighting. I thought it takes it right from Prism, since the included languages accepts objective-c.
So CodeBlock has its own syntax highlighting, cool.

It seems that CodeBlock's highlighting would be sufficient for developer-docs. However It seems like it has no highlighting whatsoever at the moment😢

I'll relay this info onto the developer-docs teams as I'm actually one of the SDK devs that is a bit out of my depth lol.

Thanks so much for your help!