Merge pull request #1871 from visuddhinanda/agile

修正notification获取用户信息失败的bug

dashboard/src/components/notification/NotificationIcon.tsx

@@ -6,12 +6,13 @@ import { INotificationListResponse } from "../api/notification";
 import NotificationList from "./NotificationList";
 import { useAppSelector } from "../../hooks";
 import { currentUser } from "../../reducers/current-user";
+import { IUser } from "../auth/User";
 
 const NotificationIconWidget = () => {
   const [count, setCount] = useState<number>();
-  const user = useAppSelector(currentUser);
+  const currUser = useAppSelector(currentUser);
 
-  const queryNotification = () => {
+  const queryNotification = (user?: IUser) => {
     if (!user) {
       console.debug("未登录 不查询 notification");
       return;
@@ -67,15 +68,15 @@ const NotificationIconWidget = () => {
     });
   };
   useEffect(() => {
-    let timer = setInterval(() => queryNotification(), 1000 * 60);
+    let timer = setInterval(queryNotification, 1000 * 60, currUser);
     return () => {
       clearInterval(timer);
     };
-  }, []);
+  }, [currUser]);
 
   return (
     <>
-      {user ? (
+      {currUser ? (
         <Popover
           placement="bottomLeft"
           arrowPointAtCenter

dashboard/src/components/template/Term.tsx

@@ -14,6 +14,7 @@ import { get } from "../../request";
 import { fullUrl } from "../../utils";
 import lodash from "lodash";
 import { order, push } from "../../reducers/term-order";
+import { click } from "../../reducers/term-click";
 
 const { Text, Title } = Typography;
 
@@ -231,7 +232,13 @@ export const TermCtl = ({
           }
           placement="bottom"
         >
-          <Typography.Link style={{ color: community ? "green" : undefined }}>
+          <Typography.Link
+            style={{ color: community ? "green" : undefined }}
+            onClick={() => {
+              console.debug("term send redux");
+              store.dispatch(click(termData));
+            }}
+          >
             {termData?.meaning
               ? termData?.meaning
               : termData?.word

dashboard/src/components/term/TermItem.tsx

@@ -10,18 +10,31 @@ import MdView from "../template/MdView";
 import UserName from "../auth/UserName";
 import TimeShow from "../general/TimeShow";
 import TermModal from "./TermModal";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import StudioName from "../auth/StudioName";
 import { Link, useNavigate } from "react-router-dom";
+import { useAppSelector } from "../../hooks";
+import { clickedTerm } from "../../reducers/term-click";
 
 const { Text } = Typography;
 
 interface IWidget {
   data?: ITermDataResponse;
+  onTermClick?: Function;
 }
-const TermItemWidget = ({ data }: IWidget) => {
+const TermItemWidget = ({ data, onTermClick }: IWidget) => {
   const [openTermModal, setOpenTermModal] = useState(false);
   const navigate = useNavigate();
+  const termClicked = useAppSelector(clickedTerm);
+
+  useEffect(() => {
+    console.debug("on redux", termClicked, data);
+    if (termClicked?.channelId === data?.channel?.id) {
+      if (typeof onTermClick !== "undefined") {
+        onTermClick(termClicked);
+      }
+    }
+  }, [data?.channel?.id, termClicked]);
 
   return (
     <>

dashboard/src/components/term/TermSearch.tsx

@@ -8,16 +8,34 @@ import {
   ITermResponse,
 } from "../api/Term";
 import TermItem from "./TermItem";
+import { ITerm } from "./TermEdit";
 const { Title } = Typography;
 
 interface IWidget {
   word?: string;
   wordId?: string;
   compact?: boolean;
+  onIdChange?: Function;
 }
-const TermSearchWidget = ({ word, wordId, compact = false }: IWidget) => {
+const TermSearchWidget = ({
+  word,
+  wordId,
+  compact = false,
+  onIdChange,
+}: IWidget) => {
   const [tableData, setTableData] = useState<ITermDataResponse[]>();
 
+  const loadById = (id: string) => {
+    const url = `/v2/terms/${id}`;
+    console.info("term url", url);
+    get<ITermResponse>(url)
+      .then((json) => {
+        setTableData([json.data]);
+      })
+      .catch((error) => {
+        console.error(error);
+      });
+  };
   useEffect(() => {
     if (typeof word === "undefined" && typeof wordId === "undefined") {
       return;
@@ -32,14 +50,7 @@ const TermSearchWidget = ({ word, wordId, compact = false }: IWidget) => {
           console.error(error);
         });
     } else if (wordId) {
-      const url = `/v2/terms/${wordId}`;
-      get<ITermResponse>(url)
-        .then((json) => {
-          setTableData([json.data]);
-        })
-        .catch((error) => {
-          console.error(error);
-        });
+      loadById(wordId);
     }
   }, [word, wordId]);
 
@@ -55,7 +66,19 @@ const TermSearchWidget = ({ word, wordId, compact = false }: IWidget) => {
             dataSource={tableData}
             renderItem={(item) => (
               <List.Item>
-                <TermItem data={item} />
+                <TermItem
+                  data={item}
+                  onTermClick={(value: ITerm) => {
+                    console.debug("on term click", value);
+                    if (typeof onIdChange === "undefined") {
+                      if (value.id) {
+                        loadById(value.id);
+                      }
+                    } else {
+                      onIdChange(value.id);
+                    }
+                  }}
+                />
               </List.Item>
             )}
           />

dashboard/src/reducers/term-click.ts

@@ -0,0 +1,27 @@
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+
+import type { RootState } from "../store";
+import { ITerm } from "../components/term/TermEdit";
+
+interface IState {
+  word?: ITerm;
+}
+
+const initialState: IState = {};
+
+export const slice = createSlice({
+  name: "term-change",
+  initialState,
+  reducers: {
+    click: (state, action: PayloadAction<ITerm>) => {
+      state.word = action.payload;
+    },
+  },
+});
+
+export const { click } = slice.actions;
+
+export const clickedTerm = (state: RootState): ITerm | undefined =>
+  state.termClick.word;
+
+export default slice.reducer;

dashboard/src/store.ts

@@ -27,6 +27,7 @@ import wbwReducer from "./reducers/wbw";
 import termOrderReducer from "./reducers/term-order";
 import focusReducer from "./reducers/focus";
 import prLoadReducer from "./reducers/pr-load";
+import termClickReducer from "./reducers/term-click";
 
 const store = configureStore({
   reducer: {
@@ -57,6 +58,7 @@ const store = configureStore({
     termOrder: termOrderReducer,
     focus: focusReducer,
     prLoad: prLoadReducer,
+    termClick: termClickReducer,
   },
 });