diff --git a/src/app/dashboard/dashboard-customer.component.html b/src/app/dashboard/dashboard-customer.component.html
index 3d4b094..697c23c 100644
--- a/src/app/dashboard/dashboard-customer.component.html
+++ b/src/app/dashboard/dashboard-customer.component.html
@@ -19,85 +19,52 @@
         <div class="card-block">
           <div class="row">
             <div class="col-12">
-              <h4 class="card-title float-left mb-0">Purchases Per Week</h4>
+              <h4 class="card-title float-left mb-0">Purchases by Week</h4>
             </div><!--/.col-->
           </div><!--/.row-->
           <div class="chart-wrapper">
             <ul class="horizontal-bars type-2">
               <li>
                 <span class="title">This Week</span>
-                <span class="value">{{ (weekPurchaseList.week_0  || 0 ) }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_0 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
+                <span class="value">{{ (weekPurchaseList.first  || 0 ) }} <span class="text-muted small">
+                  ({{ (weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})</span></span>
                 <div class="bars">
                   <div class="progress" style="height: 6px;">
                     <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_0 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
+                    [style.width]="(weekPurchaseList.first || 0 ) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
                   </div>
                 </div>
               </li>
               <li>
                 <span class="title">Last Week</span>
-                <span class="value">{{ weekPurchaseList.week_1 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_1 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
+                <span class="value">{{ weekPurchaseList.second || 0 }} <span class="text-muted small">
+                  ({{ (weekPurchaseList.second || 0 ) / weekPurchaseList.max | percent:'1.0-0' }})</span></span>
                 <div class="bars">
                   <div class="progress" style="height: 6px;">
                     <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_1 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
+                    [style.width]="(weekPurchaseList.second || 0 ) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
                   </div>
                 </div>
               </li>
               <li>
-                <span class="title">2 Weeks Ago</span>
-                <span class="value">{{ weekPurchaseList.week_2 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_2 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
+                <span class="title">Week Maximum</span>
+                <span class="value">{{ weekPurchaseList.max || 0 }} <span class="text-muted small">
+                  (100%)</span></span>
                 <div class="bars">
                   <div class="progress" style="height: 6px;">
                     <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_2 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
+                    style="width: 100%" aria-valuemin="0" aria-valuemax="100"></div>
                   </div>
                 </div>
               </li>
               <li>
-                <span class="title">3 Weeks Ago</span>
-                <span class="value">{{ weekPurchaseList.week_3 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_3 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
+                <span class="title">Weekly Average</span>
+                <span class="value">{{ (weekPurchaseList.sum / weekPurchaseList.count) || 0  | number:'1.0-0'}} <span class="text-muted small">
+                  ({{ ((weekPurchaseList.sum / weekPurchaseList.count) || 0) / weekPurchaseList.max | percent:'1.0-0' }})</span></span>
                 <div class="bars">
                   <div class="progress" style="height: 6px;">
                     <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_3 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <span class="title">4 Weeks Ago</span>
-                <span class="value">{{ weekPurchaseList.week_4 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_4 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
-                <div class="bars">
-                  <div class="progress" style="height: 6px;">
-                    <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_4 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <span class="title">5 Weeks Ago</span>
-                <span class="value">{{ weekPurchaseList.week_5 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_5 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
-                <div class="bars">
-                  <div class="progress" style="height: 6px;">
-                    <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_5 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
-                  </div>
-                </div>
-              </li>
-              <li>
-                <span class="title">6 Weeks Ago</span>
-                <span class="value">{{ weekPurchaseList.week_6 || 0 }} <span
-                  class="text-muted small">({{ (weekPurchaseList.week_6 || 0 ) / maxPurchase | percent:'1.0-0' }})</span></span>
-                <div class="bars">
-                  <div class="progress" style="height: 6px;">
-                    <div class="progress-bar bg-success" role="progressbar"
-                    [style.width]="(weekPurchaseList.week_6 || 0 ) / maxPurchase | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
+                    [style.width]="((weekPurchaseList.sum / weekPurchaseList.count) || 0) / weekPurchaseList.max | percent:'1.0-0'" aria-valuemin="0" aria-valuemax="100"></div>
                   </div>
                 </div>
               </li>
@@ -117,7 +84,7 @@
           <div class="chart-wrapper">
             <ul class="icons-list">
               <!-- New loop  -->
-              <li *ngFor="let sector of sectorLetters; let i=index">
+              <li *ngFor="let sector of sectorLetters | slice:0:sectorLimit; let i=index">
                 <i [ngClass]="sectorIcons [sector] || 'icon-question'" class="bg-primary"></i>
                 <div class="desc">
                   <div class="title">{{ sectorNames [sector] || 'N/A' }}</div>
@@ -127,84 +94,9 @@
                   <strong>{{ sectorPurchases[i] || 'N/A' }}</strong>
                 </div>
               </li>
-
-              <!-- Old code -->
-              <!-- <li>
-                <i [ngClass]="sectorIcons [sectorLetters[0]] || 'icon-question'" class="bg-primary"></i>
-                <div class="desc">
-                  <div class="title">{{ sectorNames [sectorLetters[0]] }}</div>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[0] || 'N/A' }}</strong>
-                </div>
+              <li *ngIf="sectorLetters.length > 10 && disableSectorButton == false" class="divider text-center">
+                <button type="button" class="btn btn-sm btn-link text-muted" (click)="loadMore()"><i class="icon-options"></i></button>
               </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[1]] || 'icon-question'" class="bg-info"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[1] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[1]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[1] || 'N/A' }}</strong>
-                </div>
-              </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[2]] || 'icon-question'" class="bg-warning"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[2] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[2]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[2] || 'N/A' }}</strong>
-                </div>
-              </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[3]] || 'icon-question'" class="bg-danger"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[3] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[3]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[3] || 'N/A' }}</strong>
-                </div>
-              </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[4]] || 'icon-question'" class="bg-success"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[4] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[4]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[4] || 'N/A' }}</strong>
-                </div>
-              </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[5]] || 'icon-question'" class="bg-danger"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[5] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[5]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[5] || 'N/A' }}</strong>
-                </div>
-              </li>
-              <li>
-                <i [ngClass]="sectorIcons [sectorLetters[6]] || 'icon-question'" class="bg-warning"></i>
-                <div class="desc">
-                  <div class="title">Sector {{ sectorLetters[6] || 'N/A' }}</div>
-                  <small>{{ sectorNames [sectorLetters[6]] || 'N/A' }}</small>
-                </div>
-                <div class="value">
-                  <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[6] || 'N/A' }}</strong>
-                </div>
-              </li> -->
             </ul>
           </div>
         </div>
diff --git a/src/app/dashboard/dashboard-customer.component.ts b/src/app/dashboard/dashboard-customer.component.ts
index 832fbac..1d9b145 100644
--- a/src/app/dashboard/dashboard-customer.component.ts
+++ b/src/app/dashboard/dashboard-customer.component.ts
@@ -20,14 +20,14 @@ export class DashboardCustomerComponent implements OnInit {
   username: any;
   maxPurchase: number = 0;
 
+  disableSectorButton: boolean = false;
+
   weekPurchaseList = {
-    week_0: 0,
-    week_1: 0,
-    week_2: 0,
-    week_3: 0,
-    week_4: 0,
-    week_5: 0,
-    week_6: 0,
+    first: 0,
+    second: 0,
+    max: 0,
+    sum: 0,
+    count: 0,
   };
 
   sectorNames = {
@@ -75,11 +75,12 @@ export class DashboardCustomerComponent implements OnInit {
     R: 'icon-film',
     S: 'icon-calendar',
     T: 'icon-home',
-    U: 'cion-globe',
+    U: 'icon-globe',
   }
 
   sectorLetters: string[] = [];
   sectorPurchases: number[] = [];
+  sectorLimit: number = 10;
 
   sectorList: any;
 
@@ -130,19 +131,12 @@ export class DashboardCustomerComponent implements OnInit {
 
   public setWeekPurchaseList (data: any) {
     this.weekPurchaseList = {
-      week_0: data.purchases[0],
-      week_1: data.purchases[1],
-      week_2: data.purchases[2],
-      week_3: data.purchases[3],
-      week_4: data.purchases[4],
-      week_5: data.purchases[5],
-      week_6: data.purchases[6],
+      first:  data.first,
+      second: data.second,
+      max:    data.max,
+      sum:    data.sum,
+      count:  data.count,
     };
-    this.maxPurchase = Object.keys(this.weekPurchaseList).map(key => this.weekPurchaseList[key]).reduce((a,b) => {
-      if (! a) { a = 0 }
-      if (! b) { b = 0 }
-      return Math.max(a,b);
-    });
   }
 
   public setSectorList (data: any) {
@@ -150,6 +144,11 @@ export class DashboardCustomerComponent implements OnInit {
     this.sectorPurchases = Object.keys(data.purchases).map(key => data.purchases[key]);
   }
 
+  public loadMore () {
+    this.disableSectorButton = true;
+    this.sectorLimit = 22;
+  }
+
   ngOnInit(): void {
   }
 }