Merge pull request #82 from Pear-Trading/v0.1.11

v0.1.11 release

.angular-cli.json

@@ -1,59 +0,0 @@
-{
-  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
-  "project": {
-    "version": "1.0.0-alpha.4",
-    "name": "coreui-angular"
-  },
-  "apps": [
-    {
-      "root": "src",
-      "outDir": "dist",
-      "assets": ["assets"],
-      "index": "index.html",
-      "main": "main.ts",
-      "polyfills": "polyfills.ts",
-      "test": "test.ts",
-      "tsconfig": "tsconfig.app.json",
-      "testTsconfig": "tsconfig.spec.json",
-      "prefix": "app",
-      "scripts": [
-        "../node_modules/moment/min/moment.min.js"
-      ],
-      "styles": [
-        "scss/style.scss"
-      ],
-      "environmentSource": "environments/environment.ts",
-      "environments": {
-        "dev": "environments/environment.dev.ts",
-        "prod": "environments/environment.prod.ts",
-        "local": "environments/environment.local.ts",
-        "ci": "environments/environment.ci.ts"
-      }
-    }
-  ],
-  "e2e": {
-    "protractor": {
-      "config": "./protractor.conf.js"
-    }
-  },
-  "lint": [
-    {
-      "project": "src/tsconfig.app.json"
-    },
-    {
-      "project": "src/tsconfig.spec.json"
-    },
-    {
-      "project": "e2e/tsconfig.e2e.json"
-    }
-  ],
-  "test": {
-    "karma": {
-      "config": "./karma.conf.js"
-    }
-  },
-  "defaults": {
-    "styleExt": "scss",
-    "prefixInterfaces": false
-  }
-}

CHANGELOG.md

@@ -2,6 +2,13 @@
 
 # Next Release
 
+# 0.1.11
+
+* Bumped Angular to version 6 and upgraded packages to match
+* Converted RxJS 5 syntax to RxJS 6
+* Removed extraneous console logs
+* Changed dashboard sector list to category all time list & tweaked layout
+
 # 0.1.10
 
 * Allowed for creation of yearly recurring transactions

angular.json

@@ -0,0 +1,189 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "localloop-web": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "tsConfig": "src/tsconfig.app.json",
+            "polyfills": "src/polyfills.ts",
+            "assets": [
+              "src/assets"
+            ],
+            "styles": [
+              "src/scss/style.scss"
+            ],
+            "scripts": [
+              "node_modules/moment/min/moment.min.js"
+            ]
+          },
+          "configurations": {
+            "dev": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.dev.ts"
+                }
+              ]
+            },
+            "production": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ]
+            },
+            "local": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.local.ts"
+                }
+              ]
+            },
+            "ci": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.ci.ts"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "localloop-web:build"
+          },
+          "configurations": {
+            "dev": {
+              "browserTarget": "localloop-web:build:dev"
+            },
+            "production": {
+              "browserTarget": "localloop-web:build:production"
+            },
+            "local": {
+              "browserTarget": "localloop-web:build:local"
+            },
+            "ci": {
+              "browserTarget": "localloop-web:build:ci"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "localloop-web:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "karmaConfig": "./karma.conf.js",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.spec.json",
+            "scripts": [
+              "node_modules/moment/min/moment.min.js"
+            ],
+            "styles": [
+              "src/scss/style.scss"
+            ],
+            "assets": [
+              "src/assets"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": []
+          }
+        }
+      }
+    },
+    "localloop-web-e2e": {
+      "root": "",
+      "sourceRoot": "",
+      "projectType": "application",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "./protractor.conf.js",
+            "devServerTarget": "localloop-web:serve"
+          },
+          "configurations": {
+            "local": {
+              "devServerTarget": "localloop-web:serve:local"
+            },
+            "ci": {
+              "devServerTarget": "localloop-web:serve:ci"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "e2e/tsconfig.e2e.json"
+            ],
+            "exclude": []
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "localloop-web",
+  "schematics": {
+    "@schematics/angular:component": {
+      "prefix": "app",
+      "styleext": "scss"
+    },
+    "@schematics/angular:directive": {
+      "prefix": "app"
+    }
+  }
+}

