backend/.idea/workspace.xml

@@ -4,7 +4,13 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="3a869f59-290a-4ab2-b036-a878ce801bc4" name="Changes" comment="Datastructure for Tasks" />
+    <list default="true" id="3a869f59-290a-4ab2-b036-a878ce801bc4" name="Changes" comment="Datastructure for Tasks">
+      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../frontend/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/package-lock.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../frontend/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/package.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../frontend/src/app/app.module.ts" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/app/app.module.ts" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../frontend/src/app/tasks/task-editor/task-editor.component.html" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/app/tasks/task-editor/task-editor.component.html" afterDir="false" />
+    </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
     <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
@@ -35,29 +41,30 @@
     <option name="hideEmptyMiddlePackages" value="true" />
     <option name="showLibraryContents" value="true" />
   </component>
-  <component name="PropertiesComponent"><![CDATA[{
+  <component name="PropertiesComponent">{
-  "keyToString": {
+  &quot;keyToString&quot;: {
-    "RequestMappingsPanelOrder0": "0",
+    &quot;RequestMappingsPanelOrder0&quot;: &quot;0&quot;,
-    "RequestMappingsPanelOrder1": "1",
+    &quot;RequestMappingsPanelOrder1&quot;: &quot;1&quot;,
-    "RequestMappingsPanelWidth0": "75",
+    &quot;RequestMappingsPanelWidth0&quot;: &quot;75&quot;,
-    "RequestMappingsPanelWidth1": "75",
+    &quot;RequestMappingsPanelWidth1&quot;: &quot;75&quot;,
-    "RunOnceActivity.OpenProjectViewOnStart": "true",
+    &quot;RunOnceActivity.OpenProjectViewOnStart&quot;: &quot;true&quot;,
-    "RunOnceActivity.ShowReadmeOnStart": "true",
+    &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
-    "WebServerToolWindowFactoryState": "false",
+    &quot;WebServerToolWindowFactoryState&quot;: &quot;false&quot;,
-    "git-widget-placeholder": "issue-10",
+    &quot;git-widget-placeholder&quot;: &quot;issue-11-angular-update&quot;,
-    "last_directory_selection": "D:/Programmierprojekte/TimeManager/backend/src/main/java/core/api/models/timemanager",
+    &quot;last_directory_selection&quot;: &quot;D:/Programmierprojekte/TimeManager/backend/src/main/java/core/api/models/timemanager&quot;,
-    "node.js.detected.package.eslint": "true",
+    &quot;last_opened_file_path&quot;: &quot;D:/Programmierprojekte/Dicewars/client&quot;,
-    "node.js.detected.package.tslint": "true",
+    &quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
-    "node.js.selected.package.eslint": "(autodetect)",
+    &quot;node.js.detected.package.tslint&quot;: &quot;true&quot;,
-    "node.js.selected.package.tslint": "(autodetect)",
+    &quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
-    "vue.rearranger.settings.migration": "true"
+    &quot;node.js.selected.package.tslint&quot;: &quot;(autodetect)&quot;,
+    &quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
   },
-  "keyToStringList": {
+  &quot;keyToStringList&quot;: {
-    "DatabaseDriversLRU": [
+    &quot;DatabaseDriversLRU&quot;: [
-      "mariadb"
+      &quot;mariadb&quot;
     ]
   }
-}]]></component>
+}</component>
   <component name="RunManager">
     <configuration name="DemoApplication" type="SpringBootApplicationConfigurationType" factoryName="Spring Boot" nameIsGenerated="true">
       <module name="demo" />
@@ -77,6 +84,8 @@
       <updated>1695647243767</updated>
       <workItem from="1695647249321" duration="397000" />
       <workItem from="1696183811713" duration="4994000" />
+      <workItem from="1696399523081" duration="666000" />
+      <workItem from="1696517800445" duration="1732000" />
     </task>
     <task id="LOCAL-00001" summary="Structure Taskgroups in Hierarchies">
       <option name="closed" value="true" />

frontend/package.json

@@ -10,16 +10,19 @@
   },
   "private": true,
   "dependencies": {
+    "@angular-material-components/datetime-picker": "^16.0.1",
+    "@angular-material-components/moment-adapter": "^16.0.1",
     "@angular/animations": "^16.2.7",
-    "@angular/cdk": "^15.2.9",
+    "@angular/cdk": "^16.2.6",
     "@angular/common": "^16.2.7",
     "@angular/compiler": "^16.2.7",
     "@angular/core": "^16.2.7",
     "@angular/forms": "^16.2.7",
-    "@angular/material": "^15.2.9",
+    "@angular/material": "^16.2.6",
     "@angular/platform-browser": "^16.2.7",
     "@angular/platform-browser-dynamic": "^16.2.7",
     "@angular/router": "^16.2.7",
+    "moment": "^2.29.4",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.13.3"
@@ -38,4 +41,4 @@
     "karma-jasmine-html-reporter": "~1.7.0",
     "typescript": "~5.1.6"
   }
-}
+}

