Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | import { useEffect, useRef } from 'react';
/**
* Console SPARQL YASGUI (MIT) branchée sur le proxy de lecture isolé du
* semantic-kb-service. L'import est dynamique : YASGUI n'est chargé que lorsque
* la console est affichée (pas dans le bundle principal).
*
* @param {{ endpoint: string, token?: string }} props
*/
export default function YasguiConsole({ endpoint, token }) {
const containerRef = useRef(null);
const yasguiRef = useRef(null);
useEffect(() => {
let cancelled = false;
(async () => {
try {
const mod = await import('@triply/yasgui');
const Yasgui = mod.default || mod;
try {
await import('@triply/yasgui/build/yasgui.min.css');
} catch (e) {
// CSS optionnel : l'interface reste fonctionnelle sans.
}
if (cancelled || !containerRef.current) return;
yasguiRef.current = new Yasgui(containerRef.current, {
copyEndpointOnNewTab: false,
persistencyExpire: 0,
requestConfig: {
endpoint,
method: 'POST',
headers: token ? { Authorization: `Bearer ${token}` } : {},
},
});
} catch (error) {
console.error('[YasguiConsole] failed to load YASGUI:', error);
}
})();
return () => {
cancelled = true;
if (yasguiRef.current) {
try {
yasguiRef.current.destroy?.();
} catch (e) {
// ignore
}
yasguiRef.current = null;
}
};
}, [endpoint, token]);
return <div ref={containerRef} className="yasgui-container min-h-[300px]" />;
}
|