bump dependencies

frontend/.husky/post-commit

@@ -0,0 +1,2 @@
+# .husky/post-commit
+git update-index --again

frontend/.husky/pre-commit

@@ -0,0 +1,3 @@
+# .husky/pre-commit
+npx --no-install lint-staged
+lint-staged

frontend/app/common/fetcher.test.ts

@@ -108,14 +108,11 @@ describe('fetcher', () => {
 
       // Check if `activeJwtToken` saved and clean
       mockFetch({ headers, status: 401 });
-      await apiFetcher
-        .get(apiUri)
-        .then(() => {
+      await expect(
+        apiFetcher.get(apiUri).then(() => {
           throw Error('apiFether shoud throw error on 401 responce');
         })
-        .catch((e) => {
-          expect(e.message).toBe('Not authorized.');
-        });
+      ).rejects.toEqual(new Error('Not authorized.'));
 
       expect(window.fetch).toHaveBeenCalledWith(apiUrl, {
         method: 'get',

frontend/app/components/auth-panel/auth-panel.tsx

@@ -197,7 +197,7 @@ export class AuthPanel extends Component<Props, State> {
             onBlur={this.onSortBlur}
           >
             {sortArray.map((sort) => (
-              <option value={sort.value} selected={sort.selected}>
+              <option key={sort.value} value={sort.value} selected={sort.selected}>
                 {sort.label}
               </option>
             ))}

frontend/app/components/auth/components/oauth.tsx

@@ -45,7 +45,7 @@ export default function OAuthProviders({ providers }: Props) {
         const { name, icon } = getProviderData(p, theme);
 
         return (
-          <li className={clsx('oauth-item', styles.item)}>
+          <li key={name} className={clsx('oauth-item', styles.item)}>
             <a
               target="_blank"
               rel="noopener noreferrer"

frontend/app/components/comment-form/__subscribe-by-rss/comment-form__subscribe-by-rss.tsx

@@ -54,7 +54,7 @@ export const SubscribeByRSS: FunctionComponent<{ userId: string | null }> = ({ u
       theme={theme}
     >
       {items.map(([href, label]) => (
-        <DropdownItem>
+        <DropdownItem key={label}>
           <a href={href} className="comment-form__rss-dropdown__link" target="_blank" rel="noreferrer">
             {label}
           </a>

frontend/app/components/comment-form/text-expander.tsx

@@ -19,18 +19,17 @@ function SuggestionList({ items, theme }: { items: Array<Emoji>; theme: Theme })
 
   return (
     <ul className={clsx(styles.suggester, { [styles.suggesterDark]: isDarkTheme })}>
-      {items.map(({ key, emoji }: Emoji) => {
-        return (
-          <li
-            // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
-            role="option"
-            className={clsx(styles.suggesterItem, { [styles.suggesterItemDark]: isDarkTheme })}
-            data-value={key}
-          >
-            <span className={styles.emojiResult}>{emoji}</span> {key}
-          </li>
-        );
-      })}
+      {items.map(({ key, emoji }: Emoji) => (
+        <li
+          key={key}
+          // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+          role="option"
+          className={clsx(styles.suggesterItem, { [styles.suggesterItemDark]: isDarkTheme })}
+          data-value={key}
+        >
+          <span className={styles.emojiResult}>{emoji}</span> {key}
+        </li>
+      ))}
     </ul>
   );
 }

frontend/app/components/comment/comment.tsx

@@ -507,7 +507,9 @@ class Comment extends Component<CommentProps, State> {
                 <FormattedMessage id="comment.blocking-period" defaultMessage="Blocking period" />
               </option>
               {blockingDurations.map((block) => (
-                <option value={block.value}>{block.label}</option>
+                <option key={block.value} value={block.value}>
+                  {block.label}
+                </option>
               ))}
             </select>
           </span>
@@ -791,6 +793,7 @@ class Comment extends Component<CommentProps, State> {
                 (editable || isEditing) &&
                 props.view === 'main' && [
                   <Button
+                    key="edit-button"
                     kind="link"
                     {...getHandleClickProps(this.toggleEditing)}
                     mix={['comment__action', 'comment__action_type_edit']}
@@ -803,6 +806,7 @@ class Comment extends Component<CommentProps, State> {
                   </Button>,
                   !isAdmin && (
                     <Button
+                      key="delete-button"
                       kind="link"
                       {...getHandleClickProps(this.deleteComment)}
                       mix={['comment__action', 'comment__action_type_delete']}
@@ -812,6 +816,7 @@ class Comment extends Component<CommentProps, State> {
                   ),
                   state.editDeadline && (
                     <Countdown
+                      key="countdown"
                       className="comment__edit-timer"
                       time={state.editDeadline}
                       onTimePassed={() =>

frontend/app/components/settings/settings.tsx

@@ -118,7 +118,7 @@ export default class Settings extends Component<Props, State> {
                 const isUserUnhidden = unhiddenUsers.includes(user.id);
 
                 return (
-                  <li className="settings__list-item">
+                  <li key={user.id} className="settings__list-item">
                     <span
                       className={['settings__username', isUserUnhidden ? 'settings__invisible' : null].join(' ')}
                       title={user.id}
@@ -167,7 +167,7 @@ export default class Settings extends Component<Props, State> {
                   const isUserUnblocked = unblockedUsers.includes(user.id);
 
                   return (
-                    <li className="settings__list-item">
+                    <li key={user.id} className="settings__list-item">
                       <span
                         className={['settings__username', isUserUnblocked ? 'settings__invisible' : null].join(' ')}
                         title={user.id}

frontend/app/components/user-info/last-comments-list.tsx

@@ -17,6 +17,7 @@ const LastCommentsList = ({ comments, isLoading }: { comments: CommentType[]; is
     <>
       {comments.map((comment) => (
         <Comment
+          key={comment.id}
           CommentForm={null}
           intl={intl}
           data={comment}