[Dev] Update dependencies (#1825)

package.json

@@ -37,45 +37,45 @@
   "author": "Alexander Zinchuk (alexander@zinchuk.com)",
   "license": "GPL-3.0-or-later",
   "devDependencies": {
-    "@babel/core": "^7.17.5",
+    "@babel/core": "^7.17.9",
     "@babel/plugin-proposal-class-properties": "^7.16.7",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7",
     "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3",
     "@babel/preset-env": "^7.16.11",
     "@babel/preset-react": "^7.16.7",
     "@babel/preset-typescript": "^7.16.7",
-    "@peculiar/webcrypto": "^1.3.2",
+    "@peculiar/webcrypto": "^1.3.3",
     "@statoscope/cli": "^5.20.1",
     "@statoscope/webpack-plugin": "^5.20.1",
-    "@testing-library/jest-dom": "^5.16.2",
+    "@testing-library/jest-dom": "^5.16.4",
     "@types/croppie": "^2.6.1",
     "@types/jest": "^27.4.1",
-    "@types/react": "^17.0.40",
-    "@types/react-dom": "^17.0.13",
+    "@types/react": "^18.0.5",
+    "@types/react-dom": "^18.0.0",
     "@types/wicg-mediasession": "^1.1.3",
-    "@typescript-eslint/eslint-plugin": "^5.14.0",
-    "@typescript-eslint/parser": "^5.14.0",
+    "@typescript-eslint/eslint-plugin": "^5.19.0",
+    "@typescript-eslint/parser": "^5.19.0",
     "@webpack-cli/serve": "^1.6.1",
-    "autoprefixer": "^10.4.2",
-    "babel-loader": "^8.2.3",
+    "autoprefixer": "^10.4.4",
+    "babel-loader": "^8.2.4",
     "browserlist": "^1.0.1",
     "buffer": "^6.0.3",
     "cross-env": "^7.0.3",
     "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^3.4.1",
     "dotenv": "^16.0.0",
-    "eslint": "^8.10.0",
+    "eslint": "^8.13.0",
     "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^16.1.1",
-    "eslint-config-react-app": "^7.0.0",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-config-react-app": "^7.0.1",
     "eslint-import-resolver-webpack": "^0.13.2",
     "eslint-plugin-flowtype": "^8.0.3",
-    "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-no-async-without-await": "^1.2.0",
     "eslint-plugin-no-null": "^1.0.2",
-    "eslint-plugin-react": "^7.29.3",
-    "eslint-plugin-react-hooks": "^4.3.0",
+    "eslint-plugin-react": "^7.29.4",
+    "eslint-plugin-react-hooks": "^4.4.0",
     "eslint-plugin-teactn": "git+https://github.com/korenskoy/eslint-plugin-teactn#c2c39dd005d58c07c24c4361de804dce1c6261b5",
     "git-revision-webpack-plugin": "^5.0.0",
     "gitlog": "^4.0.4",
@@ -84,25 +84,25 @@
     "jest": "^27.5.1",
     "jest-raw-loader": "^1.0.1",
     "jsdom": "^19.0.0",
-    "lint-staged": "^12.3.5",
+    "lint-staged": "^12.3.7",
     "mini-css-extract-plugin": "^2.6.0",
     "postcss-loader": "^6.2.1",
     "postcss-modules": "^4.3.1",
-    "react": "^17.0.2",
+    "react": "^18.0.0",
     "replace-in-file": "^6.3.2",
-    "sass": "^1.49.9",
+    "sass": "^1.50.0",
     "sass-loader": "^12.6.0",
     "style-loader": "^3.3.1",
-    "stylelint": "^14.5.3",
-    "stylelint-config-recommended-scss": "^5.0.2",
+    "stylelint": "^14.6.1",
+    "stylelint-config-recommended-scss": "^6.0.0",
     "stylelint-declaration-block-no-ignored-properties": "^2.5.0",
     "stylelint-group-selectors": "^1.0.8",
     "stylelint-high-performance-animation": "^1.6.0",
     "telegraph-node": "^1.0.4",
-    "typescript": "^4.6.2",
-    "webpack": "^5.70.0",
+    "typescript": "^4.6.3",
+    "webpack": "^5.72.0",
     "webpack-cli": "^4.9.2",
-    "webpack-dev-server": "^4.7.4",
+    "webpack-dev-server": "^4.8.1",
     "webpack-merge": "^5.8.0"
   },
   "dependencies": {
@@ -121,6 +121,6 @@
     "websocket": "^1.0.34"
   },
   "optionalDependencies": {
-    "fsevents": "2.1.2"
+    "fsevents": "2.3.2"
   }
 }

