(answer) branch test updated: fix: adjust the label nested structure of the problem list

[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/answer.git


The following commit(s) were added to refs/heads/test by this push:
     new d4cd87ac fix: adjust the label nested structure of the problem list
d4cd87ac is described below

commit d4cd87ac15492171579fb8b04ce342c78acb01fc
Author: shuai <lishuail...@sifou.com>
AuthorDate: Mon Feb 24 14:26:47 2025 +0800

    fix: adjust the label nested structure of the problem list
---
 ui/src/components/QuestionList/index.tsx | 30 +++++++++++++++++++++---------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/ui/src/components/QuestionList/index.tsx 
b/ui/src/components/QuestionList/index.tsx
index dfcd8cb9..5361e1fe 100644
--- a/ui/src/components/QuestionList/index.tsx
+++ b/ui/src/components/QuestionList/index.tsx
@@ -19,7 +19,7 @@
 
 import { FC, useEffect, useState } from 'react';
 import { ListGroup, Dropdown } from 'react-bootstrap';
-import { NavLink, useSearchParams } from 'react-router-dom';
+import { NavLink, useSearchParams, useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
 import { pathFactory } from '@/router/pathFactory';
@@ -64,6 +64,7 @@ const QuestionList: FC<Props> = ({
   isLoading = false,
 }) => {
   const { t } = useTranslation('translation', { keyPrefix: 'question' });
+  const navigate = useNavigate();
   const [urlSearchParams] = useSearchParams();
   const { isSkeletonShow } = useSkeletonControl(isLoading);
   const curOrder =
@@ -82,12 +83,15 @@ const QuestionList: FC<Props> = ({
 
   const [viewType, setViewType] = useState('card');
 
-  // 切换列表预览模式
   const handleViewMode = (key) => {
     Storage.set(LIST_VIEW_STORAGE_KEY, key);
     setViewType(key);
   };
 
+  const handleNavigate = (href) => {
+    navigate(href);
+  };
+
   useEffect(() => {
     const type = Storage.get(LIST_VIEW_STORAGE_KEY) || 'card';
     setViewType(type);
@@ -140,9 +144,12 @@ const QuestionList: FC<Props> = ({
                 <ListGroup.Item
                   key={li.id}
                   action
-                  as={NavLink}
-                  to={pathFactory.questionLanding(li.id, li.url_title)}
-                  className="py-3 px-2 border-start-0 border-end-0">
+                  onClick={() =>
+                    handleNavigate(
+                      pathFactory.questionLanding(li.id, li.url_title),
+                    )
+                  }
+                  className="py-3 px-2 border-start-0 border-end-0 
position-relative">
                   <div className="d-flex flex-wrap text-secondary small mb-12">
                     <BaseUserCard
                       data={li.operator}
@@ -163,12 +170,17 @@ const QuestionList: FC<Props> = ({
                     />
                   </div>
                   <h5 className="text-wrap text-break">
-                    {li.title}
-                    {li.status === 2 ? ` [${t('closed')}]` : ''}
+                    <NavLink
+                      className="link-dark d-block"
+                      to={pathFactory.questionLanding(li.id, li.url_title)}>
+                      {li.title}
+                      {li.status === 2 ? ` [${t('closed')}]` : ''}
+                    </NavLink>
                   </h5>
                   {viewType === 'card' && (
-                    <p
-                      className="mb-2 small text-body text-truncate-2"
+                    <NavLink
+                      to={pathFactory.questionLanding(li.id, li.url_title)}
+                      className="d-block mb-2 small text-body text-truncate-2"
                       dangerouslySetInnerHTML={{ __html: li.description }}
                     />
                   )}