karma.conf.js

@@ -4,28 +4,28 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', '@angular/cli'],
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage-istanbul-reporter'),
-      require('@angular/cli/plugins/karma')
+      require('@angular-devkit/build-angular/plugins/karma')
     ],
     client:{
       clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
     files: [
-      { pattern: './src/test.ts', watched: false }
+      
     ],
     preprocessors: {
-      './src/test.ts': ['@angular/cli']
+      
     },
     mime: {
       'text/x-typescript': ['ts','tsx']
     },
     coverageIstanbulReporter: {
-      reports: [ 'html', 'lcovonly' ],
+      dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
       fixWebpackSourcePaths: true
     },
     angularCli: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "localloop-web",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "LocalLoop Web - Web interface for LocalLoop app",
   "author": "",
   "url": "http://www.peartrade.org",
@@ -10,56 +10,59 @@
     "start": "ng serve",
     "build": "ng build",
     "test": "ng test",
-    "test:ci": "ng test --watch=false --env=ci",
+    "test:ci": "ng test --watch=false",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "e2e:ci": "ng e2e --env=ci",
+    "e2e:ci": "ng e2e --configuration=ci",
     "ci": "npm run test:ci && npm run e2e:ci"
   },
   "private": true,
   "dependencies": {
-    "@agm/core": "1.0.0-beta.2",
+    "@agm/core": "1.0.0-beta.3",
-    "@agm/js-marker-clusterer": "1.0.0-beta.2",
+    "@agm/js-marker-clusterer": "1.0.0-beta.3",
-    "@angular/common": "5.2.0",
+    "@angular/common": "6.0.3",
-    "@angular/compiler": "5.2.0",
+    "@angular/compiler": "6.0.3",
-    "@angular/core": "5.2.0",
+    "@angular/core": "6.0.3",
-    "@angular/forms": "5.2.0",
+    "@angular/forms": "6.0.3",
-    "@angular/platform-browser": "5.2.0",
+    "@angular/platform-browser": "6.0.3",
-    "@angular/platform-browser-dynamic": "5.2.0",
+    "@angular/platform-browser-dynamic": "6.0.3",
-    "@angular/router": "5.2.0",
+    "@angular/router": "6.0.3",
-    "@angular/upgrade": "5.2.0",
+    "@angular/upgrade": "6.0.3",
     "@types/moment": "2.13.0",
-    "chart.js": "2.7.1",
+    "chart.js": "^2.7.2",
-    "core-js": "2.5.1",
+    "core-js": "^2.5.7",
+    "jasmine": "^3.1.0",
     "js-marker-clusterer": "1.0.0",
-    "moment": "^2.21.0",
+    "moment": "^2.22.2",
     "ng2-charts": "1.6.0",
     "ng2-validation-manager": "0.5.3",
-    "ngx-bootstrap": "2.0.0-rc.1",
+    "ngx-bootstrap": "^2.0.5",
-    "ngx-pagination": "3.0.3",
+    "ngx-pagination": "^3.1.1",
-    "rxjs": "5.5.6",
+    "rxjs": "6.2.0",
+    "rxjs-compat": "^6.2.0",
     "ts-helpers": "1.1.2",
-    "webpack-dev-server": "3.1.0",
+    "webpack-dev-server": "^3.1.4",
-    "zone.js": "0.8.18"
+    "zone.js": "0.8.26"
   },
   "devDependencies": {
-    "@angular/cli": "1.7.3",
+    "@angular-devkit/build-angular": "~0.6.6",
-    "@angular/compiler-cli": "5.2.0",
+    "@angular/cli": "^6.0.7",
+    "@angular/compiler-cli": "6.0.3",
     "@types/jasmine": "2.8.2",
     "@types/jasminewd2": "2.0.3",
     "@types/node": "8.0.52",
-    "codelyzer": "4.0.1",
+    "codelyzer": "^4.3.0",
-    "jasmine-core": "2.8.0",
+    "jasmine-core": "^3.1.0",
     "jasmine-spec-reporter": "4.2.1",
-    "karma": "1.7.1",
+    "karma": "^2.0.2",
     "karma-chrome-launcher": "2.2.0",
     "karma-cli": "1.0.1",
-    "karma-coverage-istanbul-reporter": "1.3.0",
+    "karma-coverage-istanbul-reporter": "^2.0.1",
-    "karma-jasmine": "1.1.0",
+    "karma-jasmine": "^1.1.2",
-    "karma-jasmine-html-reporter": "0.2.2",
+    "karma-jasmine-html-reporter": "^1.1.0",
-    "protractor": "5.2.0",
+    "protractor": "^5.3.2",
-    "ts-node": "3.3.0",
+    "ts-node": "^6.1.0",
-    "tslint": "5.8.0",
+    "tslint": "^5.10.0",
-    "typescript": "2.6.x"
+    "typescript": "2.7.2"
   }
 }

