Implemented strict mode for the project (broken tests, hundreds of @ts-ignore and new errors are included) [skip ci]

packages/app/components/dev/apps/actions.ts

@@ -1,17 +1,15 @@
-import { Dispatch } from 'redux';
+import { Dispatch, Action as ReduxAction } from 'redux';
 import { OauthAppResponse } from 'app/services/api/oauth';
 import oauth from 'app/services/api/oauth';
 import { User } from 'app/components/user';
+import { ThunkAction } from 'app/reducers';
 
 import { Apps } from './reducer';
 
-type SetAvailableAction = {
+interface SetAvailableAction extends ReduxAction {
   type: 'apps:setAvailable';
   payload: Array<OauthAppResponse>;
-};
-type DeleteAppAction = { type: 'apps:deleteApp'; payload: string };
-type AddAppAction = { type: 'apps:addApp'; payload: OauthAppResponse };
-export type Action = SetAvailableAction | DeleteAppAction | AddAppAction;
+}
 
 export function setAppsList(apps: Array<OauthAppResponse>): SetAvailableAction {
   return {
@@ -27,14 +25,19 @@ export function getApp(
   return state.apps.available.find(app => app.clientId === clientId) || null;
 }
 
-export function fetchApp(clientId: string) {
-  return async (dispatch: Dispatch<any>): Promise<void> => {
+export function fetchApp(clientId: string): ThunkAction<Promise<void>> {
+  return async dispatch => {
     const app = await oauth.getApp(clientId);
 
     dispatch(addApp(app));
   };
 }
 
+interface AddAppAction extends ReduxAction {
+  type: 'apps:addApp';
+  payload: OauthAppResponse;
+}
+
 function addApp(app: OauthAppResponse): AddAppAction {
   return {
     type: 'apps:addApp',
@@ -69,6 +72,11 @@ export function deleteApp(clientId: string) {
   };
 }
 
+interface DeleteAppAction extends ReduxAction {
+  type: 'apps:deleteApp';
+  payload: string;
+}
+
 function createDeleteAppAction(clientId: string): DeleteAppAction {
   return {
     type: 'apps:deleteApp',
@@ -76,8 +84,11 @@ function createDeleteAppAction(clientId: string): DeleteAppAction {
   };
 }
 
-export function resetApp(clientId: string, resetSecret: boolean) {
-  return async (dispatch: Dispatch<any>): Promise<void> => {
+export function resetApp(
+  clientId: string,
+  resetSecret: boolean,
+): ThunkAction<Promise<void>> {
+  return async dispatch => {
     const { data: app } = await oauth.reset(clientId, resetSecret);
 
     if (resetSecret) {
@@ -85,3 +96,5 @@ export function resetApp(clientId: string, resetSecret: boolean) {
     }
   };
 }
+
+export type Action = SetAvailableAction | DeleteAppAction | AddAppAction;

packages/app/components/dev/apps/applicationForm/ApplicationForm.tsx

@@ -19,12 +19,15 @@ import ApplicationTypeSwitcher from './ApplicationTypeSwitcher';
 import WebsiteType from './WebsiteType';
 import MinecraftServerType from './MinecraftServerType';
 
-const typeToForm: {
-  [K in ApplicationType]: {
+type TypeToForm = Record<
+  ApplicationType,
+  {
     label: MessageDescriptor;
     component: React.ComponentType<any>;
-  };
-} = {
+  }
+>;
+
+const typeToForm: TypeToForm = {
   [TYPE_APPLICATION]: {
     label: messages.website,
     component: WebsiteType,
@@ -35,16 +38,15 @@ const typeToForm: {
   },
 };
 
-const typeToLabel = Object.keys(typeToForm).reduce(
-  (result, key: ApplicationType) => {
-    result[key] = typeToForm[key].label;
+type TypeToLabel = Record<ApplicationType, MessageDescriptor>;
 
-    return result;
-  },
-  {} as {
-    [K in ApplicationType]: MessageDescriptor;
-  },
-);
+const typeToLabel: TypeToLabel = ((Object.keys(typeToForm) as unknown) as Array<
+  ApplicationType
+>).reduce((result, key) => {
+  result[key] = typeToForm[key].label;
+
+  return result;
+}, {} as TypeToLabel);
 
 export default class ApplicationForm extends React.Component<{
   app: OauthAppResponse;

packages/app/components/dev/apps/applicationForm/ApplicationTypeSwitcher.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { ApplicationType } from 'app/components/dev/apps';
 import { MessageDescriptor } from 'react-intl';
 import { SKIN_LIGHT } from 'app/components/ui';
@@ -6,20 +6,20 @@ import { Radio } from 'app/components/ui/form';
 
 import styles from './applicationTypeSwitcher.scss';
 
-export default function ApplicationTypeSwitcher({
-  setType,
-  appTypes,
-  selectedType,
-}: {
-  appTypes: {
-    [K in ApplicationType]: MessageDescriptor;
-  };
+interface Props {
+  appTypes: Record<ApplicationType, MessageDescriptor>;
   selectedType: ApplicationType | null;
   setType: (type: ApplicationType) => void;
-}) {
-  return (
-    <div>
-      {Object.keys(appTypes).map((type: ApplicationType) => (
+}
+
+const ApplicationTypeSwitcher: ComponentType<Props> = ({
+  appTypes,
+  selectedType,
+  setType,
+}) => (
+  <div>
+    {((Object.keys(appTypes) as unknown) as Array<ApplicationType>).map(
+      type => (
         <div className={styles.radioContainer} key={type}>
           <Radio
             onChange={() => setType(type)}
@@ -29,7 +29,9 @@ export default function ApplicationTypeSwitcher({
             checked={selectedType === type}
           />
         </div>
-      ))}
-    </div>
-  );
-}
+      ),
+    )}
+  </div>
+);
+
+export default ApplicationTypeSwitcher;

packages/app/components/dev/apps/applicationForm/MinecraftServerType.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { OauthAppResponse } from 'app/services/api/oauth';
 import { Input, FormModel } from 'app/components/ui/form';
@@ -7,52 +7,51 @@ import styles from 'app/components/profile/profileForm.scss';
 
 import messages from './ApplicationForm.intl.json';
 
-export default function MinecraftServerType({
-  form,
-  app,
-}: {
+interface Props {
   form: FormModel;
   app: OauthAppResponse;
-}) {
-  return (
-    <div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('name')}
-          label={messages.serverName}
-          defaultValue={app.name}
-          required
-          skin={SKIN_LIGHT}
-        />
-      </div>
-
-      <div className={styles.formRow}>
-        <p className={styles.description}>
-          <Message {...messages.ipAddressIsOptionButPreferable} />
-        </p>
-      </div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('minecraftServerIp')}
-          label={messages.serverIp}
-          defaultValue={app.minecraftServerIp}
-          skin={SKIN_LIGHT}
-        />
-      </div>
-
-      <div className={styles.formRow}>
-        <p className={styles.description}>
-          <Message {...messages.youCanAlsoSpecifyServerSite} />
-        </p>
-      </div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('websiteUrl')}
-          label={messages.websiteLink}
-          defaultValue={app.websiteUrl}
-          skin={SKIN_LIGHT}
-        />
-      </div>
-    </div>
-  );
 }
+
+const MinecraftServerType: ComponentType<Props> = ({ form, app }) => (
+  <div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('name')}
+        label={messages.serverName}
+        defaultValue={app.name}
+        required
+        skin={SKIN_LIGHT}
+      />
+    </div>
+
+    <div className={styles.formRow}>
+      <p className={styles.description}>
+        <Message {...messages.ipAddressIsOptionButPreferable} />
+      </p>
+    </div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('minecraftServerIp')}
+        label={messages.serverIp}
+        defaultValue={app.minecraftServerIp}
+        skin={SKIN_LIGHT}
+      />
+    </div>
+
+    <div className={styles.formRow}>
+      <p className={styles.description}>
+        <Message {...messages.youCanAlsoSpecifyServerSite} />
+      </p>
+    </div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('websiteUrl')}
+        label={messages.websiteLink}
+        defaultValue={app.websiteUrl}
+        skin={SKIN_LIGHT}
+      />
+    </div>
+  </div>
+);
+
+export default MinecraftServerType;

packages/app/components/dev/apps/applicationForm/WebsiteType.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { Input, TextArea, FormModel } from 'app/components/ui/form';
 import { OauthAppResponse } from 'app/services/api/oauth';
@@ -7,68 +7,67 @@ import styles from 'app/components/profile/profileForm.scss';
 
 import messages from './ApplicationForm.intl.json';
 
-export default function WebsiteType({
-  form,
-  app,
-}: {
+interface Props {
   form: FormModel;
   app: OauthAppResponse;
-}) {
-  return (
-    <div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('name')}
-          label={messages.applicationName}
-          defaultValue={app.name}
-          required
-          skin={SKIN_LIGHT}
-        />
-      </div>
-
-      <div className={styles.formRow}>
-        <p className={styles.description}>
-          <Message {...messages.appDescriptionWillBeAlsoVisibleOnOauthPage} />
-        </p>
-      </div>
-      <div className={styles.formRow}>
-        <TextArea
-          {...form.bindField('description')}
-          label={messages.description}
-          defaultValue={app.description}
-          skin={SKIN_LIGHT}
-          minRows={3}
-        />
-      </div>
-
-      <div className={styles.formRow}>
-        <p className={styles.description}>
-          <Message {...messages.websiteLinkWillBeUsedAsAdditionalId} />
-        </p>
-      </div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('websiteUrl')}
-          label={messages.websiteLink}
-          defaultValue={app.websiteUrl}
-          skin={SKIN_LIGHT}
-        />
-      </div>
-
-      <div className={styles.formRow}>
-        <p className={styles.description}>
-          <Message {...messages.redirectUriLimitsAllowableBaseAddress} />
-        </p>
-      </div>
-      <div className={styles.formRow}>
-        <Input
-          {...form.bindField('redirectUri')}
-          label={messages.redirectUri}
-          defaultValue={app.redirectUri}
-          required
-          skin={SKIN_LIGHT}
-        />
-      </div>
-    </div>
-  );
 }
+
+const WebsiteType: ComponentType<Props> = ({ form, app }) => (
+  <div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('name')}
+        label={messages.applicationName}
+        defaultValue={app.name}
+        required
+        skin={SKIN_LIGHT}
+      />
+    </div>
+
+    <div className={styles.formRow}>
+      <p className={styles.description}>
+        <Message {...messages.appDescriptionWillBeAlsoVisibleOnOauthPage} />
+      </p>
+    </div>
+    <div className={styles.formRow}>
+      <TextArea
+        {...form.bindField('description')}
+        label={messages.description}
+        defaultValue={app.description}
+        skin={SKIN_LIGHT}
+        minRows={3}
+      />
+    </div>
+
+    <div className={styles.formRow}>
+      <p className={styles.description}>
+        <Message {...messages.websiteLinkWillBeUsedAsAdditionalId} />
+      </p>
+    </div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('websiteUrl')}
+        label={messages.websiteLink}
+        defaultValue={app.websiteUrl}
+        skin={SKIN_LIGHT}
+      />
+    </div>
+
+    <div className={styles.formRow}>
+      <p className={styles.description}>
+        <Message {...messages.redirectUriLimitsAllowableBaseAddress} />
+      </p>
+    </div>
+    <div className={styles.formRow}>
+      <Input
+        {...form.bindField('redirectUri')}
+        label={messages.redirectUri}
+        defaultValue={app.redirectUri}
+        required
+        skin={SKIN_LIGHT}
+      />
+    </div>
+  </div>
+);
+
+export default WebsiteType;

packages/app/components/dev/apps/reducer.ts

@@ -3,7 +3,7 @@ import { OauthAppResponse } from 'app/services/api/oauth';
 import { Action } from './actions';
 
 export interface Apps {
-  available: OauthAppResponse[];
+  available: Array<OauthAppResponse>;
 }
 
 const defaults: Apps = {
@@ -42,8 +42,6 @@ export default function apps(state: Apps = defaults, action: Action): Apps {
           app => app.clientId !== action.payload,
         ),
       };
-
-    default:
   }
 
   return state;