frontend/src/app/admin-dashboard/usermanagement/edit/edit.component.ts

@@ -1,7 +1,7 @@
 import {Component, Inject, OnInit} from '@angular/core';
-import {MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, MatLegacyDialogRef as MatDialogRef} from "@angular/material/legacy-dialog";
+import {MAT_DIALOG_DATA as MAT_DIALOG_DATA, MatDialogRef as MatDialogRef} from "@angular/material/dialog";
 import {UserInfo, UsersService} from "../../../../api";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 import {AbstractControl, UntypedFormControl, ValidationErrors, Validators} from "@angular/forms";
 import {EditData} from "./edit-data";
 

frontend/src/app/admin-dashboard/usermanagement/usermanagement.component.ts

@@ -1,11 +1,11 @@
 import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
 import {UserInfo, UsersService} from "../../../api";
-import {MatLegacyDialog as MatDialog} from "@angular/material/legacy-dialog";
+import {MatDialog as MatDialog} from "@angular/material/dialog";
 import {LoginComponent} from "../../auth/login/login.component";
 import {DeleteConfirmationComponent} from "./delete-confirmation/delete-confirmation.component";
 import {CollectionViewer, DataSource} from "@angular/cdk/collections";
 import {Observable} from "rxjs";
-import {MatLegacyTableDataSource as MatTableDataSource} from "@angular/material/legacy-table";
+import {MatTableDataSource as MatTableDataSource} from "@angular/material/table";
 import {EditComponent} from "./edit/edit.component";
 import {EditData} from "./edit/edit-data";
 

frontend/src/app/app.module.ts

@@ -9,25 +9,22 @@ import {HttpClient, HttpClientModule, HttpHandler} from "@angular/common/http";
 import {ApiModule, Configuration} from "../api";
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import {MatToolbarModule} from "@angular/material/toolbar";
-import {MatLegacyButtonModule as MatButtonModule} from "@angular/material/legacy-button";
 import {MatIconModule} from "@angular/material/icon";
-import {MatLegacyDialogModule as MatDialogModule} from "@angular/material/legacy-dialog";
+import {MatDialogModule as MatDialogModule} from "@angular/material/dialog";
-import {MatLegacyFormFieldModule as MatFormFieldModule} from "@angular/material/legacy-form-field";
+import {MatFormFieldModule as MatFormFieldModule} from "@angular/material/form-field";
-import {MatLegacyInputModule as MatInputModule} from "@angular/material/legacy-input";
+import {MatInputModule as MatInputModule} from "@angular/material/input";
-import {MatLegacyProgressSpinnerModule as MatProgressSpinnerModule} from "@angular/material/legacy-progress-spinner";
+import {MatProgressSpinnerModule as MatProgressSpinnerModule} from "@angular/material/progress-spinner";
-import {MatLegacySnackBar as MatSnackBar, MatLegacySnackBarModule as MatSnackBarModule} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar, MatSnackBarModule as MatSnackBarModule} from "@angular/material/snack-bar";
-import {MatLegacyMenuModule as MatMenuModule} from "@angular/material/legacy-menu";
 import { AdminDashboardComponent } from './admin-dashboard/admin-dashboard.component';
 import { MainComponent } from './main/main.component';
 import { UsermanagementComponent } from './admin-dashboard/usermanagement/usermanagement.component';
