outline navigator isn't working..

apps/doc/src/DocViewerStore.tsx

@@ -55,6 +55,7 @@ import ScaleDelta = PDFScales.ScaleDelta;
 import {useAnnotationMutationCallbacksFactory} from "../../../web/js/annotation_sidebar/AnnotationMutationCallbacks";
 import {UUIDs} from "../../../web/js/metadata/UUIDs";
 import { IOutline } from './outline/IOutline';
+import {OutlineNavigator} from "./outline/IOutlineItem";
 
 /**
  * Lightweight metadata describing the currently loaded document.
@@ -131,6 +132,8 @@ export interface IDocViewerStore {
 
     readonly outline?: IOutline;
 
+    readonly outlineNavigator?: OutlineNavigator;
+
 }
 
 export interface IPagemarkCoverage {
@@ -291,6 +294,8 @@ export interface IDocViewerCallbacks {
 
     readonly setOutline: (outline: IOutline | undefined) => void;
 
+    readonly setOutlineNavigator: (outlineNavigator: OutlineNavigator) => void;
+
     onPagemark(opts: IPagemarkMutation): ReadonlyArray<IPagemarkRef>;
     setPageNavigator(pageNavigator: PageNavigator): void;
 
@@ -962,6 +967,12 @@ function callbacksFactory(storeProvider: Provider<IDocViewerStore>,
             setStore({...store, outline});
         }
 
+        function setOutlineNavigator(outlineNavigator: OutlineNavigator) {
+            console.log("FIXME: setting outline nav: ", outlineNavigator)
+            const store = storeProvider();
+            setStore({...store, outlineNavigator});
+        }
+
         return {
             updateDocMeta,
             setDocMeta,
@@ -986,7 +997,8 @@ function callbacksFactory(storeProvider: Provider<IDocViewerStore>,
             onDocTagged,
             toggleDocFlagged,
             toggleDocArchived,
-            setOutline
+            setOutline,
+            setOutlineNavigator
         };
     }, [log, docMetaContext, persistenceLayerContext, annotationSidebarCallbacks,
         dialogs, annotationMutationCallbacksFactory, setStore, storeProvider]);

apps/doc/src/outline/IOutlineItem.ts

@@ -27,4 +27,4 @@ export interface IOutlineItem {
 
 }
 
-export type IOutlineLocationHandler = () => void;
+export type OutlineNavigator = (location: OutlineLocation) => void;

apps/doc/src/outline/Outliner.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { useDocViewerStore } from '../DocViewerStore';
+import { useDocViewerStore, useDocViewerCallbacks } from '../DocViewerStore';
 import { useOutlinerStore, useOutlinerCallbacks, OutlinerStoreProviderDelegate } from './OutlinerStore';
 import TreeView from '@material-ui/lab/TreeView';
-import { IOutlineItem } from './IOutlineItem';
+import {IOutlineItem, OutlineLocation} from './IOutlineItem';
 import TreeItem from '@material-ui/lab/TreeItem';
 
 const NoOutlineAvailable = React.memo(() => {
@@ -15,16 +15,33 @@ const NoOutlineAvailable = React.memo(() => {
 
 const OutlineTreeView = React.memo(() => {
 
-    const {outline} = useDocViewerStore(['outline']);
+    const {outline, outlineNavigator} = useDocViewerStore(['outline', 'outlineNavigator']);
     const {selected, expanded} = useOutlinerStore(['selected', 'expanded']);
     const {toggleExpanded, selectRow, collapseNode, expandNode} = useOutlinerCallbacks();
 
+    const handleNavigation = React.useCallback((location: OutlineLocation | undefined) => {
+
+        if (! outlineNavigator) {
+            console.warn("No outlineNavigator: ", outlineNavigator);
+            return;
+        }
+
+        if (! location) {
+            console.warn("No location");
+            return;
+        }
+
+        outlineNavigator(location);
+
+    }, [outlineNavigator]);
+
     const toTreeItem = React.useCallback((item: IOutlineItem) => {
 
         return (
             <TreeItem key={item.id}
                       nodeId={item.id}
                       label={item.title}
+                      onClick={() => handleNavigation(item.location)}
                       TransitionProps={{timeout: 75}}>
 
                 {item.children.map(toTreeItem)}

apps/doc/src/renderers/pdf/PDFDocument.tsx

@@ -45,10 +45,11 @@ import {useAnnotationBar} from "../../AnnotationBarHooks";
 import {DocumentInit} from "../DocumentInitHook";
 import {useDocViewerPageJumpListener} from '../../DocViewerAnnotationHook';
 import {deepMemo} from "../../../../../web/js/react/ReactUtils";
-import {IOutlineItem} from "../../outline/IOutlineItem";
+import {IOutlineItem, OutlineLocation} from "../../outline/IOutlineItem";
 import Outline = _pdfjs.Outline;
 import {IOutline} from "../../outline/IOutline";
 import {Numbers} from "polar-shared/src/util/Numbers";
+import Destination = _pdfjs.Destination;
 
 interface DocViewer {
     readonly eventBus: EventBus;
@@ -146,7 +147,7 @@ export const PDFDocument = deepMemo((props: IProps) => {
 
     const log = useLogger();
 
-    const {setDocDescriptor, setPageNavigator, setResizer, setScaleLeveler, setDocScale, setPage, setOutline}
+    const {setDocDescriptor, setPageNavigator, setResizer, setScaleLeveler, setDocScale, setPage, setOutline, setOutlineNavigator}
         = useDocViewerCallbacks();
 
     const {setFinder} = useDocFindCallbacks();
@@ -261,6 +262,8 @@ export const PDFDocument = deepMemo((props: IProps) => {
         const outline = await createOutline();
         setOutline(outline);
 
+        setOutlineNavigator((location: OutlineLocation) => docViewer.linkService.navigateTo((location as any) as Destination));
+
         function createPageNavigator(pdfDocumentProxy: _pdfjs.PDFDocumentProxy): PageNavigator {
 
             const count = pdfDocumentProxy.numPages;