2
0
Просмотр исходного кода

♻️ refactor(classroom): 重构用户禁言状态查询逻辑

- 将checkMuteStatus函数从IMToggleMuteButton组件迁移至useClassroom hook
- 优化组件依赖项,使用新的checkMuteStatus方法替代直接依赖imGroupManager
- 改进useEffect钩子依赖数组,确保状态正确更新
yourname 6 месяцев назад
Родитель
Сommit
91aa6dba1d

+ 14 - 15
src/client/mobile/components/Classroom/IMToggleMuteButton.tsx

@@ -9,7 +9,7 @@ interface IMToggleMuteButtonProps {
 }
 
 export const IMToggleMuteButton: React.FC<IMToggleMuteButtonProps> = ({ userId, userName }) => {
-  const { role, muteStudentIM, unmuteStudentIM, classId, imGroupManager } = useClassroomContext();
+  const { role, muteStudentIM, unmuteStudentIM, classId, checkMuteStatus } = useClassroomContext();
   const [isMuted, setIsMuted] = useState(false);
   const [loading, setLoading] = useState(false);
 
@@ -18,22 +18,21 @@ export const IMToggleMuteButton: React.FC<IMToggleMuteButtonProps> = ({ userId,
     return null;
   }
 
-  // 查询用户禁言状态
-  const checkMuteStatus = async () => {
-    if (!imGroupManager || !classId) return;
-    
-    try {
-      const muteStatus = await imGroupManager.listMuteUsers({ groupId: classId });
-      setIsMuted(muteStatus.muteUserList.includes(userId));
-    } catch (error) {
-      console.error('查询禁言状态失败:', error);
-    }
-  };
-
   // 组件挂载时查询禁言状态
   useEffect(() => {
-    checkMuteStatus();
-  }, [userId, classId, imGroupManager]);
+    const fetchMuteStatus = async () => {
+      if (!classId) return;
+      
+      try {
+        const muted = await checkMuteStatus(userId);
+        setIsMuted(muted);
+      } catch (error) {
+        console.error('查询禁言状态失败:', error);
+      }
+    };
+    
+    fetchMuteStatus();
+  }, [userId, classId, checkMuteStatus]);
 
   const handleToggleMute = async () => {
     if (loading) return;

+ 15 - 2
src/client/mobile/components/Classroom/useClassroom.ts

@@ -1050,6 +1050,19 @@ export const useClassroom = ({ user }:{ user : User }) => {
     }
   };
 
+  // 查询用户禁言状态
+  const checkMuteStatus = async (userId: string): Promise<boolean> => {
+    if (!imGroupManager.current || !classId) return false;
+    
+    try {
+      const muteStatus = await imGroupManager.current.listMuteUsers({ groupId: classId });
+      return muteStatus.muteUserList.includes(userId);
+    } catch (error) {
+      console.error('查询禁言状态失败:', error);
+      return false;
+    }
+  };
+
   const answerHandUp = async (studentId: string): Promise<void> => {
     if (!imMessageManager.current || !classId || role !== Role.Teacher) return;
     
@@ -1134,7 +1147,6 @@ export const useClassroom = ({ user }:{ user : User }) => {
     remoteCameraContainer, // 导出摄像头容器ref
     showCameraOverlay,
     setShowCameraOverlay,
-    imGroupManager: imGroupManager.current,
 
     // 方法
     login,
@@ -1156,7 +1168,8 @@ export const useClassroom = ({ user }:{ user : User }) => {
     muteStudentIM,
     unmuteStudentIM,
     muteAllIM,
-    unmuteAllIM
+    unmuteAllIM,
+    checkMuteStatus
   };
 };