fix:the edit report-name input should remain in focus (#3252)

fylein · Nov 5, 2024 · fe8622e · fe8622e
1 parent 3123621
commit fe8622e
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 4 deletions.
diff --git a/src/app/fyle/my-view-report/edit-report-name-popover/edit-report-name-popover.component.html b/src/app/fyle/my-view-report/edit-report-name-popover/edit-report-name-popover.component.html
@@ -27,6 +27,7 @@
   </div>
   <input
     matInput
+    #reportNameInput
     [(ngModel)]="reportName"
     [maxLength]="250"
     class="edit-report-name--input-container__input smartlook-show"

diff --git a/src/app/fyle/my-view-report/edit-report-name-popover/edit-report-name-popover.component.ts b/src/app/fyle/my-view-report/edit-report-name-popover/edit-report-name-popover.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
 import { PopoverController } from '@ionic/angular';
 
 @Component({
@@ -9,15 +9,21 @@ import { PopoverController } from '@ionic/angular';
 export class EditReportNamePopoverComponent implements OnInit {
   @Input() reportName: string;
 
+  @ViewChild('reportNameInput') reportNameInput: ElementRef<HTMLInputElement>;
+
   constructor(private popoverController: PopoverController) {}
 
-  ngOnInit(): void {}
+  ngOnInit(): void {
+    setTimeout(() => {
+      this.reportNameInput.nativeElement.focus();
+    }, 100);
+  }
 
-  closePopover() {
+  closePopover(): void {
     this.popoverController.dismiss();
   }
 
-  saveReportName() {
+  saveReportName(): void {
     this.popoverController.dismiss({ reportName: this.reportName });
   }
 }