(incubator-answer) branch test updated: fix: personal page empty state

[shuai]

This is an automated email from the ASF dual-hosted git repository.

shuai pushed a commit to branch test
in repository https://gitbox.apache.org/repos/asf/incubator-answer.git


The following commit(s) were added to refs/heads/test by this push:
     new a3a7a366 fix: personal page empty state
a3a7a366 is described below

commit a3a7a3666910433e7cb82eb915dc99ed88082e0e
Author: shuai <lishuail...@sifou.com>
AuthorDate: Fri Oct 18 15:47:52 2024 +0800

    fix: personal page empty state
---
 .../Users/Personal/components/Overview/index.tsx   | 59 +++++++++++-----------
 1 file changed, 30 insertions(+), 29 deletions(-)

diff --git a/ui/src/pages/Users/Personal/components/Overview/index.tsx 
b/ui/src/pages/Users/Personal/components/Overview/index.tsx
index 81ed7b32..049f07f0 100644
--- a/ui/src/pages/Users/Personal/components/Overview/index.tsx
+++ b/ui/src/pages/Users/Personal/components/Overview/index.tsx
@@ -49,46 +49,47 @@ const Index: FC<Props> = ({ visible, introduction, data, 
username }) => {
           dangerouslySetInnerHTML={{ __html: introduction }}
         />
       ) : (
-        <div className="text-center py-5 mb-5">{t('about_me_empty')}</div>
+        <div className="mb-5">{t('about_me_empty')}</div>
       )}
 
       <Row className="mb-4">
         <Col sm={12} md={6} className="mb-4">
-          {data?.answer?.length > 0 && (
-            <>
-              <h5 className="mb-3">{t('top_answers')}</h5>
-              <TopList data={data?.answer} type="answer" />
-            </>
+          <h5 className="mb-3">{t('top_answers')}</h5>
+          {data?.answer?.length > 0 ? (
+            <TopList data={data?.answer} type="answer" />
+          ) : (
+            <div className="mb-5">{t('content_empty')}</div>
           )}
         </Col>
         <Col sm={12} md={6}>
-          {data?.question?.length > 0 && (
-            <>
-              <h5 className="mb-3">{t('top_questions')}</h5>
-              <TopList data={data?.question} type="question" />
-            </>
+          <h5 className="mb-3">{t('top_questions')}</h5>
+          {data?.question?.length > 0 ? (
+            <TopList data={data?.question} type="question" />
+          ) : (
+            <div className="mb-5">{t('content_empty')}</div>
           )}
         </Col>
       </Row>
 
-      {Number(recentBadges?.count) > 0 && (
-        <div className="mb-4">
-          <h5 className="mb-3">{t('recent_badges')}</h5>
-          <Row>
-            {recentBadges?.list?.map((item) => {
-              return (
-                <Col sm={6} md={4} lg={3} key={item.id} className="mb-4">
-                  <CardBadge
-                    data={item}
-                    urlSearchParams={`username=${username}`}
-                    badgePillType="count"
-                  />
-                </Col>
-              );
-            })}
-          </Row>
-        </div>
-      )}
+      <div className="mb-4">
+        <h5 className="mb-3">{t('recent_badges')}</h5>
+        {Number(recentBadges?.count) > 0 ? (
+        <Row>
+          {recentBadges?.list?.map((item) => {
+            return (
+              <Col sm={6} md={4} lg={3} key={item.id} className="mb-4">
+                <CardBadge
+                  data={item}
+                  urlSearchParams={`username=${username}`}
+                  badgePillType="count"
+                />
+              </Col>
+            );
+          })}
+        </Row>) : (
+          <div className="mb-5">{t('content_empty')}</div>
+        )}
+      </div>
     </div>
   );
 };