Files
MemoryBear/web/src/views/KnowledgeBase/components/RecallTestDrawer.tsx
2026-03-17 15:41:16 +08:00

60 lines
1.9 KiB
TypeScript

import { forwardRef, useImperativeHandle, useState, useRef, useLayoutEffect, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import RbDrawer from '@/components/RbDrawer';
import type { RecallTestDrawerRef } from '@/views/KnowledgeBase/types';
import RecallTest from './RecallTest';
const RecallTestDrawer = forwardRef<RecallTestDrawerRef>(({},ref) => {
const { t } = useTranslation();
const [open, setOpen] = useState(false);
const recallTestRef = useRef<any>(null);
const pendingKbIdRef = useRef<string | undefined>(undefined);
const shouldCallHandleOpenRef = useRef(false);
// Call RecallTest's handleOpen method
const callRecallTestHandleOpen = useCallback(() => {
if (recallTestRef.current && shouldCallHandleOpenRef.current) {
recallTestRef.current.handleOpen(pendingKbIdRef.current);
shouldCallHandleOpenRef.current = false;
}
}, []);
const handleOpen = (kbId?: string) => {
pendingKbIdRef.current = kbId;
shouldCallHandleOpenRef.current = true;
setOpen(true);
}
// When Drawer opens, try to call handleOpen
useLayoutEffect(() => {
if (open) {
callRecallTestHandleOpen();
}
}, [open, callRecallTestHandleOpen]);
// Use callback ref to ensure immediate call after component mount
const setRecallTestRef = useCallback((node: any) => {
recallTestRef.current = node;
if (open && shouldCallHandleOpenRef.current) {
callRecallTestHandleOpen();
}
}, [open, callRecallTestHandleOpen]);
// Expose methods to parent component
useImperativeHandle(ref, () => ({
handleOpen,
}));
return (
<RbDrawer
title={t('knowledgeBase.recallTest')}
open={open}
onClose={() => setOpen(false)}
width={1000}
>
<RecallTest ref={setRecallTestRef} />
</RbDrawer>
);
});
export default RecallTestDrawer;