diff --git a/src/app/organization/holidays/view-holidays/view-holidays.component.html b/src/app/organization/holidays/view-holidays/view-holidays.component.html
index 3a2c872ae..7b64a41af 100644
--- a/src/app/organization/holidays/view-holidays/view-holidays.component.html
+++ b/src/app/organization/holidays/view-holidays/view-holidays.component.html
@@ -1,15 +1,15 @@
 <div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
-  <span *mifosxHasPermission="'ACTIVATE_HOLIDAY'">
-    <button mat-raised-button color="accent" *ngIf="holidayData.status.value !== 'Active'">
+    <span *mifosxHasPermission="'ACTIVATE_HOLIDAY'">
+    <button mat-raised-button color="accent" (click)="activateHoliday()" *ngIf="holidayData.status.value !== 'Active'">
       <fa-icon icon="lock-open"></fa-icon>&nbsp;&nbsp;
       Activate
     </button>
   </span>
-  <button mat-raised-button color="primary" [routerLink]="['edit']" *mifosxHasPermission="'UPDATE_HOLIDAY'">
+    <button mat-raised-button color="primary" [routerLink]="['edit']" *mifosxHasPermission="'UPDATE_HOLIDAY'">
     <fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;
     Edit
   </button>
-  <button mat-raised-button color="warn" (click)="deleteHoliday()" *mifosxHasPermission="'DELETE_HOLIDAY'">
+    <button mat-raised-button color="warn" (click)="deleteHoliday()" *mifosxHasPermission="'DELETE_HOLIDAY'">
     <fa-icon icon="trash"></fa-icon>&nbsp;&nbsp;
     Delete
   </button>
@@ -17,52 +17,52 @@
 
 <div class="container">
 
-  <mat-card>
+    <mat-card>
 
-    <mat-card-content>
+        <mat-card-content>
 
-      <div fxLayout="row wrap" class="content">
+            <div fxLayout="row wrap" class="content">
 
-        <div fxFlex="50%" class="header">
-          Name
-        </div>
+                <div fxFlex="50%" class="header">
+                    Name
+                </div>
 
-        <div fxFlex="50%">
-          {{ holidayData.name }}
-        </div>
+                <div fxFlex="50%">
+                    {{ holidayData.name }}
+                </div>
 
-        <div fxFlex="50%" class="header">
-          From Date
-        </div>
+                <div fxFlex="50%" class="header">
+                    From Date
+                </div>
 
-        <div fxFlex="50%">
-          {{ holidayData.fromDate | date }}
-        </div>
+                <div fxFlex="50%">
+                    {{ holidayData.fromDate | date }}
+                </div>
 
-        <div fxFlex="50%" class="header">
-          To Date
-        </div>
+                <div fxFlex="50%" class="header">
+                    To Date
+                </div>
 
-        <div fxFlex="50%">
-          {{ holidayData.toDate | date }}
-        </div>
+                <div fxFlex="50%">
+                    {{ holidayData.toDate | date }}
+                </div>
 
-        <div fxFlex="50%" class="header">
-          Repayments Scheduled To
-        </div>
+                <div fxFlex="50%" class="header">
+                    Repayments Scheduled To
+                </div>
 
-        <div fxFlex="50%" *ngIf="holidayData.repaymentsRescheduledTo !== undefined && holidayData.repaymentsRescheduledTo !== null">
-          {{ holidayData.repaymentsRescheduledTo | date }}
-        </div>
+                <div fxFlex="50%" *ngIf="holidayData.repaymentsRescheduledTo !== undefined && holidayData.repaymentsRescheduledTo !== null">
+                    {{ holidayData.repaymentsRescheduledTo | date }}
+                </div>
 
-        <div fxFlex="50%" *ngIf="holidayData.repaymentsRescheduledTo === undefined || holidayData.repaymentsRescheduledTo === null">
-          Next Repayment Date
-        </div>
+                <div fxFlex="50%" *ngIf="holidayData.repaymentsRescheduledTo === undefined || holidayData.repaymentsRescheduledTo === null">
+                    Next Repayment Date
+                </div>
 
-      </div>
+            </div>
 
-    </mat-card-content>
+        </mat-card-content>
 
-  </mat-card>
+    </mat-card>
 
-</div>
+</div>
\ No newline at end of file
diff --git a/src/app/organization/holidays/view-holidays/view-holidays.component.ts b/src/app/organization/holidays/view-holidays/view-holidays.component.ts
index 34522bec7..deada1c43 100644
--- a/src/app/organization/holidays/view-holidays/view-holidays.component.ts
+++ b/src/app/organization/holidays/view-holidays/view-holidays.component.ts
@@ -7,6 +7,7 @@ import { MatDialog } from '@angular/material/dialog';
 import { OrganizationService } from 'app/organization/organization.service';
 
 /** Custom Components. */
+import { ConfirmationDialogComponent } from '../../../shared/confirmation-dialog/confirmation-dialog.component';
 import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dialog.component';
 
 /**
@@ -52,4 +53,21 @@ export class ViewHolidaysComponent {
     });
   }
 
+  /**
+   * Activate holiday.
+   */
+  activateHoliday() {
+    const unAssignStaffDialogRef = this.dialog.open(ConfirmationDialogComponent, {
+      data: { heading: 'Holiday', dialogContext: `Are you sure you want to activate ${this.holidayData.name} holiday` }
+    });
+    unAssignStaffDialogRef.afterClosed().subscribe((response: { confirm: any }) => {
+      if (response.confirm) {
+        this.organizationService.activateHoliday(this.holidayData.id)
+          .subscribe((response: any) => {
+            this.router.navigate(['/organization/holidays']);
+          });
+      }
+    });
+  }
+
 }
diff --git a/src/app/organization/organization.service.ts b/src/app/organization/organization.service.ts
index 3762ba537..fed484649 100644
--- a/src/app/organization/organization.service.ts
+++ b/src/app/organization/organization.service.ts
@@ -639,6 +639,17 @@ export class OrganizationService {
     return this.http.delete(`/holidays/${holidayId}`);
   }
 
+    /**
+   * Activate Holiday.
+   * @param holidayId Holiday Id to be deleted.
+   * @returns {Observable<any>} Resource Id.
+   */
+  activateHoliday(holidayId: string): Observable<any> {
+    const httpParams = new HttpParams()
+      .set('command','activate');
+    return this.http.post(`/holidays/${holidayId}`, null, { params: httpParams });
+  }
+
   /**
    * @param {any} employeeId Employee ID of Employee to be edited.
    * @returns {Observable<any>}