src/components/common/WebLink.tsx

@@ -1,6 +1,7 @@
 import React, { FC, memo, useCallback } from '../../lib/teact/teact';
 
 import { ApiMessage, ApiWebPage } from '../../api/types';
+import { TextPart } from '../../types';
 import { ObserveFn } from '../../hooks/useIntersectionObserver';
 
 import {
@@ -12,7 +13,7 @@ import trimText from '../../util/trimText';
 import renderText from './helpers/renderText';
 import { formatPastTimeShort } from '../../util/dateFormat';
 import useLang from '../../hooks/useLang';
-import { renderMessageSummary, TextPart } from './helpers/renderMessageText';
+import { renderMessageSummary } from './helpers/renderMessageText';
 
 import Media from './Media';
 import Link from '../ui/Link';

src/components/common/helpers/renderActionMessageText.tsx

@@ -3,6 +3,8 @@ import React from '../../../lib/teact/teact';
 import {
   ApiChat, ApiMessage, ApiUser, ApiGroupCall,
 } from '../../../api/types';
+import { TextPart } from '../../../types';
+
 import { LangFn } from '../../../hooks/useLang';
 import {
   getChatTitle,
@@ -11,7 +13,7 @@ import {
 } from '../../../global/helpers';
 import trimText from '../../../util/trimText';
 import { formatCurrency } from '../../../util/formatCurrency';
-import { TextPart, renderMessageSummary } from './renderMessageText';
+import { renderMessageSummary } from './renderMessageText';
 import renderText from './renderText';
 
 import UserLink from '../UserLink';

src/components/common/helpers/renderMessageText.ts

@@ -1,4 +1,6 @@
 import { ApiMessage, ApiMessageEntityTypes } from '../../../api/types';
+import { TextPart } from '../../../types';
+
 import {
   getMessageSummaryDescription,
   getMessageSummaryEmoji,
@@ -8,11 +10,9 @@ import {
 } from '../../../global/helpers';
 import { LangFn } from '../../../hooks/useLang';
 import renderText from './renderText';
-import { renderTextWithEntities, TextPart } from './renderTextWithEntities';
+import { renderTextWithEntities } from './renderTextWithEntities';
 import trimText from '../../../util/trimText';
 
-export type { TextPart };
-
 export function renderMessageText(
   message: ApiMessage,
   highlight?: string,

src/components/common/helpers/renderText.tsx

@@ -1,6 +1,8 @@
 import React from '../../../lib/teact/teact';
 import EMOJI_REGEX, { removeVS16s } from '../../../lib/twemojiRegex';
 
+import { TextPart } from '../../../types';
+
 import { RE_LINK_TEMPLATE, RE_MENTION_TEMPLATE } from '../../../config';
 import { IS_EMOJI_SUPPORTED } from '../../../util/environment';
 import {
@@ -12,7 +14,6 @@ import { compact } from '../../../util/iteratees';
 import MentionLink from '../../middle/message/MentionLink';
 import SafeLink from '../SafeLink';
 
-type TextPart = string | Element;
 export type TextFilter = (
   'escape_html' | 'hq_emoji' | 'emoji' | 'emoji_html' | 'br' | 'br_html' | 'highlight' | 'links' |
   'simple_markdown' | 'simple_markdown_html'
@@ -90,7 +91,7 @@ function replaceEmojis(textParts: TextPart[], size: 'big' | 'small', type: 'jsx'
     return textParts;
   }
 
-  return textParts.reduce((result, part) => {
+  return textParts.reduce((result: TextPart[], part: TextPart) => {
     if (typeof part !== 'string') {
       result.push(part);
       return result;
@@ -98,7 +99,7 @@ function replaceEmojis(textParts: TextPart[], size: 'big' | 'small', type: 'jsx'
 
     part = fixNonStandardEmoji(part);
     const parts = part.split(EMOJI_REGEX);
-    const emojis = part.match(EMOJI_REGEX) || [];
+    const emojis: string[] = part.match(EMOJI_REGEX) || [];
     result.push(parts[0]);
 
     return emojis.reduce((emojiResult: TextPart[], emoji, i) => {

src/components/common/helpers/renderTextWithEntities.tsx

@@ -2,7 +2,9 @@ import { MouseEvent } from 'react';
 import React from '../../../lib/teact/teact';
 import { getActions } from '../../../global';
 
+import { TextPart } from '../../../types';
 import { ApiFormattedText, ApiMessageEntity, ApiMessageEntityTypes } from '../../../api/types';
+
 import renderText, { TextFilter } from './renderText';
 import { copyTextToClipboard } from '../../../util/clipboard';
 import { getTranslation } from '../../../util/langProvider';
@@ -11,10 +13,6 @@ import MentionLink from '../../middle/message/MentionLink';
 import SafeLink from '../SafeLink';
 import Spoiler from '../spoiler/Spoiler';
 
-export type TextPart =
-  string
-  | Element;
-
 interface IOrganizedEntity {
   entity: ApiMessageEntity;
   organizedIndexes: Set<number>;

src/components/mediaViewer/MediaViewerFooter.tsx

@@ -1,9 +1,10 @@
 import React, { FC, useEffect, useState } from '../../lib/teact/teact';
 
+import { TextPart } from '../../types';
+
 import { IS_SINGLE_COLUMN_LAYOUT } from '../../util/environment';
 import { throttle } from '../../util/schedulers';
 import buildClassName from '../../util/buildClassName';
-import { TextPart } from '../common/helpers/renderMessageText';
 import { REM } from '../common/helpers/mediaDimensions';
 
 import './MediaViewerFooter.scss';

src/components/ui/ConfirmDialog.tsx

@@ -2,8 +2,9 @@ import React, {
   FC, memo, useCallback, useRef,
 } from '../../lib/teact/teact';
 
+import { TextPart } from '../../types';
+
 import useLang from '../../hooks/useLang';
-import { TextPart } from '../common/helpers/renderMessageText';
 import useKeyboardListNavigation from '../../hooks/useKeyboardListNavigation';
 
 import Modal from './Modal';

src/components/ui/Modal.tsx

@@ -3,7 +3,7 @@ import React, {
   FC, useEffect, useRef,
 } from '../../lib/teact/teact';
 
-import { TextPart } from '../common/helpers/renderMessageText';
+import { TextPart } from '../../types';
 
 import captureKeyboardListeners from '../../util/captureKeyboardListeners';
 import trapFocus from '../../util/trapFocus';

src/components/ui/Notification.tsx

@@ -6,11 +6,12 @@ import React, {
   useState,
 } from '../../lib/teact/teact';
 
+import { TextPart } from '../../types';
+
 import { ANIMATION_END_DELAY } from '../../config';
 import useShowTransition from '../../hooks/useShowTransition';
 import buildClassName from '../../util/buildClassName';
 import captureEscKeyListener from '../../util/captureEscKeyListener';
-import { TextPart } from '../common/helpers/renderMessageText';
 
 import Portal from './Portal';
 

src/components/ui/Portal.ts

@@ -6,7 +6,7 @@ import TeactDOM from '../../lib/teact/teact-dom';
 type OwnProps = {
   containerId?: string;
   className?: string;
-  children: React.ReactNode;
+  children: VirtualElement;
 };
 
 const Portal: FC<OwnProps> = ({ containerId, className, children }) => {
@@ -34,7 +34,7 @@ const Portal: FC<OwnProps> = ({ containerId, className, children }) => {
     };
   }, [className, containerId]);
 
-  return TeactDOM.render(children as VirtualElement, elementRef.current);
+  return TeactDOM.render(children, elementRef.current);
 };
 
 export default Portal;

src/global/helpers/messageSummary.ts

@@ -1,8 +1,9 @@
 import { ApiMessage, ApiMessageEntityTypes } from '../../api/types';
-import type { TextPart } from '../../components/common/helpers/renderTextWithEntities';
 import { CONTENT_NOT_SUPPORTED } from '../../config';
 
+import { TextPart } from '../../types';
 import { LangFn } from '../../hooks/useLang';
+
 import trimText from '../../util/trimText';
 import { getMessageText } from './messages';
 import { getMessageRecentReaction } from './reactions';

src/types/index.ts

@@ -5,6 +5,8 @@ import {
   ApiLanguage, ApiMessage, ApiShippingAddress, ApiStickerSet,
 } from '../api/types';
 
+export type TextPart = string | JSX.Element;
+
 export enum LoadMoreDirection {
   Backwards,
   Forwards,