From 8e0572d35b938853239c65db1a0851d755630977 Mon Sep 17 00:00:00 2001
From: Andreas Huber <andreas.huber@lucares.de>
Date: Sun, 29 Sep 2024 10:10:00 +0200
Subject: [PATCH] convert date picker to standalone component

---
 pdb-js/src/app/app.module.ts                  |  2 +-
 .../datepicker/date-picker.component.ts       | 25 +++++++++++++++++++
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/pdb-js/src/app/app.module.ts b/pdb-js/src/app/app.module.ts
index ac8e57d..026e139 100644
--- a/pdb-js/src/app/app.module.ts
+++ b/pdb-js/src/app/app.module.ts
@@ -64,7 +64,6 @@ import { MarkdownModule } from "ngx-markdown";
         MainPageComponent,
         HelpPageComponent,
         UploadPageComponent,
-        DatePickerComponent,
         VisualizationPageComponent,
         YAxisDefinitionComponent,
         QueryAutocompleteComponent,
@@ -91,6 +90,7 @@ import { MarkdownModule } from "ngx-markdown";
         AppRoutingModule,
         FormsModule,
         ReactiveFormsModule,
+        DatePickerComponent,
         DragDropModule,
         MatAutocompleteModule,
         MatBadgeModule,
diff --git a/pdb-js/src/app/components/datepicker/date-picker.component.ts b/pdb-js/src/app/components/datepicker/date-picker.component.ts
index 3544bd5..61276a4 100644
--- a/pdb-js/src/app/components/datepicker/date-picker.component.ts
+++ b/pdb-js/src/app/components/datepicker/date-picker.component.ts
@@ -1,3 +1,4 @@
+import { OverlayModule } from "@angular/cdk/overlay";
 import {
   Component,
   EventEmitter,
@@ -8,9 +9,18 @@ import {
 import {
   ControlValueAccessor,
   FormControl,
+  FormsModule,
   NG_VALUE_ACCESSOR,
+  ReactiveFormsModule,
   Validators,
 } from "@angular/forms";
+import { MatButtonModule } from "@angular/material/button";
+import { MAT_DIALOG_DEFAULT_OPTIONS } from "@angular/material/dialog";
+import { MatFormFieldModule } from "@angular/material/form-field";
+import { MatInputModule } from "@angular/material/input";
+import { MatTabsModule } from "@angular/material/tabs";
+import { BrowserModule } from "@angular/platform-browser";
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
 
 export type DateType = "QUICK" | "RELATIVE" | "ABSOLUTE";
 
@@ -29,12 +39,27 @@ export class DatePickerChange {
 @Component({
   selector: "app-date-picker",
   templateUrl: "./date-picker.component.html",
+  standalone: true,
+  imports: [
+    BrowserModule,
+    MatButtonModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatTabsModule,
+    FormsModule,
+    ReactiveFormsModule,
+    OverlayModule
+  ],
   providers: [
     {
       provide: NG_VALUE_ACCESSOR,
       useExisting: forwardRef(() => DatePickerComponent),
       multi: true,
     },
+    {
+      provide: MAT_DIALOG_DEFAULT_OPTIONS,
+      useValue: { hasBackdrop: true },
+  }
   ],
 })
 export class DatePickerComponent implements ControlValueAccessor {