Revert "md: Replace tsx by ts for highlightjs support"

This reverts commit 8535416acc.

docs/DevDocs/Pages/PremierComposantReact.md

@@ -25,7 +25,7 @@ Par convention comme il est dit dans la section [Pour commencer](PourCommencer.m
 
 Maintenant créons le squelette du composant. Pour rappel, on utilise la syntaxe *fonctionnelle* (i.e. une fonction = un composant).
 
-```ts
+```tsx
 // Home.tsx
 export function Home(): JSX.Element {
   return <></>;
@@ -38,7 +38,7 @@ La convention de nommage indique qu'il faut prioriser les fonctions nommées (do
 
 Mettons le bouton html et mettons du texte dedans :
 
-```ts
+```tsx
 export function Home(): JSX.Element {
   return (
     <button>
@@ -53,7 +53,7 @@ export function Home(): JSX.Element {
 
 Pour que le bouton appelle une fonction nous allons utiliser la propriété `onClick`. Pour lui équiper d'une variable/fonction, on la met entre accolades `prop={var}`.
 
-```ts
+```tsx
 function GoHome(): void {
   location.reload();
 }
@@ -79,7 +79,7 @@ On sait que l'on doit l'ajouter dans la **barre** à gauche, soit `Bar.tsx`
 
 Commençons par importer le composant dans `Bar.tsx`:
 
-```ts
+```tsx
 // Bar.tsx
 import { Home } from '../Home/Home';
 ...
@@ -87,7 +87,7 @@ import { Home } from '../Home/Home';
 
 Puis ajoutons-le dans la vue :
 
-```ts
+```tsx
 // Bar.tsx
 export function Bar(props: IBarProps): JSX.Element {
   return (
@@ -120,7 +120,7 @@ Ce que l'on veut faire est donc de renverser cette opération, autrement dit cha
 
 Allons donc dans le composant `MainMenu.tsx` et analysons le contenu du bouton `Start from scratch`.
 
-```ts
+```tsx
 // MainMenu.tsx
     ...
     default:
@@ -137,7 +137,7 @@ Allons donc dans le composant `MainMenu.tsx` et analysons le contenu du bouton `
 
 On trouve la fonction `onClick` suivante :
 
-```ts
+```tsx
 // MainMenu.tsx
 {
   setWindowState(WindowState.Loading);
@@ -155,7 +155,7 @@ Pour rappel `setWindowState` est un setteur d'état, et qu'elle est définie **d
 
 Regardons donc le composant parent de `MainMenu`: `App`.
 
-```ts
+```tsx
 // App.tsx
 ...
       <MainMenu
@@ -173,7 +173,7 @@ Regardons donc le composant parent de `MainMenu`: `App`.
 
 Cette fonction `newEditor` appelle donc une autre fonction `NewEditor`.
 
-```ts
+```tsx
 export function NewEditor(
   setEditorState: Dispatch<SetStateAction<IEditorState>>,
   setLoaded: Dispatch<SetStateAction<boolean>>
@@ -197,7 +197,7 @@ Cette fonction à l'air assez compliquée, mais on sait qu'elle utilise `setEdit
 
 Donc pour renverser l'état de `App` il faut appeler soit `setEditorState` ou soit `setLoaded`. En analysant un peu plus près `App.tsx`, on remarque l'évidante condition permettant d'afficher ou non le menu principal :
 
-```ts
+```tsx
 // App.tsx
   ...
   if (isLoaded) {
@@ -218,9 +218,9 @@ Donc pour renverser l'état de `App` il faut appeler soit `setEditorState` ou so
     </div>
 ```
 
-Ainsi, on sait qu'il faut juste appeler `setLoaded` le setteur d'état de `isLoaded`:
+Ainsi, on sait qu'il faut juste appeler `setLoaded` le setteur d'état de `isLoaded`: 
 
-```ts
+```tsx
 // App.tsx
 const [isLoaded, setLoaded] = useState<boolean>(false);
 ```
@@ -229,7 +229,7 @@ Cependant comment appeler cette fonction depuis `Home` ? Et bien nous allons uti
 
 Comme pour `MainMenu`, dans `Home.tsx` nous allons mettre la fonction `GoHome` dans les props :
 
-```ts
+```tsx
 import React from 'react';
 
 interface IHomeProps {
@@ -251,7 +251,7 @@ Note: vous pouvez utiliser `Home(props: IHomeProps)` et appeler `props.goHome` c
 
 Home est utilisé dans les composants Bar, UI, et Editor avant d'être appelé dans App. Il faut faire la même chose, ajouter la fonction dans les props et l'appeler dans le composant :
 
-```ts
+```tsx
 // Bar.tsx
 interface IBarProps {
   goHome: () => void
@@ -272,7 +272,7 @@ export function Bar(props: IBarProps): JSX.Element {
 
 Enfin dans `App.tsx`, créez la fonction permettant de changer `isLoaded` vers `false`:
 
-```ts
+```tsx
   ...
   if (isLoaded) {
     return (