diff --git a/spike/review/reinvent/ezmded/ui/index.html b/spike/review/reinvent/ezmded/ui/index.html
index 32fb9a6..3c90d8f 100644
--- a/spike/review/reinvent/ezmded/ui/index.html
+++ b/spike/review/reinvent/ezmded/ui/index.html
@@ -55,15 +55,12 @@
 				const title = document.getElementById("title").innerHTML ? document.getElementById("title").innerHTML : ""
 				const body = easyMDE.value() ? easyMDE.value() : ""
 				const id = easyMDE.meta.id ? easyMDE.meta.id : ""
-				const pid = easyMDE.meta.pid ? easyMDE.meta.pid : ""
 				var method = "PUT"
 				if (id == "")
 					method = "POST"
 				headers = {}
 				if (title)
 					headers["Title"] = title
-				if (pid)
-					headers["Pid"] = pid
 				http(method, "/api/v0/files" + (id == "" ? "" : "/"+id), (body, status) => {
 					console.log(status, body)
 					alert("todo")
@@ -76,40 +73,44 @@
 				}
 				http("GET", "/api/v0/files/"+id, (body, status, headers) => {
 					if (status != 200) {
-						throw Exception(`ERR loading file: ${status}: ${body}`)
+						raise `ERR loading file: ${status}: ${body}`
 					}
-					const pid = headers("pid") ? headers("pid") : ""
 					const title = headers("title") ? headers("title") : ""
-					setMDE(id, pid, title, body)
+					setMDE(id, title, body)
 				})
 			}
 			function drawNewFile(pid) {
-				setMDE("", pid, "", "")
+				setMDE(pid + "/" + crypto.randomUUID().substr(0, 5), "", "")
 			}
-			function setMDE(id, pid, title, body) {
-				alert("TODO: set title as attr for prettier here")
-				document.getElementById("titlePath").innerHTML = `${pid ? "... / " : ""}<a href="#?f=${pid}"><input type="button" value="${pid}" onclick="drawFile('${pid}');"></a> / `
-				if (pid == "") {
-					document.getElementById("titlePath").innerHTML = "/"
-				}
+			function setMDE(id, title, body) {
+				if (id[0] == "/")
+					id = id.slice(1, id.length)
+				if (id[id.length-1] == "/")
+					id = id.slice(0, id.length-1)
+				var pids = id.split("/")
+				pids = pids.slice(0, pids.length-1)
+
+				var titlePath = "/"
+				for (var pid in pids)
+					titlePath += ` <a href="#?f=${pids[pid]}"><input type="button" value="${pids[pid]}" onclick="drawFile('${pids[pid]}');"/></a> /`
+
+				document.getElementById("titlePath").innerHTML = titlePath
 				document.getElementById("title").innerHTML = title
 				easyMDE.value(body)
 				easyMDE.meta = {
 					id: id,
-					pid: pid,
 				}
 			}
 			function drawTree() {
-				function htmlifyBranch(pid, id, branch) {
-					/* TODO width limit title */
+				function htmlifyBranch(id, branch) {
 					var children = ""
-					for (var child in branch.Children)
-						children += "\n" + htmlifyBranch(id, child, branch.Children[child])
+					for (var child in branch.Branches)
+						children += "\n" + htmlifyBranch(id + "/" + child, branch.Branches[child])
 					return `
 						<details open>
 							<summary>
 								<div>
-									<a href="#?f=${id}"><input type="button" value="${branch.Title}" onclick="drawFile('${id}');"/></a>
+									<a href="#?f=${id}"><input type="button" value="${branch.Leaf.Title.substr(0, 15)}" onclick="drawFile('${id}');"/></a>
 									<input type="button" value="+" onclick="drawNewFile('${id}');"/>
 								</div>
 							</summary>
@@ -117,17 +118,11 @@
 						</details>
 					`
 				}
-				http("GET", "/api/v0/tree?pretty", (body, _) => {
+				http("GET", "/api/v0/tree", (body, status) => {
+					if (status != 200)
+						raise `bad status getting tree: ${status}: ${body}`
 					const tree = JSON.parse(body)
-					var innerHTML = ""
-					for(var id in tree) {
-						innerHTML += htmlifyBranch("", id, tree[id])
-					}
-					innerHTML = htmlifyBranch("", "", {
-						Title: "Files",
-						Children: {},
-					}).replace("</summary>", "</summary>"+innerHTML)
-					document.getElementById("tree").innerHTML = innerHTML
+					document.getElementById("tree").innerHTML = htmlifyBranch("", tree)
 				})
 			}
 			function http(method, remote, callback, body, headers) {