-import {MatLegacyTabsModule as MatTabsModule} from "@angular/material/legacy-tabs";
+
 import {AuthService} from "./auth.service";
 import {environment} from "../environments/environment";
-import {MatLegacyTableModule as MatTableModule} from "@angular/material/legacy-table";
+
-import {MatLegacyCheckboxModule as MatCheckboxModule} from "@angular/material/legacy-checkbox";
 import { DeleteConfirmationComponent } from './admin-dashboard/usermanagement/delete-confirmation/delete-confirmation.component';
 import { EditComponent } from './admin-dashboard/usermanagement/edit/edit.component';
-import {MatLegacyCardModule as MatCardModule} from "@angular/material/legacy-card";
+
 import {UserSettingsComponent} from "./user-settings/user-settings.component";
 import {AccountSettingsComponent} from "./user-settings/account-settings/account-settings.component";
 import { ChangePasswordComponent } from './user-settings/account-settings/change-password/change-password.component';
@@ -35,12 +32,24 @@ import { ManageEmailComponent } from './user-settings/account-settings/manage-em
 import { DeleteAccountComponent } from './user-settings/account-settings/delete-account/delete-account.component';
 import { RegistrationComponent } from './auth/registration/registration.component';
 import { SettingsComponent } from './admin-dashboard/settings/settings.component';
-import {MatLegacyListModule as MatListModule} from "@angular/material/legacy-list";
+
 import { TaskgroupDashboardComponent } from './taskgroups/taskgroup-dashboard/taskgroup-dashboard.component';
 import { TaskgroupCreationComponent } from './taskgroups/taskgroup-creation/taskgroup-creation.component';
 import { TaskgroupDeletionComponent } from './taskgroups/taskgroup-deletion/taskgroup-deletion.component';
 import { TaskEditorComponent } from './tasks/task-editor/task-editor.component';
 import {MatDatepickerModule} from "@angular/material/datepicker";
