From f44694ad44ac5ef361f6c10daadb68dc9871a0a6 Mon Sep 17 00:00:00 2001
From: Travis Ralston <travpc@gmail.com>
Date: Wed, 11 Mar 2020 18:19:03 -0600
Subject: [PATCH 1/2] Support TypeScript for React components

Same treatment as https://github.com/matrix-org/matrix-react-sdk/pull/4203
---
 package.json      | 4 ++--
 tsconfig.json     | 6 ++++--
 webpack.config.js | 2 +-
 yarn.lock         | 2 +-
 4 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index 473e9a5f08..5f6e5b62a3 100644
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
     "build:res": "node scripts/copy-res.js",
     "build:genfiles": "yarn reskindex && yarn build:res",
     "build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
-    "build:compile": "babel -d lib --verbose --extensions \".ts,.js\" src",
+    "build:compile": "babel -d lib --verbose --extensions \".ts,.js,.tsx\" src",
     "build:bundle": "cross-env NODE_ENV=production webpack -p --progress --bail --mode production",
     "build:electron": "yarn build && yarn install:electron && electron-builder -wml --ia32 --x64",
     "build:electron:linux": "yarn build && electron-builder -l --x64",
@@ -94,7 +94,7 @@
     "@babel/preset-typescript": "^7.7.4",
     "@babel/register": "^7.7.4",
     "@babel/runtime": "^7.7.6",
-    "@types/react": "^16.9.17",
+    "@types/react": "16.9",
     "@types/react-dom": "^16.9.4",
     "autoprefixer": "^9.7.3",
     "babel-eslint": "^10.0.3",
diff --git a/tsconfig.json b/tsconfig.json
index ec1531e429..3e4db4baa1 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -10,10 +10,12 @@
     "outDir": "./lib",
     "declaration": true,
     "types": [
-      "node"
+      "node",
+      "react"
     ]
   },
   "include": [
-    "./src/**/*.ts"
+    "./src/**/*.ts",
+    "./src/**/*.tsx"
   ]
 }
diff --git a/webpack.config.js b/webpack.config.js
index 688b39cbf3..fbee94766d 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -82,7 +82,7 @@ module.exports = (env, argv) => {
             aliasFields: ['matrix_src_browser', 'browser'],
 
             // We need to specify that TS can be resolved without an extension
-            extensions: ['.js', '.json', '.ts'],
+            extensions: ['.js', '.json', '.ts', '.tsx'],
             alias: {
                 // alias any requires to the react module to the one in our path,
                 // otherwise we tend to get the react source included twice when
diff --git a/yarn.lock b/yarn.lock
index 687980e4d3..8897ae5893 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1262,7 +1262,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@^16.9.17":
+"@types/react@*", "@types/react@16.9":
   version "16.9.23"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.23.tgz#1a66c6d468ba11a8943ad958a8cb3e737568271c"
   integrity sha512-SsGVT4E7L2wLN3tPYLiF20hmZTPGuzaayVunfgXzUn1x4uHVsKH6QDJQ/TdpHqwsTLd4CwrmQ2vOgxN7gE24gw==

From 798d4dabc0c2b0f575907f9edb5dc88d7bf5e908 Mon Sep 17 00:00:00 2001
From: Travis Ralston <travpc@gmail.com>
Date: Wed, 11 Mar 2020 18:24:33 -0600
Subject: [PATCH 2/2] Supply `--jsx react` to tsc

---
 package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 5f6e5b62a3..02a3a9d4e8 100644
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
     "build:electron:linux": "yarn build && electron-builder -l --x64",
     "build:electron:macos": "yarn build && electron-builder -m --x64",
     "build:electron:windows": "yarn build && electron-builder -w --ia32 --x64",
-    "build:types": "tsc --emitDeclarationOnly",
+    "build:types": "tsc --emitDeclarationOnly --jsx react",
     "install:electron": "electron-builder install-app-deps",
     "dist": "scripts/package.sh",
     "start": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n reskindex,reskindex-react,res,riot-js \"yarn reskindex:watch\" \"yarn reskindex:watch-react\" \"yarn start:res\" \"yarn start:js\"",
@@ -56,7 +56,7 @@
     "lint": "yarn lint:types && yarn lint:ts && yarn lint:js && yarn lint:style",
     "lint:js": "eslint src",
     "lint:ts": "echo 'We don't actually have a typescript linter at this layer because tslint is being removed from our stack. Presumably your TS is fine.'",
-    "lint:types": "tsc --noEmit",
+    "lint:types": "tsc --noEmit --jsx react",
     "lint:style": "stylelint 'res/css/**/*.scss'",
     "test": "jest"
   },