diff --git a/src/app/products/fixed-deposit-products/fixed-deposit-products.component.html b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.html
new file mode 100644
index 000000000..863c4fb5a
--- /dev/null
+++ b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.html
@@ -0,0 +1,40 @@
+
+
+
+
+
+
+
+
+ Filter
+
+
+
+
+
+
+
+
+
+ | Name |
+ {{ fixedDepositProduct.name }} |
+
+
+
+ Short Name |
+ {{ fixedDepositProduct.shortName }} |
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/products/fixed-deposit-products/fixed-deposit-products.component.scss b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.scss
new file mode 100644
index 000000000..24edb63bb
--- /dev/null
+++ b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.scss
@@ -0,0 +1,7 @@
+table {
+ width: 100%;
+
+ .select-row:hover {
+ cursor: pointer;
+ }
+}
diff --git a/src/app/products/fixed-deposit-products/fixed-deposit-products.component.spec.ts b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.spec.ts
new file mode 100644
index 000000000..bfc58dd40
--- /dev/null
+++ b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FixedDepositProductsComponent } from './fixed-deposit-products.component';
+
+describe('FixedDepositProductsComponent', () => {
+ let component: FixedDepositProductsComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ FixedDepositProductsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(FixedDepositProductsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/products/fixed-deposit-products/fixed-deposit-products.component.ts b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.ts
new file mode 100644
index 000000000..eba6c1a3c
--- /dev/null
+++ b/src/app/products/fixed-deposit-products/fixed-deposit-products.component.ts
@@ -0,0 +1,65 @@
+/** Angular Imports */
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatTableDataSource, MatPaginator, MatSort } from '@angular/material';
+import { ActivatedRoute } from '@angular/router';
+
+/** rxjs Imports */
+import { of } from 'rxjs';
+
+/**
+ * Fixed Deposit Products component.
+ */
+@Component({
+ selector: 'mifosx-fixed-deposit-products',
+ templateUrl: './fixed-deposit-products.component.html',
+ styleUrls: ['./fixed-deposit-products.component.scss']
+})
+export class FixedDepositProductsComponent implements OnInit {
+
+ /** Fixed deposit products data. */
+ fixedDepositProductData: any;
+ /** Columns to be displayed in fixed deposit products table. */
+ displayedColumns: string[] = ['name', 'shortName'];
+ /** Data source for fixed deposit products table. */
+ dataSource: MatTableDataSource;
+
+ /** Paginator for fixed deposit products table. */
+ @ViewChild(MatPaginator) paginator: MatPaginator;
+ /** Sorter for fixed deposit products table. */
+ @ViewChild(MatSort) sort: MatSort;
+
+ /**
+ * Retrieves the fixed deposit products data from `resolve`.
+ * @param {ActivatedRoute} route Activated Route.
+ */
+ constructor(private route: ActivatedRoute) {
+ this.route.data.subscribe(( data: { fixedDepositProducts: any }) => {
+ this.fixedDepositProductData = data.fixedDepositProducts;
+ });
+ }
+
+ /**
+ * Filters data in fixed deposit products table based on passed value.
+ * @param {string} filterValue Value to filter data.
+ */
+ applyFilter(filterValue: string) {
+ this.dataSource.filter = filterValue.trim().toLowerCase();
+ }
+
+ /**
+ * Sets the fixed deposit products table.
+ */
+ ngOnInit() {
+ this.setFixedDepositProducts();
+ }
+
+ /**
+ * Initializes the data source, paginator and sorter for fixed deposit products table.
+ */
+ setFixedDepositProducts() {
+ this.dataSource = new MatTableDataSource(this.fixedDepositProductData);
+ this.dataSource.paginator = this.paginator;
+ this.dataSource.sort = this.sort;
+ }
+
+}
diff --git a/src/app/products/fixed-deposit-products/fixed-deposit-products.resolver.ts b/src/app/products/fixed-deposit-products/fixed-deposit-products.resolver.ts
new file mode 100644
index 000000000..3832baeb2
--- /dev/null
+++ b/src/app/products/fixed-deposit-products/fixed-deposit-products.resolver.ts
@@ -0,0 +1,30 @@
+/** Angular Imports */
+import { Injectable } from '@angular/core';
+import { Resolve } from '@angular/router';
+
+/** rxjs Imports */
+import { Observable } from 'rxjs';
+
+/** Custom Services */
+import { ProductsService } from '../products.service';
+
+/**
+ * Fixed Deposit Products data resolver.
+ */
+@Injectable()
+export class FixedDepositProductsResolver implements Resolve