From 0748673baddcffe26da6ff749d3fc972cdb89046 Mon Sep 17 00:00:00 2001
From: "Tom (plebeius.eth)" <tom@plebbit.com>
Date: Tue, 4 Mar 2025 16:45:34 +0100
Subject: [PATCH] fix key warnings

---
 src/components/comment-content/comment-content.tsx     |  4 ++--
 src/components/post-desktop/post-desktop.tsx           |  2 +-
 .../settings-modal/avatar-settings/avatar-settings.tsx |  5 +++--
 src/components/subplebbit-stats/subplebbit-stats.tsx   | 10 +++++-----
 src/views/home/home.tsx                                |  8 +++++++-
 5 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/components/comment-content/comment-content.tsx b/src/components/comment-content/comment-content.tsx
index 776524ef..efa07d8c 100644
--- a/src/components/comment-content/comment-content.tsx
+++ b/src/components/comment-content/comment-content.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { Fragment, useState } from 'react';
 import { useLocation, useParams } from 'react-router-dom';
 import { Trans, useTranslation } from 'react-i18next';
 import { getFormattedDate, getFormattedTimeAgo } from '../../lib/utils/time-utils';
@@ -84,7 +84,7 @@ const CommentContent = ({ comment: post }: { comment: Comment }) => {
                 i18nKey={'comment_edited_at_timestamp'}
                 values={{ timestamp: getFormattedDate(edit?.timestamp) }}
                 shouldUnescape={true}
-                components={{ 1: <Tooltip content={getFormattedTimeAgo(edit?.timestamp)} children={<></>} /> }}
+                components={{ 1: <Tooltip content={getFormattedTimeAgo(edit?.timestamp)} children={<Fragment key={edit?.timestamp}></Fragment>} /> }}
               />{' '}
               {reason && <>{t('reason_reason', { reason: reason, interpolation: { escapeValue: false } })} </>}
               {showOriginal ? (
diff --git a/src/components/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx
index 4feee886..4b48173d 100644
--- a/src/components/post-desktop/post-desktop.tsx
+++ b/src/components/post-desktop/post-desktop.tsx
@@ -251,7 +251,7 @@ const PostMedia = ({ commentMediaInfo, hasThumbnail, isDescription, isRules, spo
   const [showThumbnail, setShowThumbnail] = useState(true);
 
   const mediaDimensions = getMediaDimensions(commentMediaInfo);
-  console.log('mediaDimensions', mediaDimensions);
+
   return (
     <div className={styles.file}>
       <div className={styles.fileText}>
diff --git a/src/components/settings-modal/avatar-settings/avatar-settings.tsx b/src/components/settings-modal/avatar-settings/avatar-settings.tsx
index 32cd4a0f..f59bc116 100644
--- a/src/components/settings-modal/avatar-settings/avatar-settings.tsx
+++ b/src/components/settings-modal/avatar-settings/avatar-settings.tsx
@@ -142,6 +142,7 @@ const AvatarSettings = () => {
               components={{
                 1: (
                   <Link
+                    key='token-address-link'
                     to='https://github.com/plebbit/plebbit-react-hooks/blob/557cc3f40b5933a00553ed9c0bc310d2cd7a3b52/src/hooks/authors/author-avatars.ts#L133'
                     target='_blank'
                     rel='noopener noreferrer'
@@ -177,9 +178,9 @@ const AvatarSettings = () => {
             i18nKey='copy_message_etherscan'
             values={{ copy: hasCopied ? t('copied') : t('copy') }}
             components={{
-              1: <button onClick={copyMessageToSign} />,
+              1: <button key='copy-message-button' onClick={copyMessageToSign} />,
               // eslint-disable-next-line
-              2: <a href='https://etherscan.io/verifiedSignatures' target='_blank' rel='noopener noreferrer' />,
+              2: <a key='etherscan-link' href='https://etherscan.io/verifiedSignatures' target='_blank' rel='noopener noreferrer' />,
             }}
           />
         </div>
diff --git a/src/components/subplebbit-stats/subplebbit-stats.tsx b/src/components/subplebbit-stats/subplebbit-stats.tsx
index 4895f167..16d9ed9c 100644
--- a/src/components/subplebbit-stats/subplebbit-stats.tsx
+++ b/src/components/subplebbit-stats/subplebbit-stats.tsx
@@ -52,13 +52,13 @@ const SubplebbitStats = () => {
                 <Trans
                   i18nKey='board_stats_hour'
                   values={{ userCount: stats.hourActiveUserCount ?? '?', postCount: stats.hourPostCount ?? '?' }}
-                  components={{ 1: <span className={styles.statValue} /> }}
+                  components={{ 1: <span key='hour-stat-value' className={styles.statValue} /> }}
                 />
                 {' / '}
                 <Trans
                   i18nKey='board_stats_day'
                   values={{ userCount: stats.dayActiveUserCount ?? '?', postCount: stats.dayPostCount ?? '?' }}
-                  components={{ 1: <span className={styles.statValue} /> }}
+                  components={{ 1: <span key='day-stat-value' className={styles.statValue} /> }}
                 />
               </td>
             </tr>
@@ -67,13 +67,13 @@ const SubplebbitStats = () => {
                 <Trans
                   i18nKey='board_stats_week'
                   values={{ userCount: stats.weekActiveUserCount ?? '?', postCount: stats.weekPostCount ?? '?' }}
-                  components={{ 1: <span className={styles.statValue} /> }}
+                  components={{ 1: <span key='week-stat-value' className={styles.statValue} /> }}
                 />
                 {' / '}
                 <Trans
                   i18nKey='board_stats_month'
                   values={{ userCount: stats.monthActiveUserCount ?? '?', postCount: stats.monthPostCount ?? '?' }}
-                  components={{ 1: <span className={styles.statValue} /> }}
+                  components={{ 1: <span key='month-stat-value' className={styles.statValue} /> }}
                 />
               </td>
             </tr>
@@ -84,7 +84,7 @@ const SubplebbitStats = () => {
                 <Trans
                   i18nKey='board_stats_all'
                   values={{ userCount: stats.allActiveUserCount ?? '?', postCount: stats.allPostCount ?? '?' }}
-                  components={{ 1: <span className={styles.statValue} /> }}
+                  components={{ 1: <span key='all-stat-value' className={styles.statValue} /> }}
                 />
               </td>
             </tr>
diff --git a/src/views/home/home.tsx b/src/views/home/home.tsx
index a4bcd9bc..aa23cc7c 100644
--- a/src/views/home/home.tsx
+++ b/src/views/home/home.tsx
@@ -52,7 +52,13 @@ const InfoBox = () => {
         <h2>{t('what_is_plebchan')}</h2>
       </div>
       <div className={styles.boxContent}>
-        <Trans i18nKey='plebchan_description' shouldUnescape={true} components={{ 1: <Link to='https://plebbit.com' target='_blank' rel='noopener noreferrer' /> }} />
+        <Trans
+          i18nKey='plebchan_description'
+          shouldUnescape={true}
+          components={{
+            1: <Link key='plebbit-link' to='https://plebbit.com' target='_blank' rel='noopener noreferrer' />,
+          }}
+        />
         <br />
         <br />
         {t('no_global_rules_info')}