From d6e373fbe40d834f26a7bda2c5134735e9327f0b Mon Sep 17 00:00:00 2001
From: QuentinHsu <xuquentinyang@gmail.com>
Date: Tue, 2 Apr 2024 10:58:21 +0800
Subject: [PATCH] fix(helpers): add key prop to Tag components

---
 web/src/helpers/render.js | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/web/src/helpers/render.js b/web/src/helpers/render.js
index a71215ea..f490a721 100644
--- a/web/src/helpers/render.js
+++ b/web/src/helpers/render.js
@@ -10,37 +10,45 @@ export function renderText(text, limit) {
 
 export function renderGroup(group) {
   if (group === '') {
-    return <Tag size='large'>default</Tag>;
+    return (
+      <Tag size='large' key={group}>
+        default
+      </Tag>
+    );
   }
   let groups = group.split(',');
   groups.sort();
   return (
-    <>
+    <span key={group}>
       {groups.map((group) => {
         if (group === 'vip' || group === 'pro') {
           return (
-            <Tag size='large' color='yellow'>
+            <Tag size='large' color='yellow' key={group}>
               {group}
             </Tag>
           );
         } else if (group === 'svip' || group === 'premium') {
           return (
-            <Tag size='large' color='red'>
+            <Tag size='large' color='red' key={group}>
               {group}
             </Tag>
           );
         }
         if (group === 'default') {
-          return <Tag size='large'>{group}</Tag>;
+          return (
+            <Tag size='large' key={group}>
+              {group}
+            </Tag>
+          );
         } else {
           return (
-            <Tag size='large' color={stringToColor(group)}>
+            <Tag size='large' color={stringToColor(group)} key={group}>
               {group}
             </Tag>
           );
         }
       })}
-    </>
+    </span>
   );
 }