src/app/_guards/auth.guard.ts

@@ -8,13 +8,11 @@ export class AuthGuard implements CanActivate {
 
   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
     if (localStorage.getItem('sessionKey')) {
-      console.log('session key found');
       // logged in so return true
       return true;
     }
 
     // not logged in so redirect to login page with the return url
-    console.log('no session key found');
     this.router.navigate(['/login'], { queryParams: { returnUrl: state.url }});
     return false;
   }

src/app/_guards/customer.guard.ts

@@ -8,11 +8,9 @@ export class CustomerGuard implements CanActivate {
 
   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
     if (localStorage.getItem('usertype') === 'customer') {
-      console.log('Customer logged in');
       // customer logged in so return true
       return true;
     } else if (localStorage.getItem('usertype') === 'organisation') {
-      console.log('not an customer');
       this.router.navigate(['/dashboard']);
       return false;
     }

src/app/_guards/org.guard.ts

@@ -8,11 +8,9 @@ export class OrgGuard implements CanActivate {
 
   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
     if (localStorage.getItem('usertype') === 'organisation') {
-      console.log('Organisation logged in');
       // org logged in so return true
       return true;
     } else if (localStorage.getItem('usertype') === 'customer') {
-      console.log('not an organisation');
       this.router.navigate(['/dashboard-customer']);
       return false;
     }

src/app/auth/login.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { Validators, FormBuilder, FormGroup } from '@angular/forms';
 import { ApiService } from '../providers/api-service';
 import { Router, ActivatedRoute } from '@angular/router';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'login.component.html',

src/app/auth/register.component.ts

@@ -3,7 +3,7 @@ import { Validators, FormBuilder, FormGroup } from '@angular/forms';
 import { ValidationManager } from 'ng2-validation-manager';
 import { ApiService } from '../providers/api-service';
 import {Router } from '@angular/router';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'register.component.html',

src/app/dashboard/account-edit.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { Validators, FormBuilder, FormGroup } from '@angular/forms';
 import { ApiService } from '../providers/api-service';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'account-edit.component.html',

src/app/dashboard/add-data.component.ts

@@ -3,7 +3,7 @@ import { Validators, FormBuilder, FormGroup } from '@angular/forms';
 import { ApiService } from '../providers/api-service';
 import { OrgTableComponent } from '../shared/org-table.component';
 import * as moment from 'moment';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'add-data.component.html',
@@ -174,6 +174,7 @@ export class AddDataComponent implements OnInit {
   }
 
   transactionFormValidate() {
+    this.transactionFormStatus = null;
     if (this.submitOrg.name.length &&
         this.amount &&
         (this.recurringPurchase &&

src/app/dashboard/category-month.component.ts

@@ -2,7 +2,7 @@ import { Directive, Component, OnInit } from '@angular/core';
 import { ApiService } from '../providers/api-service';
 import { DataType } from '../shared/data-types.enum';
 import * as moment from 'moment';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'category-month.component.html'

src/app/dashboard/dashboard-customer.component.html

@@ -11,10 +11,10 @@
     </div><!--/.col-->
   </div><!--/.row-->
   <div class=row>
-    <div class="col-xl-4 col-md-6">
+    <div class="col-xl-6">
       <panel-pie></panel-pie>
     </div><!--/.col-->
-    <div *ngIf="showCategoryDoughnutChart" class="col-xl-4 col-md-6">
+    <div *ngIf="showCategoryDoughnutChart" class="col-xl-6">
       <div class="card">
         <div class="card-block">
           <div class="row">
@@ -26,7 +26,7 @@
             <canvas baseChart class="chart"
             [datasets]="doughnutChartDataCategory"
             [labels]="doughnutChartLabelsCategory"
-            [options]="doughtnutChartOptionsCategory"
+            [options]="doughnutChartOptionsCategory"
             [legend]="chartLegend"
             [chartType]="chartType"
             (chartHover)="chartHovered($event)"
@@ -35,7 +35,7 @@
         </div>
       </div>
     </div><!--/.col-->
-    <div *ngIf="showEssentialBarChart" class="col-xl-4 col-md-6">
+    <div *ngIf="showEssentialBarChart" class="col-xl-6">
       <div class="card">
         <div class="card-block">
           <div class="row">
@@ -55,7 +55,7 @@
         </div>
       </div>
     </div><!--/.col-->
-    <div *ngIf="showCategoryBarChart" class="col-xl-4 col-md-6">
+    <div *ngIf="showCategoryBarChart" class="col-xl-6">
       <div class="card">
         <div class="card-block">
           <div class="row">
@@ -76,7 +76,7 @@
         </div>
       </div>
     </div><!--/.col-->
-    <div class="col-xl-4 col-md-6">
+    <div class="col-xl-6">
       <div class="card">
         <div class="card-block">
           <div class="row">
@@ -135,29 +135,29 @@
         </div>
       </div>
     </div><!--/.col-->
-    <div class="col-xl-4">
+    <div class="col-xl-6">
       <div class="card">
         <div class="card-block">
           <div class="row">
             <div class="col-12">
-              <h4 class="card-title float-left mb-0">Purchases by Sector</h4>
+              <h4 class="card-title float-left mb-0">All Purchases by Category</h4>
             </div><!--/.col-->
           </div><!--/.row-->
           <div class="chart-wrapper">
             <ul class="icons-list">
               <!-- New loop  -->
-              <li *ngFor="let sector of sectorLetters | slice:0:sectorLimit; let i=index">
+              <li *ngFor="let category of totalCategoryList | slice:0:totalCategoryLimit; let i=index">
-                <i [ngClass]="[sectorIcons [sector] || 'icon-question', sectorClasses [sector] || 'bg-info']"></i>
+                <i [ngClass]="[ 'icon-question', 'bg-info']"></i>
                 <div class="desc">
-                  <div class="title">{{ sectorNames [sector] || 'N/A' }}</div>
+                  <div class="title">{{ category.category || 'N/A' }}</div>
                 </div>
                 <div class="value">
                   <div class="small text-muted">Bought</div>
-                  <strong>{{ sectorPurchases[i] || 'N/A' }}</strong>
+                  <strong>{{ category.value || 'N/A' }}</strong>
                 </div>
               </li>
-              <li *ngIf="sectorLetters.length > sectorLimit && disableSectorButton == false" class="divider text-center">
+              <li *ngIf="totalCategoryList.length > totalCategoryLimit && disableCategoryButton == false" class="divider text-center">
-                <button type="button" class="btn btn-sm btn-link text-muted" (click)="loadMore()"><i class="icon-options"></i></button>
+                <button type="button" class="btn btn-sm btn-link text-muted" (click)="categoryLoadMore()"><i class="icon-options"></i></button>
               </li>
             </ul>
           </div>

src/app/dashboard/dashboard-customer.component.ts

@@ -7,7 +7,7 @@ import { CustBarSnippetComponent } from '../snippets/cust-snippet-bar.component'
 import { PiePanel } from '../panels/pie-panel.component';
 import { DataType } from '../shared/data-types.enum';
 import * as moment from 'moment';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'dashboard-customer.component.html'
@@ -23,14 +23,14 @@ export class DashboardCustomerComponent implements OnInit {
   username: any;
   maxPurchase: number = 0;
 
-  disableSectorButton: boolean = false;
+  disableCategoryButton: boolean = false;
 
   public chartType = 'doughnut';
   public chartLegend = true;
   public doughnutChartDataCategory: any[] = [];
   public doughnutChartLabelsCategory: string[] = [];
 
-  public doughtnutChartOptionsCategory:any = {
+  public doughnutChartOptionsCategory:any = {
     tooltips: {
       callbacks: {
         label: (tooltip, data) => {
@@ -100,83 +100,9 @@ export class DashboardCustomerComponent implements OnInit {
     count: 0,
   };
 
-  sectorNames = {
+  showTotalCategoryList: boolean = false;
-    A: 'Agriculture, Forestry & Fishing',
+  totalCategoryLimit: number = 10;
-    B: 'Mining & Quarrying',
+  totalCategoryList: any[]=[];
-    C: 'Manufacturing',
-    D: 'Electricity, Gas, Steam & Air Conditioning',
-    E: 'Water & Waste Management',
-    F: 'Construction',
-    G: 'Wholesale & Retail Trade',
-    H: 'Transportation & Storage',
-    I: 'Accomodation & Food Services',
-    J: 'Information & Communication',
-    K: 'Financial & Insurance Activities',
-    L: 'Real Estate',
-    M: 'Professional, Scientfic & Technical',
-    N: 'Administrative & Support Services',
-    O: 'Public Administration, Defence & Social Security',
-    P: 'Education',
-    Q: 'Human Health & Social Work',
-    R: 'Arts, Entertainment & Recreation',
-    S: 'Other Service Activities',
-    T: 'Household Domestic Business',
-    U: 'Extraterritorial Organisations and Bodies'
-  }
-
-  sectorIcons = {
-    A: 'icon-drop',
-    B: 'icon-diamond',
-    C: 'icon-settings',
-    D: 'icon-energy',
-    E: 'icon-trash',
-    F: 'icon-wrench',
-    G: 'icon-tag',
-    H: 'icon-speedometer',
-    I: 'icon-cup',
-    J: 'icon-feed',
-    K: 'icon-credit-card',
-    L: 'icon-graph',
-    M: 'icon-chemistry',
-    N: 'icon-drawer',
-    O: 'icon-pie-chart',
-    P: 'icon-graduation',
-    Q: 'icon-support',
-    R: 'icon-film',
-    S: 'icon-calendar',
-    T: 'icon-home',
-    U: 'icon-globe',
-  }
-
-  sectorClasses = {
-    A: 'bg-primary',
-    B: 'bg-success',
-    C: 'bg-danger',
-    D: 'bg-warning',
-    E: 'bg-info',
-    F: 'bg-primary',
-    G: 'bg-success',
-    H: 'bg-danger',
-    I: 'bg-warning',
-    J: 'bg-info',
-    K: 'bg-primary',
-    L: 'bg-success',
-    M: 'bg-danger',
-    N: 'bg-warning',
-    O: 'bg-info',
-    P: 'bg-primary',
-    Q: 'bg-success',
-    R: 'bg-danger',
-    S: 'bg-warning',
-    T: 'bg-info',
-    U: 'bg-primary',
-  }
-
-  sectorLetters: string[] = [];
-  sectorPurchases: number[] = [];
-  sectorLimit: number = 10;
-
-  sectorList: any;
 
   // Graph widgets
   public widgetList = [
@@ -216,9 +142,10 @@ export class DashboardCustomerComponent implements OnInit {
     this.api.customerStats().subscribe(
       result => {
         this.setWeekPurchaseList(result.weeks);
-        this.setSectorList(result.sectors);
         this.setWeekData(result);
         this.setChartData(result.data.cat_total);
+        this.totalCategoryList = result.data.cat_list;
+        this.showTotalCategoryList = true;
         this.purchaseEssential = result.data.essentials.purchase_no_essential_total;
         this.purchaseNotEssential = result.data.essentials.purchase_no_total - this.purchaseEssential;
         this.barChartDataEssential = [
@@ -273,14 +200,9 @@ export class DashboardCustomerComponent implements OnInit {
     };
   }
 
-  public setSectorList (data: any) {
+  private categoryLoadMore () {
-    this.sectorLetters = Object.keys(data.sectors).map(key => data.sectors[key]);
+    this.disableCategoryButton = true;
-    this.sectorPurchases = Object.keys(data.purchases).map(key => data.purchases[key]);
+    this.totalCategoryLimit = 30;
-  }
-
-  private loadMore () {
-    this.disableSectorButton = true;
-    this.sectorLimit = 22;
   }
 
   public convertHex(hex: string, opacity: number) {

src/app/dashboard/feedback.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { Validators, FormBuilder, FormGroup } from '@angular/forms';
 import { ApiService } from '../providers/api-service';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'feedback.component.html',

src/app/dashboard/leaderboard.component.ts

@@ -5,7 +5,7 @@ import {PaginationInstance} from 'ngx-pagination';
 // import { PaginationControlsComponent } from 'ngx-pagination';
 // import { PaginationControlsDirective } from 'ngx-pagination';
 // import { TransactionResultComponent } from '../shared/transaction-result.component';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'leaderboard.component.html',

src/app/dashboard/map.component.ts

@@ -3,7 +3,7 @@ import { ApiService } from '../providers/api-service';
 import { AgmCoreModule } from '@agm/core';
 import { BsModalService, ModalDirective } from 'ngx-bootstrap/modal';
 import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'map.component.html',

src/app/dashboard/payroll-log.component.ts

@@ -6,7 +6,7 @@ import {PaginationInstance} from 'ngx-pagination';
 // import { PaginationControlsDirective } from 'ngx-pagination';
 // import { TransactionResultComponent } from '../shared/transaction-result.component';
 import * as moment from 'moment';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'payroll-log.component.html',

src/app/dashboard/trail-map.component.ts

@@ -3,7 +3,7 @@ import { ApiService } from '../providers/api-service';
 import { AgmCoreModule } from '@agm/core';
 import { BsModalService, ModalDirective } from 'ngx-bootstrap/modal';
 import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'trail-map.component.html',

src/app/dashboard/transaction-log.component.ts

@@ -4,7 +4,7 @@ import { BsModalService, ModalDirective } from 'ngx-bootstrap/modal';
 import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
 import { PaginationInstance } from 'ngx-pagination';
 import * as moment from 'moment';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   templateUrl: 'transaction-log.component.html',

src/app/panels/pie-panel.component.ts

@@ -3,7 +3,7 @@ import { ApiService } from '../providers/api-service';
 import { CustPiesService } from '../providers/cust-pies.service';
 import { DataType } from '../shared/data-types.enum';
 import { ChartData } from '../_interfaces/chart-data';
-import 'rxjs/add/operator/map';
+
 
 @Component({
   selector: 'panel-pie',

src/app/providers/api-service.ts

@@ -1,8 +1,8 @@
+import { map } from 'rxjs/operators';
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { Observable } from 'rxjs/Rx';
 import { environment } from '../../environments/environment';
-import 'rxjs/add/operator/map';
+
 
 /* this provider handles the interaction between server and client */
 
@@ -29,18 +29,15 @@ export class ApiService {
   // Login API
 
   public getSessionKey() {
-    console.log('get key');
     return this.sessionKey;
   }
 
   public setSessionKey(key) {
-    console.log('set key');
     this.sessionKey = key;
     localStorage.setItem('sessionKey', this.sessionKey);
   }
 
   public removeSessionKey() {
-    console.log('remove key');
     this.sessionKey = null;
     localStorage.removeItem('sessionKey');
   }
@@ -57,8 +54,8 @@ export class ApiService {
       .post<any>(
         this.apiUrl + '/login',
         data
-      )
+      ).pipe(
-      .map(
+      map(
         result => {
           const json = result;
           this.setSessionKey(json.session_key);
@@ -69,24 +66,23 @@ export class ApiService {
         this.setUserType(json.user_type);
         return json;
         }
-      );
+      ));
   }
 
   public logout() {
-    console.log(this.sessionKey);
     const key = this.sessionKey;
     return this.http
       .post<any>(
         this.apiUrl + '/logout',
         { session_key : key },
-      )
+      ).pipe(
-      .map(
+      map(
         response => {
           localStorage.clear();
           this.sessionKey = null;
           return response;
         }
-      );
+      ));
   }
 
   // Submits feedback
@@ -96,7 +92,6 @@ export class ApiService {
     data.package_name = 'Foodloop Web';
     data.version_code = 'dev';
     data.version_number = 'dev';
-      console.log(data);
       return this.http.post<any>(
         this.apiUrl + '/feedback',
         data
@@ -230,7 +225,6 @@ export class ApiService {
   public setUserInfo(
     email: string,
     display_name: string) {
-    console.log('set UserInfo');
     localStorage.setItem('email', email);
     localStorage.setItem('displayname', display_name);
   }
@@ -238,7 +232,6 @@ export class ApiService {
   // Sets usertype
 
   public setUserType(user_type: string) {
-    console.log('set UserType');
     localStorage.setItem('usertype', user_type);
   }
 
@@ -263,33 +256,27 @@ export class ApiService {
   // Deletes account details on logout
 
   public removeUserInfo() {
-    console.log('remove UserInfo');
     localStorage.removeItem('email');
     localStorage.removeItem('displayname');
   }
 
   public getFullName() {
-    console.log('get Full Name');
     localStorage.getItem('fullname');
   }
 
   public getDisplayName() {
-    console.log('get Display Name');
     localStorage.getItem('displayname');
   }
 
   public getPostcode() {
-    console.log('get Postcode');
     localStorage.getItem('postcode');
   }
 
   public getYearOfBirth() {
-    console.log('get Year of Birth');
     localStorage.getItem('yearofbirth');
   }
 
   public getEmail() {
-    console.log('get email');
     localStorage.getItem('email');
   }
 

src/app/providers/cust-pies.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ApiService } from './api-service';
-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs';
 
 @Injectable()
 export class CustPiesService {

src/app/providers/cust-snippets.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ApiService } from './api-service';
-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs';
 
 @Injectable()
 export class CustSnippetsService {

src/app/providers/org-snippets.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ApiService } from './api-service';
-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs';
 
 @Injectable()
 export class OrgSnippetsService {

src/app/shared/breadcrumb.component.ts

@@ -1,6 +1,8 @@
+
+import {filter} from 'rxjs/operators';
 import { Component, OnInit } from '@angular/core';
 import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
-import 'rxjs/add/operator/filter';
+
 
 @Component({
   selector: 'app-breadcrumbs',
@@ -18,7 +20,7 @@ export class BreadcrumbsComponent implements OnInit {
   breadcrumbs: Array<Object>;
   constructor(private router: Router, private route: ActivatedRoute) {}
   ngOnInit(): void {
-    this.router.events.filter(event => event instanceof NavigationEnd).subscribe(event => {
+    this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(event => {
       this.breadcrumbs = [];
       let currentRoute = this.route.root,
       url = '';

src/tsconfig.spec.json

@@ -11,7 +11,8 @@
     ]
   },
   "files": [
-    "test.ts"
+    "test.ts",
+    "polyfills.ts"
   ],
   "include": [
     "**/*.spec.ts",

tslint.json

@@ -12,7 +12,7 @@
     "curly": true,
     "eofline": true,
     "forin": true,
-    "import-blacklist": [true, "rxjs"],
+    "import-blacklist": [true],
     "import-spacing": true,
     "indent": [
       true,