53 lines
1.3 KiB
TypeScript
53 lines
1.3 KiB
TypeScript
import { useCallback, useEffect, useState } from 'react';
|
|
import type { Identifier } from '../types/identifiers';
|
|
|
|
interface DetailDocument {
|
|
id?: Identifier;
|
|
[key: string]: unknown;
|
|
}
|
|
|
|
interface UseDetailPanelOptions {
|
|
documentLookup: Map<Identifier, DetailDocument>;
|
|
}
|
|
|
|
export const useDetailPanel = ({
|
|
documentLookup,
|
|
}: UseDetailPanelOptions) => {
|
|
const [detailPanelDocId, setDetailPanelDocId] = useState<Identifier | null>(null);
|
|
const [detailPanelDocument, setDetailPanelDocument] = useState<DetailDocument | null>(null);
|
|
|
|
const detailPanelOpen = detailPanelDocId !== null;
|
|
|
|
useEffect(() => {
|
|
if (!detailPanelDocId) {
|
|
setDetailPanelDocument(null);
|
|
return;
|
|
}
|
|
const resolved = documentLookup.get(detailPanelDocId) ?? null;
|
|
if (resolved !== detailPanelDocument) {
|
|
setDetailPanelDocument(resolved);
|
|
}
|
|
}, [detailPanelDocId, documentLookup, detailPanelDocument]);
|
|
|
|
const openDetailPanel = useCallback(
|
|
(documentId: Identifier) => {
|
|
if (!documentId) {
|
|
return;
|
|
}
|
|
setDetailPanelDocId(documentId);
|
|
},
|
|
[],
|
|
);
|
|
|
|
const closeDetailPanel = useCallback(() => {
|
|
setDetailPanelDocId(null);
|
|
}, []);
|
|
|
|
return {
|
|
detailPanelOpen,
|
|
detailPanelDocument,
|
|
openDetailPanel,
|
|
closeDetailPanel,
|
|
};
|
|
};
|