1 files changed, 31 insertions, 0 deletions
diff --git a/gui/src/views/histogram/HistogramView.tsx b/gui/src/views/histogram/HistogramView.tsx
new file mode 100644
index 0000000..30e64ca
--- /dev/null
+++ b/gui/src/views/histogram/HistogramView.tsx
@@ -0,0 +1,31 @@
+import { Match, Resource, Switch } from 'solid-js';
+import Histogram from '../../components/histogram/Histogram'
+import { Category } from '../../types/category';
+
+export function HistogramView({ categories }: Props) {
+  return (
+    <Switch>
+      <Match when={categories.state === 'ready'}>
+        <Histogram categories={(categories as Extract<Resource<Category[]>, { state: 'ready' }>)()} />
+      </Match>
+      <Match when={categories.state === 'pending'}>
+        <p>Loading...</p>
+      </Match>
+      <Match when={categories.state === 'unresolved'}>
+        <p>Unresolved!</p>
+      </Match>
+      <Match when={categories.state === 'errored'}>
+        <p>Error!</p>
+        <p>{JSON.stringify(categories.error, null, 2)}</p>
+        <p>{JSON.stringify(categories(), null, 2)}</p>
+      </Match>
+      <Match when={categories.state === 'refreshing'}>
+        <p>Refreshing!</p>
+      </Match>
+    </Switch>
+  );
+}
+
+type Props = {
+  categories: Resource<Category[] | null>;
+}