diff --git a/ui/src/components/ConfigView.vue b/ui/src/components/ConfigView.vue
index 31fc56b..86d0b8b 100644
--- a/ui/src/components/ConfigView.vue
+++ b/ui/src/components/ConfigView.vue
@@ -137,39 +137,11 @@
 </template>
 
 <script lang="ts">
+import { ConfigModel, DayPartModel } from "@/lib/api";
 import { Options, Vue } from "vue-class-component";
 
 import BulmaDrawer from "./bulma/Drawer.vue";
 
-interface ConfigModel {
-  puzzle: {
-    solution: string;
-    begin: string;
-    end: string;
-    closing: string;
-    seed: string;
-  };
-  calendar: {
-    config_file: string;
-    background: string;
-  };
-  image: {
-    size: number;
-    border: number;
-    fonts: { file: string; size: number }[];
-  };
-  webdav: {
-    url: string;
-    cache_ttl: number;
-    config_file: string;
-  };
-}
-
-interface DayPartModel {
-  day: number;
-  part: string;
-}
-
 @Options({
   components: {
     BulmaDrawer,
diff --git a/ui/src/lib/api.ts b/ui/src/lib/api.ts
new file mode 100644
index 0000000..bc24dc8
--- /dev/null
+++ b/ui/src/lib/api.ts
@@ -0,0 +1,28 @@
+export interface ConfigModel {
+  puzzle: {
+    solution: string;
+    begin: string;
+    end: string;
+    closing: string;
+    seed: string;
+  };
+  calendar: {
+    config_file: string;
+    background: string;
+  };
+  image: {
+    size: number;
+    border: number;
+    fonts: { file: string; size: number }[];
+  };
+  webdav: {
+    url: string;
+    cache_ttl: number;
+    config_file: string;
+  };
+}
+
+export interface DayPartModel {
+  day: number;
+  part: string;
+}