diff --git a/src/static/app.mjs b/src/static/app.mjs
index bfe4032..2372bf2 100644
--- a/src/static/app.mjs
+++ b/src/static/app.mjs
@@ -3,7 +3,7 @@
 import SystemQueryClient from './js/SystemQueryClient.mjs';
 import make_router from './js/routes_client.mjs';
 
-import TableView from './js/TableView.mjs';
+import TableView from './js/ui/TableView.mjs';
 
 window.addEventListener("load", async (_event) => {
 	const el_version = document.querySelector(".version");
diff --git a/src/static/js/TableView.mjs b/src/static/js/ui/TableView.mjs
similarity index 57%
rename from src/static/js/TableView.mjs
rename to src/static/js/ui/TableView.mjs
index 250ba97..1b8ad36 100644
--- a/src/static/js/TableView.mjs
+++ b/src/static/js/ui/TableView.mjs
@@ -1,10 +1,14 @@
 "use strict";
 
+import Emel from 'emel';
+import fa_emel from './forkawesome_emel.mjs';
+
 class TableView {
 	constructor(el) {
 		if(this.el === null || typeof this.el === "undefined") throw new Error(`Expected HTML element as the first argument, but got null or undefined.`);
 		this.el = el;
 		this.el_parts = new Map();
+		this.emel = new Emel().emel;
 	}
 	
 	clear() {
@@ -12,7 +16,22 @@ class TableView {
 		this.el_parts.clear();
 	}
 	
+	init(tabledef) {
+		this.clear();
+		const parts = this.emel(`h2>(${fa_emel(tabledef.icon)}+{?})^div[class=data-display]`, {
+			placeholders: [
+				tabledef.name
+			]
+		});
+		for(let def of tabledef.items) {
+			
+		}
+		
+		this.el.replaceChildren(parts);
+	}
+	
 	async switch_table(table_name) {
+		table_name = table_name.replace(/[^a-z0-9-_]/g, "");
 		this.clear();
 		for await (let tabledef of await globalThis.sysquery.table(table_name)) {
 			this.append_table(tabledef.peer, tabledef.table);