--- a/service/wifi/index.html	Thu Feb 13 10:17:36 2020 -0800
+++ b/service/wifi/index.html	Thu Feb 13 10:17:54 2020 -0800
@@ -24,7 +24,7 @@
           static="['demo.n3']"
           graph="{{graph}}"
         ></streamed-graph>
-        <wifi-display graph="see element code for this"></wifi-display>
+        <wifi-display></wifi-display>
       </template>
     </dom-bind>
     <form method="POST" action="remoteSuspend">

--- a/service/wifi/rollup.config.js	Thu Feb 13 10:17:36 2020 -0800
+++ b/service/wifi/rollup.config.js	Thu Feb 13 10:17:54 2020 -0800
@@ -40,5 +40,6 @@
     typescript(),
     commonjs(workaround_jsonld_expand_issue),
     replace({ ...replacements, delimiters: ["", ""] }),
+    
   ],
 };

--- a/service/wifi/src/graph_access.ts	Thu Feb 13 10:17:36 2020 -0800
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,83 +0,0 @@
-import { Literal, N3Store, Util, NamedNode, DataFactory } from "n3";
-const { literal, namedNode } = DataFactory;
-
-// workaround for uris that don't have good labels in the graph
-export function labelFromUri(
-  uri: NamedNode,
-  prefix: string,
-  tailsToLabels: { [key: string]: string },
-  defaultLabel: string
-) {
-  let label = defaultLabel === undefined ? uri.value : defaultLabel;
-  Object.entries(tailsToLabels).forEach(([tail, useLabel]) => {
-    if (uri.equals(namedNode(prefix + tail))) {
-      label = useLabel as string;
-    }
-  });
-  return label;
-}
-
-export function graphLiteral(
-  store: N3Store,
-  subj: NamedNode,
-  pred: string,
-  notFoundResult?: string
-): Literal {
-  const keep: Array<Literal> = [];
-  store.forEach(
-    q => {
-      if (!Util.isLiteral(q.object)) {
-        throw new Error("non literal found");
-      }
-      let seen = false;
-      for (let other of keep) {
-        // why are we getting multiple matches for the same literal? seems like a bug
-        if (other.equals(q.object)) {
-          seen = true;
-        }
-      }
-      if (!seen) {
-        keep.push(q.object as Literal);
-      }
-    },
-    subj,
-    namedNode(pred),
-    null,
-    null
-  );
-  if (keep.length == 0) {
-    return literal(notFoundResult || "(missing)");
-  }
-  if (keep.length == 1) {
-    return keep[0];
-  }
-  console.log(`${subj.value} ${pred} had ${keep.length} objects:`, keep);
-  return keep[0];
-}
-
-export function graphUriValue(
-  store: N3Store,
-  subj: NamedNode,
-  pred: string
-): NamedNode | undefined {
-  const keep: Array<NamedNode> = [];
-  store.forEach(
-    q => {
-      if (!Util.isNamedNode(q.object)) {
-        throw new Error("non uri found");
-      }
-      keep.push(q.object as NamedNode);
-    },
-    subj,
-    namedNode(pred),
-    null,
-    null
-  );
-  if (keep.length == 0) {
-    return undefined;
-  }
-  if (keep.length == 1) {
-    return keep[0];
-  }
-  throw new Error("found multiple matches for pred");
-}

--- a/service/wifi/src/index.ts	Thu Feb 13 10:17:36 2020 -0800
+++ b/service/wifi/src/index.ts	Thu Feb 13 10:17:54 2020 -0800
@@ -8,9 +8,8 @@
 import { NamedNode, DataFactory } from "n3";
 const { namedNode, literal } = DataFactory;
 
-import { VersionedGraph } from "streamed-graph";
+import { VersionedGraph, labelFromUri, graphLiteral, graphUriValue } from "streamed-graph";
 import { style } from "./style";
-import { labelFromUri, graphLiteral, graphUriValue } from "./graph_access";
 
 interface DevGroup {
   connectedToAp: NamedNode;
@@ -49,19 +48,21 @@
     super.connectedCallback();
     const sg = this.ownerDocument!.querySelector("streamed-graph");
     sg?.addEventListener("graph-changed", ((ev: CustomEvent) => {
-      this.graph = ev.detail!.value as VersionedGraph;
+      if (ev.detail!.value) {
+        // todo: sometimes i get ev.detail.graph instead of ev.detail.value
+        this.graph = ev.detail!.value as VersionedGraph;
+      }
     }) as EventListener);
   }
 
-  static get observers() {
-    return ["onGraphChanged(graph)"];
-  }
-
   @property({ type: Boolean })
   showGroups = false;
 
   render() {
-    const grouped = this.graphView(this.graph.store!);
+    if (!this.graph) {
+      return html`loading...`;
+    }
+    const grouped = this.graphView(this.graph.store);
 
     return html`
       <div class="report">
@@ -190,7 +191,7 @@
     } catch (e) {
       wifiBand = namedNode("multi"); // some have 5G and 2G?
     }
-    
+
     const connectedToAp = graphUriValue(store, devUri, room + "connectedToAp");
     if (!this.showGroups || connectedToAp) {
       const key = this.showGroups

--- a/service/wifi/tsconfig.json	Thu Feb 13 10:17:36 2020 -0800
+++ b/service/wifi/tsconfig.json	Thu Feb 13 10:17:54 2020 -0800
@@ -23,9 +23,9 @@
     // "allowSyntheticDefaultImports": true,
     // "rootDir": ".",
     // "outDir": "./build",
-    "baseUrl": "."
+    "baseUrl": ".",
     // "emitDecoratorMetadata": true,
-    // "lib": [ "dom" ],
+    "lib": [ "DOM","ES6","DOM.Iterable","ScriptHost", "ES2017.object" ],
 
     // "diagnostics": true,
     // "traceResolution": true