Skip to content

Commit

Permalink
refactor: migrate the confirmation-model component
Browse files Browse the repository at this point in the history
  • Loading branch information
s223749059 committed May 14, 2024
1 parent 5e81bc1 commit 6c4434a
Show file tree
Hide file tree
Showing 8 changed files with 69 additions and 42 deletions.
35 changes: 0 additions & 35 deletions src/app/common/modals/confirmation-modal/confirmation-modal.coffee

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@ <h3 class="modal-title">
<small>Please confirm that you want to perform this action.</small>
</h3>
</div>
<div class="modal-body">
<div class="modal-body" style="font-size: 1.5em;">
{{message}}
</div>
<div class="modal-footer clearfix">
<div class="btn-group">
<label class="btn btn-success" ng-click="confirmAction()">
<label class="btn btn-success" (click)="confirmAction()">
<i class="fa fa-check"></i> Confirm
</label>
<label class="btn btn-danger" ng-click="cancelAction()">
<label class="btn btn-danger" (click)="cancelAction()">
<i class="fa fa-times"></i> Cancel
</label>
</div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
.confirmation-modal .modal-body {
font-size: 1.5em;
}
font-size: 1.5em;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import { Component, OnInit, Input, Inject} from '@angular/core';
import { alertService } from 'src/app/ajs-upgraded-providers';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';

@Component({
selector: 'confirmation-modal',
templateUrl: './confirmation-modal.component.html',
styleUrls: ['./confirmation-modal.component.scss'],
})
export class ConfirmationModalComponent implements OnInit {
@Input() title: string;
@Input() message: string;
@Input() action: () => void;

constructor(
@Inject(alertService) private alertService: any,
public dialogRef: MatDialogRef<ConfirmationModalComponent>,
@Inject(MAT_DIALOG_DATA) public data: any,
) {}

ngOnInit(): void {
console.log('confirmation-model ngOnInit()');
}

public confirmAction() {
console.log('confirmAction');
if (typeof this.action === 'function') {
this.action();
} else {
this.alertService.add("danger", `${this.title} action failed`, 3000);
}
/** note - page reload after closing **/
this.dialogRef.close();
}

public cancelAction() {
console.log('cancelAction');
this.alertService.add("info", `${this.title} action cancelled`, 3000);
this.dialogRef.close();
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { Injectable } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
import { ConfirmationModalComponent } from './confirmation-modal.component';

@Injectable({
providedIn: 'root',
})
export class ConfirmationModalService {
constructor(public dialog: MatDialog) {}

public show(title: string, message: string, action?: any) {
let dialogRef: MatDialogRef<ConfirmationModalComponent, any>;
dialogRef = this.dialog.open(ConfirmationModalComponent, {position: {top: '2.5%'}});
dialogRef.updateSize("42.5%", "");
dialogRef.componentInstance.title = title;
dialogRef.componentInstance.message = message;
dialogRef.componentInstance.action = action;
}
}
1 change: 0 additions & 1 deletion src/app/common/modals/modals.coffee
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
angular.module("doubtfire.common.modals", [
'doubtfire.common.modals.csv-result-modal'
'doubtfire.common.modals.confirmation-modal'
'doubtfire.common.modals.comments-modal'
])
2 changes: 2 additions & 0 deletions src/app/doubtfire-angular.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,7 @@ import {ExtensionCommentComponent} from './tasks/task-comments-viewer/extension-
import {CampusListComponent} from './admin/institution-settings/campuses/campus-list/campus-list.component';
import {ExtensionModalComponent} from './common/modals/extension-modal/extension-modal.component';
import {CalendarModalComponent} from './common/modals/calendar-modal/calendar-modal.component';
import { ConfirmationModalComponent } from './common/modals/confirmation-modal/confirmation-modal.component';
import {MatRadioModule} from '@angular/material/radio';
import {MatButtonToggleModule} from '@angular/material/button-toggle';
import {MAT_DATE_LOCALE, MatOptionModule} from '@angular/material/core';
Expand Down Expand Up @@ -251,6 +252,7 @@ import {TasksViewerComponent} from './units/states/tasks/tasks-viewer/tasks-view
OverseerImageListComponent,
ExtensionModalComponent,
CalendarModalComponent,
ConfirmationModalComponent,
InstitutionSettingsComponent,
HomeComponent,
CommentBubbleActionComponent,
Expand Down
3 changes: 2 additions & 1 deletion src/app/doubtfire-angularjs.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,6 @@ import 'build/src/app/units/states/students-list/students-list.js';
import 'build/src/app/units/states/analytics/analytics.js';
import 'build/src/app/common/filters/filters.js';
import 'build/src/app/common/content-editable/content-editable.js';
import 'build/src/app/common/modals/confirmation-modal/confirmation-modal.js';
import 'build/src/app/common/modals/comments-modal/comments-modal.js';
import 'build/src/app/common/modals/csv-result-modal/csv-result-modal.js';
import 'build/src/app/common/modals/modals.js';
Expand Down Expand Up @@ -157,6 +156,7 @@ import {ExtensionCommentComponent} from './tasks/task-comments-viewer/extension-
import {TaskAssessmentCommentComponent} from './tasks/task-comments-viewer/task-assessment-comment/task-assessment-comment.component';
import {ExtensionModalService} from './common/modals/extension-modal/extension-modal.service';
import {CalendarModalService} from './common/modals/calendar-modal/calendar-modal.service';
import { ConfirmationModalService } from './common/modals/confirmation-modal/confirmation-modal.service';
import {CampusListComponent} from './admin/institution-settings/campuses/campus-list/campus-list.component';
import {ActivityTypeListComponent} from './admin/institution-settings/activity-type-list/activity-type-list.component';
import {InstitutionSettingsComponent} from './admin/institution-settings/institution-settings.component';
Expand Down Expand Up @@ -250,6 +250,7 @@ DoubtfireAngularJSModule.factory('DoubtfireConstants', downgradeInjectable(Doubt
DoubtfireAngularJSModule.factory('ExtensionModal', downgradeInjectable(ExtensionModalService));
DoubtfireAngularJSModule.factory('Marked', downgradeInjectable(MarkedPipe));
DoubtfireAngularJSModule.factory('CalendarModal', downgradeInjectable(CalendarModalService));
DoubtfireAngularJSModule.factory('ConfirmationModal', downgradeInjectable(ConfirmationModalService));
DoubtfireAngularJSModule.factory('TaskCommentService', downgradeInjectable(TaskCommentService));
DoubtfireAngularJSModule.factory('alertService', downgradeInjectable(AlertService));
DoubtfireAngularJSModule.factory('tutorialService', downgradeInjectable(TutorialService));
Expand Down

0 comments on commit 6c4434a

Please sign in to comment.