diff --git a/src/app/organization/offices/view-office/general-tab/general-tab.component.html b/src/app/organization/offices/view-office/general-tab/general-tab.component.html
index 000756a88..2ab1a4ccd 100644
--- a/src/app/organization/offices/view-office/general-tab/general-tab.component.html
+++ b/src/app/organization/offices/view-office/general-tab/general-tab.component.html
@@ -2,7 +2,7 @@
 <div class="tab-container mat-typography">
   <div fxLayoutAlign="flex-end" class="action-button m-b-20">
     <span *mifosxHasPermission="'UPDATE_OFFICE'">
-      <button mat-raised-button color="primary" [routerLink]="['edit']">
+      <button mat-raised-button color="primary" [routerLink]="['../edit']">
         <fa-icon icon="edit" class="m-r-10"></fa-icon>Edit
       </button>
     </span>
diff --git a/src/app/organization/organization-routing.module.ts b/src/app/organization/organization-routing.module.ts
index 41a7fa5f5..49b79fade 100644
--- a/src/app/organization/organization-routing.module.ts
+++ b/src/app/organization/organization-routing.module.ts
@@ -206,16 +206,16 @@ const routes: Routes = [
                       }
                     }
                   ]
-                },
-                {
-                  path: 'edit',
-                  component: EditOfficeComponent,
-                  data: { title: extract('Edit Office'), breadcrumb: 'Edit', routeParamBreadcrumb: false },
-                  resolve: {
-                    officeTemplate: EditOfficeResolver
-                  }
                 }
               ]
+            },
+            {
+              path: ':officeId/edit',
+              component: EditOfficeComponent,
+              data: { title: extract('Edit Office'), breadcrumb: 'Edit', routeParamBreadcrumb: false },
+              resolve: {
+                officeTemplate: EditOfficeResolver
+              }
             }
           ]
         },
