Add button, env variable for NRCED

src/app/projects/project-detail/compliance/compliance-tab-content.component.html

@@ -10,12 +10,21 @@
     <div class="spinner-new rotating"></div>
   </div>
 
+  <h3>Inspections &amp; Orders</h3>
+  <p>
+    <a class="btn hero-btn content-btn-alt fixed-r-btn" (click)="openNRCED()">
+      <div class="center">
+        <span>NRCED</span><i class="material-icons">link</i>
+      </div>
+    </a> 
+      More records for {{project?.name}} are available on the Natural Resource Compliance and Enforcement Database (NRCED).
+  </p>
+
   <div *ngIf="collections.length; then table else emptyMessage"></div>
 
   <ng-template #table>
     <section class="ce-section">
-      <h3>Inspections &amp; Orders</h3>
-
+
       <div class="inspections-list" id="complianceList" role="tablist" aria-multiselectable="false">
 
         <table class="table mb-0">

src/app/projects/project-detail/compliance/compliance-tab-content.component.spec.ts

@@ -7,9 +7,11 @@ import { ProjectTypeFilterPipe } from 'app/pipes/project-type-filter.pipe';
 import { Project } from 'app/models/project';
 import { CollectionsArray, CollectionsList } from 'app/models/collection';
 import { ActivatedRoute } from '@angular/router';
+import { ConfigService } from 'app/services/config.service';
 
 import { ComplianceTabContentComponent } from 'app/projects/project-detail/compliance//compliance-tab-content.component';
 import { OrderByPipe } from 'app/pipes/filters/order-by.pipe';
+import { HttpClientModule } from '@angular/common/http';
 
 describe('ComplianceTabContentComponent', () => {
   let component: ComplianceTabContentComponent;
@@ -30,7 +32,8 @@ describe('ComplianceTabContentComponent', () => {
     };
     TestBed.configureTestingModule({
       providers: [
-        { provide: ActivatedRoute, useValue: ActivatedRouteStub }
+        { provide: ActivatedRoute, useValue: ActivatedRouteStub },
+        ConfigService
       ],
       declarations: [
         ComplianceTabContentComponent,
@@ -41,7 +44,8 @@ describe('ComplianceTabContentComponent', () => {
         OrderByPipe
       ],
       imports: [
-        RouterTestingModule
+        RouterTestingModule,
+        HttpClientModule
       ]
     })
     .compileComponents();

src/app/projects/project-detail/compliance/compliance-tab-content.component.ts

@@ -5,6 +5,7 @@ import { Subscription } from 'rxjs';
 import { Project } from 'app/models/project';
 import { CollectionsArray } from 'app/models/collection';
 import { LoggerService } from 'app/services/logger.service';
+import { ConfigService } from 'app/services/config.service';
 
 @Component({
   selector: 'app-compliance-tab-content',
@@ -24,7 +25,7 @@ export class ComplianceTabContentComponent implements OnInit, OnDestroy {
   // private fields
   private sub: Subscription;
 
-  constructor(private route: ActivatedRoute, private logger: LoggerService) { }
+  constructor(private route: ActivatedRoute, private logger: LoggerService, private configService: ConfigService) { }
 
   ngOnInit(): void {
     this.loading = true;
@@ -48,6 +49,10 @@ export class ComplianceTabContentComponent implements OnInit, OnDestroy {
     }
   }
 
+  openNRCED() {
+    window.open(this.configService.config['NRCED_LOCATION'] + '/records;project=' + encodeURIComponent(this.project.name), '_blank');
+  }
+
   ngOnDestroy(): void {
     if (this.sub) {
       this.sub.unsubscribe();

src/assets/styles/components/buttons.scss

@@ -41,6 +41,21 @@
     &:disabled {
         pointer-events: none;
     }
+
+    &.fixed-r-btn {
+        padding: 0.25rem 0.5rem;
+        margin-right: 0.25rem;
+
+        i{
+            margin-left: 0.25rem;
+        }
+
+        div.center{
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+    }
 }
 
 .btn-inverted {
@@ -57,7 +72,6 @@ main {
     }
 }
 
-
 // Slide Buttons
 .slide-r-btn,
 .slide-l-btn {

src/env.js

@@ -9,6 +9,7 @@
   window.__env.ENVIRONMENT = 'local';  // local | dev | test | prod
 
   window.__env.API_LOCATION = 'http://localhost:3000';
+  window.__env.NRCED_LOCATION = 'http://localhost:8080';
   window.__env.API_PATH = '/api';
   window.__env.API_PUBLIC_PATH = '/api/public';
   window.__env.GEOCODER_API = 'https://geocoder.api.gov.bc.ca';