Upgrade web app and pacakges to TypeScript 5.3.3 (#26354)

webapp/channels/package.json

@@ -98,7 +98,7 @@
     "timezones.json": "1.6.1",
     "tinycolor2": "1.4.2",
     "turndown": "7.1.1",
-    "typescript": "4.9.5",
+    "typescript": "5.3.3",
     "zen-observable": "0.9.0"
   },
   "devDependencies": {
@@ -184,6 +184,11 @@
     "webpack-pwa-manifest": "4.3.0",
     "yargs": "16.2.0"
   },
+  "overrides": {
+    "@mattermost/desktop-api": {
+      "typescript": "$typescript"
+    }
+  },
   "scripts": {
     "check": "eslint --ext .js,.jsx,.tsx,.ts ./src --quiet --cache && stylelint \"**/*.{css,scss}\" --cache",
     "fix": "eslint --ext .js,.jsx,.tsx,.ts ./src --quiet --fix --cache && stylelint \"**/*.{css,scss}\" --fix --cache",

webapp/channels/src/components/channel_header/channel_header.tsx

@@ -495,7 +495,7 @@ class ChannelHeader extends React.PureComponent<Props, State> {
                             placement='bottom'
                             rootClose={true}
                             target={this.headerDescriptionRef.current as React.ReactInstance}
-                            ref={this.headerOverlayRef}
+                            ref={this.headerOverlayRef as any}
                             onHide={() => this.setState({showChannelHeaderPopover: false})}
                         >
                             {popoverContent}

webapp/channels/src/components/suggestion/switch_channel_provider.test.tsx

@@ -151,6 +151,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'O',
             name: 'other_user',
             display_name: 'other_user',
+            update_at: 0,
             delete_at: 0,
         },
         {
@@ -158,6 +159,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'D',
             name: 'current_user_id__other_user',
             display_name: 'other_user',
+            update_at: 0,
             delete_at: 0,
         }];
         const searchText = 'other';
@@ -194,6 +196,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'O',
             name: 'other_user',
             display_name: 'other_user',
+            update_at: 0,
             delete_at: 0,
         }];
         const searchText = 'other';
@@ -226,6 +229,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'O',
             name: 'other_user',
             display_name: 'other_user',
+            update_at: 0,
             delete_at: 0,
         },
         {
@@ -233,6 +237,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'D',
             name: 'current_user_id__other_user',
             display_name: 'other_user',
+            update_at: 0,
             delete_at: 0,
         }];
         const searchText = 'something else';
@@ -833,6 +838,7 @@ describe('components/SwitchChannelProvider', () => {
             type: 'G',
             name: 'other_gm_channel',
             delete_at: 0,
+            update_at: 0,
             display_name: 'other_user1, current_user_id',
         }];
 

webapp/channels/src/components/suggestion/switch_channel_provider.tsx

@@ -74,10 +74,11 @@ const ThreadsChannel: FakeChannel = {
     name: 'threads',
     display_name: 'Threads',
     type: Constants.THREADS,
+    update_at: 0,
     delete_at: 0,
 };
 
-type FakeChannel = Pick<Channel, 'id' | 'name' | 'display_name' | 'delete_at'> & {
+type FakeChannel = Pick<Channel, 'id' | 'name' | 'display_name' | 'update_at' | 'delete_at'> & {
     type: string;
 }
 

webapp/channels/src/packages/mattermost-redux/src/utils/file_utils.ts

@@ -14,7 +14,7 @@ export function getFormattedFileSize(file: FileInfo): string {
         ['GB', 1024 * 1024 * 1024],
         ['MB', 1024 * 1024],
         ['KB', 1024],
-    ];
+    ] as const;
     const size = fileSizes.find((unitAndMinBytes) => {
         const minBytes = unitAndMinBytes[1];
         return bytes > minBytes;

webapp/channels/src/types/external/react-bootstrap.d.ts

@@ -11,6 +11,7 @@ import type {OverlayTriggerProps} from 'react-bootstrap';
 export interface AdditionalOverlayTriggerProps extends React.ComponentPropsWithRef<typeof OverlayTriggerProps> {
 
     className?: string;
+    overlay: any;
 }
 
 declare class OverlayTrigger extends React.Component<AdditionalOverlayTriggerProps> {}

webapp/package.json

@@ -19,7 +19,7 @@
     "clean": "npm run clean --workspaces --if-present"
   },
   "dependencies": {
-    "react-intl": "6.5.5"
+    "react-intl": "6.6.2"
   },
   "devDependencies": {
     "@babel/core": "7.21.8",
@@ -38,7 +38,7 @@
     "css-loader": "6.7.3",
     "eslint": "8.37.0",
     "eslint-import-resolver-webpack": "0.13.2",
-    "eslint-plugin-formatjs": "4.9.1",
+    "eslint-plugin-formatjs": "4.12.2",
     "mini-css-extract-plugin": "2.7.5",
     "sass": "1.62.1",
     "sass-loader": "13.2.2",

webapp/platform/client/package.json

@@ -20,9 +20,13 @@
   "dependencies": {
     "form-data": "^4.0.0"
   },
+  "devDependencies": {
+    "jest": "27.1.0",
+    "typescript": "^5.0.0"
+  },
   "peerDependencies": {
-    "@mattermost/types": "*",
+    "@mattermost/types": "9.3.0",
-    "typescript": "^4.3"
+    "typescript": "^4.3.0 || ^5.0.0"
   },
   "peerDependenciesMeta": {
     "typescript": {
@@ -35,8 +39,5 @@
     "test": "jest",
     "test-ci": "jest --ci --forceExit --detectOpenHandles --maxWorkers=100%",
     "clean": "rm -rf lib node_modules tsconfig.tsbuildinfo"
-  },
-  "devDependencies": {
-    "jest": "27.1.0"
   }
 }

webapp/platform/components/package.json

@@ -18,7 +18,7 @@
     "@rollup/plugin-babel": "^5.3.1",
     "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-node-resolve": "^13.1.3",
-    "@rollup/plugin-typescript": "^8.3.1",
+    "@rollup/plugin-typescript": "11.1.6",
     "@testing-library/jest-dom": "5.16.4",
     "@types/lodash": "^4.14.178",
     "@types/react": "^17.0.71",
@@ -31,8 +31,7 @@
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-scss": "^3.0.0",
-    "rollup-plugin-ts": "^2.0.5",
+    "typescript": "^5.0.0"
-    "typescript": "^4.3.4"
   },
   "peerDependencies": {
     "@babel/runtime-corejs3": "^7.17.8",
@@ -45,7 +44,7 @@
     "react": "^17.0.2",
     "react-bootstrap": "github:mattermost/react-bootstrap#d821e2b1db1059bd36112d7587fd1b0912b27626",
     "react-dom": "^17.0.2",
-    "react-intl": "^6.3.2",
+    "react-intl": "*",
     "shallow-equals": "^1.0.0",
     "styled-components": "^5.3.5",
     "tippy.js": "^6.3.7"

webapp/platform/types/package.json

@@ -25,8 +25,11 @@
     "url": "github:mattermost/mattermost-server",
     "directory": "webapp/platform/types"
   },
+  "devDependencies": {
+    "typescript": "^5.0.0"
+  },
   "peerDependencies": {
-    "typescript": "^4.3"
+    "typescript": "^4.3.0 || ^5.0.0"
   },
   "peerDependenciesMeta": {
     "typescript": {