diff --git a/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.html b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.html
new file mode 100644
index 000000000..d949b6ad3
--- /dev/null
+++ b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.html
@@ -0,0 +1,10 @@
+<div class="container m-b-20 space-top" fxLayout="row" fxLayoutGap="20px">
+  <div #cobCatchUpStatus>
+    <h2 class="no-m">COB Catch-Up is:<span class="m-l-20 m-r-20">{{ isCatchUpRunning ? 'Running' : 'Inactive' }}</span>
+    </h2>
+  </div>
+  <button mat-raised-button class="activate" (click)="runCatchUp()" *ngIf="!isCatchUpRunning">
+    <fa-icon icon="times-circle" class="m-r-10"></fa-icon>
+    Run Catch-Up
+  </button>
+</div>
diff --git a/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.scss b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.scss
new file mode 100644
index 000000000..6035649d8
--- /dev/null
+++ b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.scss
@@ -0,0 +1,33 @@
+.success {
+  color: #32cd32;
+}
+
+.fail {
+  color: #f44366;
+}
+
+.currently-running {
+  color: #32cd32;
+}
+
+.not-currently-running {
+  color: #f44366;
+}
+
+.errorlog {
+  color: #ffa726;
+}
+
+.suspend {
+  background: #32cd32;
+  color: #ffffff;
+}
+
+.activate {
+  background: #f44366;
+  color: #ffffff;
+}
+
+.space-top {
+  margin-top: 30px;
+}
diff --git a/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.spec.ts b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.spec.ts
new file mode 100644
index 000000000..1a285d514
--- /dev/null
+++ b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CobWorkflowComponent } from './cob-workflow.component';
+
+describe('CobWorkflowComponent', () => {
+  let component: CobWorkflowComponent;
+  let fixture: ComponentFixture<CobWorkflowComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CobWorkflowComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CobWorkflowComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.ts b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.ts
new file mode 100644
index 000000000..7580cbc9d
--- /dev/null
+++ b/src/app/system/manage-jobs/cob-workflow/cob-workflow.component.ts
@@ -0,0 +1,41 @@
+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { SystemService } from 'app/system/system.service';
+
+@Component({
+  selector: 'mifosx-cob-workflow',
+  templateUrl: './cob-workflow.component.html',
+  styleUrls: ['./cob-workflow.component.scss']
+})
+export class CobWorkflowComponent implements OnInit, OnDestroy {
+
+  waitTime: number = 30000;
+
+  isCatchUpRunning = false;
+  /** Timer to refetch COB Catch-Up status every 5 seconds */
+  timer: any;
+
+  constructor(private systemService: SystemService) { }
+
+  ngOnInit(): void {
+    setTimeout(() => { this.getCOBCatchUpStatus(); }, this.waitTime);
+  }
+
+  ngOnDestroy() {
+    clearTimeout(this.timer);
+  }
+
+  getCOBCatchUpStatus(): void {
+    this.systemService.getCOBCatchUpStatus().subscribe((response: any) => {
+      this.isCatchUpRunning = response.isCatchUpRunning;
+    });
+    this.timer = setTimeout(() => { this.getCOBCatchUpStatus(); }, this.waitTime);
+  }
+
+  runCatchUp(): void {
+    this.systemService.runCOBCatchUp().subscribe((response: any) => {
+      this.isCatchUpRunning = true;
+      this.waitTime = 5000;
+    });
+  }
+
+}
diff --git a/src/app/system/manage-jobs/manage-jobs.component.html b/src/app/system/manage-jobs/manage-jobs.component.html
index a66989dbb..679cb6c02 100644
--- a/src/app/system/manage-jobs/manage-jobs.component.html
+++ b/src/app/system/manage-jobs/manage-jobs.component.html
@@ -7,6 +7,9 @@
       <mat-tab label="Workflow Jobs">
         <mifosx-workflow-jobs></mifosx-workflow-jobs>
       </mat-tab>
+      <mat-tab label="COB">
+        <mifosx-cob-workflow></mifosx-cob-workflow>
+      </mat-tab>
     </mat-tab-group>
 
   </mat-card-content>
diff --git a/src/app/system/manage-jobs/scheduler-jobs/manage-scheduler-jobs.component.html b/src/app/system/manage-jobs/scheduler-jobs/manage-scheduler-jobs.component.html
index c24b44794..7ac870ffa 100644
--- a/src/app/system/manage-jobs/scheduler-jobs/manage-scheduler-jobs.component.html
+++ b/src/app/system/manage-jobs/scheduler-jobs/manage-scheduler-jobs.component.html
@@ -1,6 +1,6 @@
-<div class="container m-b-20" fxLayout="row" fxLayoutGap="20px">
+<div class="container m-b-20 space-top" fxLayout="row" fxLayoutGap="20px">
     <div #schedulerStatus>
-    <h2 class="no-m">Scheduler Status: {{ schedulerActive ? 'Active' : 'Inactive' }}</h2>
+    <h2 class="no-m">Scheduler Status:<span class="m-l-20 m-r-20">{{ schedulerActive ? 'Active' : 'Inactive' }}</span></h2>
     </div>
     <button mat-raised-button class="suspend">
       <fa-icon icon="times-circle" class="m-r-10"></fa-icon>
diff --git a/src/app/system/manage-jobs/workflow-jobs/workflow-jobs.component.html b/src/app/system/manage-jobs/workflow-jobs/workflow-jobs.component.html
index cede43df8..9f9241877 100644
--- a/src/app/system/manage-jobs/workflow-jobs/workflow-jobs.component.html
+++ b/src/app/system/manage-jobs/workflow-jobs/workflow-jobs.component.html
@@ -1,4 +1,4 @@
-<div class="container" fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
+<div class="container space-top" fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
 
   <mat-form-field fxFlex="31%">
     <mat-label>Job Name</mat-label>
diff --git a/src/app/system/system.module.ts b/src/app/system/system.module.ts
index 43fc22d34..29006747b 100644
--- a/src/app/system/system.module.ts
+++ b/src/app/system/system.module.ts
@@ -70,6 +70,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { WorkflowJobsComponent } from './manage-jobs/workflow-jobs/workflow-jobs.component';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { ManageExternalEventsComponent } from './manage-external-events/manage-external-events.component';
+import { CobWorkflowComponent } from './manage-jobs/cob-workflow/cob-workflow.component';
 
 @NgModule({
   imports: [
@@ -139,7 +140,8 @@ import { ManageExternalEventsComponent } from './manage-external-events/manage-e
     ManageSchedulerJobsComponent,
     WorkflowJobsComponent,
     WorkflowDiagramComponent,
-    ManageExternalEventsComponent
+    ManageExternalEventsComponent,
+    CobWorkflowComponent
   ],
 })
 export class SystemModule { }
diff --git a/src/app/system/system.service.ts b/src/app/system/system.service.ts
index 3a55325c7..acdc7ddde 100644
--- a/src/app/system/system.service.ts
+++ b/src/app/system/system.service.ts
@@ -717,4 +717,12 @@ export class SystemService {
     return this.http.delete(`/datatables/${datatableName}/${entityId}`, { params: httpParams });
   }
 
+  getCOBCatchUpStatus() {
+    return this.http.get(`/loans/is-catch-up-running`);
+  }
+
+  runCOBCatchUp() {
+    const emptyData = {};
+    return this.http.post(`/loans/catch-up`, emptyData);
+  }
 }