prop typing

ui/src/components/Clock.vue

@@ -11,8 +11,8 @@ export default class Clock extends Vue {
   private formatted = "";
   private interval?: number;
 
-  @Prop()
-  public format!: string;
+  @Prop({ required: true })
+  private readonly format!: string;
 
   private update(): void {
     this.formatted = DateTime.now()

ui/src/components/THWLogo.vue

@@ -23,11 +23,11 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 
 @Component
 export default class THWLogo extends Vue {
-  @Prop()
-  public above!: string;
+  @Prop({ required: true })
+  private readonly above!: string;
 
-  @Prop()
-  public below!: string;
+  @Prop({ required: true })
+  private readonly below!: string;
 }
 </script>
 

ui/src/components/TickerBar.vue

@@ -15,8 +15,8 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 
 @Component
 export default class TickerBar extends Vue {
-  @Prop()
-  public content!: string;
+  @Prop({ required: true })
+  private readonly content!: string;
 
   get marqueeDuration(): string {
     // 10 seconds + another second per 7 chars

ui/src/components/TitleBar.vue

@@ -41,17 +41,17 @@ export default class TitleBar extends Vue {
   @Prop({
     default: "Technisches Hilfswerk",
   })
-  public logo_above!: string;
+  private readonly logo_above!: string;
 
   @Prop({
     default: "OV Musterstadt",
   })
-  public logo_below!: string;
+  private readonly logo_below!: string;
 
   @Prop({
     default: "TITLE",
   })
-  public title!: string;
+  private readonly title!: string;
 }
 </script>