[Chore] - Migrate to TypeScript

packages/translations/src/intlHelper/intlHelper.tsx

@@ -0,0 +1,7 @@
+import React from 'react';
+import IntlProvider from '../Provider';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const intlHelper = (message: any, settings: any) => <IntlProvider {...settings}>{message}</IntlProvider>;
+
+export default intlHelper;

packages/utils/package.json

@@ -36,15 +36,16 @@
  "react-router-dom": ">=4.2.2"
  },
  "dependencies": {
- "@sentry/browser": "^5.4.0",
  "@redhat-cloud-services/types": "^0.0.5",
+ "@sentry/browser": "^5.4.0",
  "awesome-debounce-promise": "^2.1.0",
  "axios": "^0.25.0",
  "commander": ">=2.20.0",
  "mkdirp": "^1.0.4",
  "react-content-loader": ">=3.4.1"
  },
  "devDependencies": {
+ "@types/mkdirp": "^1.0.2",
  "@types/react": "^16.9.34"
  },
  "sideEffects": false

packages/utils/src/mergeMessages/index.ts

@@ -0,0 +1 @@
+export * from './mergeMessages';

packages/utils/src/mergeMessages/mergeMessages.js → packages/utils/src/mergeMessages/mergeMessages.tsx

@@ -1,8 +1,8 @@
-const program = require('commander');
-const fs = require('fs');
-const { sync: globSync } = require('glob');
-const { sync: mkdirpSync } = require('mkdirp');
-const last = require('lodash/last');
+import program from 'commander';
+import fs from 'fs';
+import { sync as globSync } from 'glob';
+import { sync as mkdirpSync } from 'mkdirp';
+import last from 'lodash/last';
 
 let MESSAGES_PATTERN = 'build/messages/**/*.json';
 let LANG_DIR = 'locales/';
@@ -41,7 +41,8 @@ if (program.langPattern) {
 
 const mergedTranslations = globSync(`${rootFolder}${LANG_PATTERN}`)
  .map((filename) => {
- const locale = last(filename.split('/')).split('.json')[0];
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ const locale = last(filename.split('/'))!.split('.json')[0];
  if (!IGNORED.includes(locale)) {
  return { [locale]: JSON.parse(fs.readFileSync(filename, 'utf8')) };
  }
@@ -59,7 +60,7 @@ const defaultMessages = globSync(`${rootFolder}${MESSAGES_PATTERN}`)
  .map((filename) => fs.readFileSync(filename, 'utf8'))
  .map((file) => JSON.parse(file))
  .reduce((collection, descriptors) => {
- descriptors.forEach(({ id, defaultMessage }) => {
+ descriptors.forEach(({ id, defaultMessage }: { id: never; defaultMessage: never }) => {
  if (collection.hasOwnProperty(id)) {
  throw new Error(`Duplicate message id: ${id}`);
  }

packages/utils/src/useInventory/useInventory.js → packages/utils/src/useInventory/useInventory.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { useEffect, useState } from 'react';
 import * as reactRouterDom from 'react-router-dom';
 import {
@@ -13,17 +14,27 @@ import {
 } from '@patternfly/react-table';
 
 console.error('"useInventory" hook is deprecated and will be removed in v4. Please use Chrome 2.0 compatible Inventory version.');
-export const useInventory = ({ store, tableReducer, detailReducer, getRegistry }) => {
- let cleenupCallback;
+export const useInventory = ({
+ store,
+ tableReducer,
+ detailReducer,
+ getRegistry,
+}: {
+ store: any;
+ tableReducer: any;
+ detailReducer: any;
+ getRegistry: any;
+}) => {
+ let cleanupCallback: () => void;
  const [inventory, setInventory] = useState({
- newReducers: null,
- rawReducers: null,
+ newReducers: null as any,
+ rawReducers: null as any,
  });
 
  const [inventoryComponents, setInventoryComponents] = useState({
- InventoryTable: null,
- InventoryDetail: null,
- TagWithDialog: null,
+ InventoryTable: null as any,
+ InventoryDetail: null as any,
+ TagWithDialog: null as any,
  });
 
  useEffect(() => {
@@ -78,7 +89,7 @@ export const useInventory = ({ store, tableReducer, detailReducer, getRegistry }
  }));
 
  if (registry) {
- cleenupCallback = registry?.register?.(newReducers);
+ cleanupCallback = registry?.register?.(newReducers);
  }
 
  setInventoryComponents(() => ({
@@ -93,8 +104,8 @@ export const useInventory = ({ store, tableReducer, detailReducer, getRegistry }
  })();
 
  return () => {
- if (cleenupCallback && typeof cleenupCallback === 'function') {
- cleenupCallback();
+ if (cleanupCallback && typeof cleanupCallback === 'function') {
+ cleanupCallback();
  }
  };
  }, []);

tsconfig.json

@@ -67,6 +67,7 @@
  /* Advanced Options */
  "skipLibCheck": true, /* Skip type checking of declaration files. */
  "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
+ "resolveJsonModule": true, /* Allows to import json files in ts files. */
  },
  "exclude": [
  "packages/**/*.test.ts",