+import {
+  NgxMatMomentAdapter,
+  NgxMatMomentModule,
+  NgxMomentDateModule
+} from "@angular-material-components/moment-adapter";
+import {MatButtonModule} from "@angular/material/button";
+import {MatMenuModule} from "@angular/material/menu";
+import {MatTabsModule} from "@angular/material/tabs";
+import {MatTableModule} from "@angular/material/table";
+import {MatCheckboxModule} from "@angular/material/checkbox";
+import {MatCardModule} from "@angular/material/card";
+import {MatListModule} from "@angular/material/list";
 
 @NgModule({
   declarations: [
@@ -85,10 +94,14 @@ import {MatDatepickerModule} from "@angular/material/datepicker";
         MatCardModule,
         ReactiveFormsModule,
         MatListModule,
-        MatDatepickerModule
+        MatDatepickerModule,
+        MatInputModule,
+        MatDatepickerModule,
+        MatMomentDateModule,
     ],
   providers: [
     HttpClientModule,
+    {provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: {useUtc: true}},
     /*
      This is the configuration for the code generated by OpenApiGenerator.
      It specifies that the API code should use our `AuthService` to get the currently stored

frontend/src/app/auth/login/login.component.ts

@@ -1,8 +1,8 @@
 import {Component, Inject, OnInit} from '@angular/core';
 import {LoginService, PropertiesService} from "../../../api";
-import {MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, MatLegacyDialog as MatDialog, MatLegacyDialogRef as MatDialogRef} from "@angular/material/legacy-dialog";
+import {MAT_DIALOG_DATA as MAT_DIALOG_DATA, MatDialog as MatDialog, MatDialogRef as MatDialogRef} from "@angular/material/dialog";
 import {Router} from "@angular/router";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 import {AuthService} from "../../auth.service";
 import {RegistrationComponent} from "../registration/registration.component";
 

frontend/src/app/auth/registration/registration.component.ts

@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
-import {MatLegacyDialog as MatDialog, MatLegacyDialogRef as MatDialogRef} from "@angular/material/legacy-dialog";
+import {MatDialog as MatDialog, MatDialogRef as MatDialogRef} from "@angular/material/dialog";
 import {LoginService} from "../../../api";
 import {Router} from "@angular/router";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 import {AuthService} from "../../auth.service";
 import {LoginComponent} from "../login/login.component";
 import {LoginDialogServiceService} from "../../login-dialog-service.service";

frontend/src/app/login-dialog-service.service.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import {MatLegacyDialog as MatDialog} from "@angular/material/legacy-dialog";
+import {MatDialog as MatDialog} from "@angular/material/dialog";
 import {LoginComponent, LoginInfoTypes} from "./auth/login/login.component";
 import {Observable} from "rxjs";
 

frontend/src/app/taskgroups/taskgroup-creation/taskgroup-creation.component.ts

@@ -1,8 +1,8 @@
 import {Component, Inject, OnInit} from '@angular/core';
 import {UntypedFormControl, Validators} from "@angular/forms";
-import {MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, MatLegacyDialogRef as MatDialogRef} from "@angular/material/legacy-dialog";
+import {MAT_DIALOG_DATA as MAT_DIALOG_DATA, MatDialogRef as MatDialogRef} from "@angular/material/dialog";
 import {TaskgroupService} from "../../../api";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 import {TaskgroupCreationData} from "./TaskgroupCreationData";
 
 

frontend/src/app/taskgroups/taskgroup-dashboard/taskgroup-dashboard.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import {MatLegacyDialog as MatDialog} from "@angular/material/legacy-dialog";
+import {MatDialog as MatDialog} from "@angular/material/dialog";
 import {TaskgroupCreationComponent} from "../taskgroup-creation/taskgroup-creation.component";
 import {TaskgroupEntityInfo, TaskgroupService} from "../../../api";
 import {TaskgroupDeletionComponent} from "../taskgroup-deletion/taskgroup-deletion.component";

frontend/src/app/taskgroups/taskgroup-deletion/taskgroup-deletion.component.ts

@@ -1,7 +1,7 @@
 import {Component, Inject, OnInit} from '@angular/core';
-import {MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, MatLegacyDialogRef as MatDialogRef} from "@angular/material/legacy-dialog";
+import {MAT_DIALOG_DATA as MAT_DIALOG_DATA, MatDialogRef as MatDialogRef} from "@angular/material/dialog";
 import {TaskgroupEntityInfo, TaskgroupService} from "../../../api";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 
 @Component({
   selector: 'app-taskgroup-deletion',

frontend/src/app/tasks/task-editor/task-editor.component.html

@@ -9,7 +9,6 @@
     <mat-label>ETA</mat-label>
     <input matInput type="number" [formControl]="etaCtrl" min="0">
   </mat-form-field>
- <!--
   <mat-form-field>
     <mat-label>Startdate</mat-label>
     <input matInput [matDatepicker]="startpicker">
@@ -23,5 +22,5 @@
     <mat-hint>MM/DD/YYYY</mat-hint>
     <mat-datepicker-toggle matIconSuffix [for]="deadlinepicker"></mat-datepicker-toggle>
     <mat-datepicker #deadlinepicker></mat-datepicker>
-  </mat-form-field>-->
+  </mat-form-field>
 </div>

frontend/src/app/user-settings/account-settings/change-password/change-password.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import {AbstractControl, UntypedFormControl, ValidationErrors, Validators} from "@angular/forms";
 import {AccountService} from "../../../../api";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 
 @Component({
   selector: 'app-change-password',

frontend/src/app/user-settings/account-settings/delete-account/delete-account.component.ts

@@ -3,7 +3,7 @@ import {UntypedFormControl, Validators} from "@angular/forms";
 import {AccountService} from "../../../../api";
 import {Router} from "@angular/router";
 import {AuthService} from "../../../auth.service";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 
 @Component({
   selector: 'app-delete-account',

frontend/src/app/user-settings/account-settings/manage-email/manage-email.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import {AccountService} from "../../../../api";
 import {UntypedFormControl, Validators} from "@angular/forms";
-import {MatLegacySnackBar as MatSnackBar} from "@angular/material/legacy-snack-bar";
+import {MatSnackBar as MatSnackBar} from "@angular/material/snack-bar";
 
 @Component({
   selector: 'app-manage-email',