chore: add ts configuration

Makefile

@@ -12,9 +12,10 @@ cat_docs_command = cat ./docs/_API-header.md ./docs/_API-body.md > ./docs/API.md
 
 build:
 	rm -rf ./dist
-	./node_modules/.bin/fedx-scripts babel src --out-dir dist --source-maps --ignore **/*.test.jsx,**/*.test.js,**/setupTest.js --copy-files
+	./node_modules/.bin/fedx-scripts babel src --out-dir dist --source-maps --extensions '.js,.jsx,.ts,.tsx' --ignore **/*.test.jsx,**/*.test.js,**/*.test.tsx,**/*.test.ts,**/setupTest.js --copy-files
 	@# --copy-files will bring in everything else that wasn't processed by babel. Remove what we don't want.
 	@find dist -name '*.test.js*' -delete
+	@find dist -name '*.test.ts*' -delete
 	rm ./dist/setupTest.js
 	cp ./package.json ./dist/package.json
 	cp ./LICENSE ./dist/LICENSE

babel.config.js

@@ -1,3 +1,5 @@
 const { createConfig } = require('@openedx/frontend-build');
 
-module.exports = createConfig('babel-preserve-modules');
+const config = createConfig('babel-preserve-modules');
+config.presets.push('@babel/preset-typescript');
+module.exports = config;

package.json

@@ -11,7 +11,7 @@
     "build": "make build",
     "docs": "jsdoc -c jsdoc.json",
     "docs-watch": "nodemon -w src -w docs/template -w README.md -e js,jsx --exec npm run docs",
-    "lint": "fedx-scripts eslint --ext .js --ext .jsx .",
+    "lint": "fedx-scripts eslint --ext .js --ext .jsx --ext .ts --ext .tsx .",
     "i18n_extract": "fedx-scripts formatjs extract",
     "snapshot": "fedx-scripts jest --updateSnapshot",
     "start": "fedx-scripts webpack-dev-server --progress",

src/analytics/SegmentAnalyticsService.js

@@ -174,6 +174,7 @@ class SegmentAnalyticsService {
    * @param {*} [traits]
    * @returns {Promise} Promise that will resolve once the document readyState is complete
    */
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   identifyAnonymousUser(traits) { // eslint-disable-line no-unused-vars
     if (!this.segmentInitialized) {
       return Promise.resolve();
@@ -182,7 +183,7 @@ class SegmentAnalyticsService {
     // but we still have a user id associated in segment, reset the local segment state
     // This has to be wrapped in the analytics.ready() callback because the analytics.user()
     // function isn't available until the analytics.js package has finished initializing.
-    return new Promise((resolve, reject) => { // eslint-disable-line no-unused-vars
+    return new Promise((resolve, reject) => { // eslint-disable-line no-unused-vars, @typescript-eslint/no-unused-vars
       global.analytics.ready(() => {
         if (global.analytics.user().id()) {
           global.analytics.reset();

src/auth/AxiosJwtTokenService.js

@@ -124,7 +124,7 @@ export default class AxiosJwtTokenService {
     }
 
     try {
-      return await this.refresh();
+      return await this.refresh(); // eslint-disable-line @typescript-eslint/return-await
     } catch (e) {
       // TODO: Fix these.  They're still using loggingService as a singleton.
       logFrontendAuthError(this.loggingService, e);

src/react/PageWrap.jsx

@@ -1,5 +1,5 @@
 /* eslint-disable react/prop-types */
-// eslint-disable-next-line no-unused-vars
+// eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
 import React, { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
 

tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "@edx/typescript-config",
+  "compilerOptions": {
+    "rootDir": ".",
+    "outDir": "dist"
+  },
+  "include": ["src/**/*", "example/**/*", "__mocks__/**/*", ".*.js", "*.js", "*.jsx"],
+  "exclude": ["dist", "node_modules"]
+}