Fixed the calendar

src/Ombi/ClientApp/angular.json

@@ -33,6 +33,7 @@
               "node_modules/primeicons/primeicons.css",
               "node_modules/please-wait/src/please-wait.scss",
               "node_modules/@fullcalendar/core/main.min.css",
+              "node_modules/@fullcalendar/daygrid/main.min.css",
               "node_modules/spinkit/scss/spinners/11-folding-cube.scss",
               "node_modules/spinkit/scss/spinkit.scss"
             ],

src/Ombi/ClientApp/package.json

@@ -25,6 +25,7 @@
     "@aspnet/signalr": "^1.1.0",
     "@auth0/angular-jwt": "^2.1.0",
     "@fullcalendar/core": "^4.2.0",
+    "@fullcalendar/daygrid": "^4.4.0",
     "@fullcalendar/interaction": "^4.2.0",
     "@ngu/carousel": "^1.4.9-beta-2",
     "@ngx-translate/core": "^11.0.1",

src/Ombi/ClientApp/src/app/calendar/components/calendar.component.html

@@ -1,3 +1,3 @@
-<div class="small-middle-container">
+<div class="small-middle-container" *ngIf="entries">
     <p-fullCalendar [events]="entries" [options]="options"></p-fullCalendar>
 </div>

src/Ombi/ClientApp/src/app/calendar/components/calendar.component.ts

@@ -3,6 +3,9 @@ import { Component, OnInit } from "@angular/core";
 import { CalendarService } from "../../services/calendar.service";
 import { ICalendarModel } from "../../interfaces/ICalendar";
 
+import dayGridPlugin from '@fullcalendar/daygrid';
+import interactionPlugin from '@fullcalendar/interaction';
+
 @Component({
     templateUrl: "./calendar.component.html",
     styleUrls: ["./calendar.component.scss"],
@@ -18,9 +21,8 @@ export class CalendarComponent implements OnInit {
 
     public async ngOnInit() {
         this.loading()
-        this.entries = await this.calendarService.getCalendarEntries();
-
         this.options = {
+            plugins: [dayGridPlugin, interactionPlugin],
             defaultDate: new Date(),
             header: {
                 left: 'prev,next',
@@ -31,6 +33,8 @@ export class CalendarComponent implements OnInit {
                 e.preventDefault();
             }
         };
+
+        this.entries = await this.calendarService.getCalendarEntries();
         this.finishLoading();
     }