inspector cleanup

app/src/Inspector.tsx

@@ -182,11 +182,7 @@ const VectorPreview = (props: {
       let [z, x, y] = tileIdToZxy(entry.tileId);
       let resp = await props.file.getZxy(z, x, y);
 
-      let tile = new VectorTile(
+      let tile = new VectorTile(new Protobuf(new Uint8Array(resp!.data)));
-        new Protobuf(
-          new Uint8Array(resp!.data)
-        )
-      );
       let newLayers = [];
       for (let [name, layer] of Object.entries(tile.layers)) {
         let features: Feature[] = [];
@@ -279,13 +275,30 @@ function Inspector(props: { file: PMTiles }) {
   useEffect(() => {
     let fn = async () => {
       let header = await props.file.getHeader();
-      let entries = await props.file.root_entries();
-      setEntryRows(entries);
       setHeader(header);
+      if (header.specVersion < 3) {
+        setEntryRows([]);
+      } else if (selectedEntry !== null && selectedEntry.runLength === 0) {
+        let entries = await props.file.cache.getDirectory(
+          props.file.source,
+          header.leafDirectoryOffset + selectedEntry.offset,
+          selectedEntry.length,
+          header
+        );
+        setEntryRows(entries);
+      } else if (selectedEntry === null) {
+        let entries = await props.file.cache.getDirectory(
+          props.file.source,
+          header.rootDirectoryOffset,
+          header.rootDirectoryLength,
+          header
+        );
+        setEntryRows(entries);
+      }
     };
 
     fn();
-  }, [props.file]);
+  }, [props.file, selectedEntry]);
 
   let rows = entryRows.map((e, i) => (
     <TileRow key={i} entry={e} setSelectedEntry={setSelectedEntry}></TileRow>
@@ -293,7 +306,9 @@ function Inspector(props: { file: PMTiles }) {
 
   let tilePreview = <div></div>;
   if (selectedEntry && header?.tileType) {
-    if (header.tileType === TileType.Mvt) {
+    if (selectedEntry.runLength === 0) {
+      console.log("Display leaf dir view");
+    } else if (header.tileType === TileType.Mvt) {
       tilePreview = (
         <VectorPreview
           file={props.file}
@@ -308,7 +323,7 @@ function Inspector(props: { file: PMTiles }) {
 
   let warning = "";
   if (header && header.specVersion < 3) {
-    warning = "Directory listing supported only for PMTiles v3 archives."
+    warning = "Directory listing supported only for PMTiles v3 archives.";
   }
 
   return (

app/src/Loader.tsx

@@ -163,7 +163,7 @@ function Loader(props: { file: PMTiles }) {
             <MagnifyingGlassIcon /> Tile Inspector
           </ToolbarToggleItem>
         </ToolbarToggleGroup>
-        <ToolbarLink href="#" target="_blank" css={{ marginRight: 10 }}>
+        <ToolbarLink css={{ marginRight: 10 }}>
           {props.file.source.getKey()}
         </ToolbarLink>
         <DialogPrimitive.Root open={modalOpen}>