From 9bab79fcc936875f09a27b0151ebb75f97a3b404 Mon Sep 17 00:00:00 2001
From: Daniel Bisgrove <daniel@bizz-websites.com>
Date: Mon, 30 Oct 2023 16:40:56 -0400
Subject: [PATCH 1/5] Minor changes to simplify code

---
 .../edit-tool-group-rule/tool-group-rule.component.html   | 2 +-
 .../edit-tool-group/abstract-edit-tool-group.component.ts | 8 +++++---
 .../update-tool-group/update-tool-group.component.ts      | 2 +-
 src/app/components/tool-group/tool-group.component.html   | 6 +++---
 src/styles.css                                            | 2 --
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/app/components/edit-tool-group-rule/tool-group-rule.component.html b/src/app/components/edit-tool-group-rule/tool-group-rule.component.html
index 87f40d93..901e577b 100644
--- a/src/app/components/edit-tool-group-rule/tool-group-rule.component.html
+++ b/src/app/components/edit-tool-group-rule/tool-group-rule.component.html
@@ -1,5 +1,5 @@
 <div class="modal-header">
-  <h5 *ngIf="!isNewRule">{{ ruleType }} rule #{{ rule.id }}</h5>
+  <h5 *ngIf="!isNewRule">{{ ruleType }} rule</h5>
   <h5 *ngIf="isNewRule">New {{ ruleType }} rule</h5>
 </div>
 <div class="modal-body">
diff --git a/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts b/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
index 25acbf14..20efd8a2 100644
--- a/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
@@ -1,5 +1,7 @@
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { Input, Output, EventEmitter } from '@angular/core';
+import { ToolGroupService } from '../../service/tool-group/tool-group.service';
+import { LanguageBCP47 } from '../../service/languages-bcp47-tag.service';
 import {
   CountriesType,
   ToolGroup,
@@ -10,8 +12,6 @@ import {
   RuleType,
   PraxisType,
 } from '../../models/tool-group';
-import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { LanguageBCP47 } from '../../service/languages-bcp47-tag.service';
 
 export abstract class AbstractEditToolGroupComponent {
   @Input() toolGroup: ToolGroup = new ToolGroup();
@@ -90,7 +90,9 @@ export abstract class AbstractEditToolGroupComponent {
       case RuleTypeEnum.LANGUAGE:
         this.languageRule['negative-rule'] = negativeRule;
         break;
-      // Praxis does not have negative rule.
+        case RuleTypeEnum.PRAXIS:
+          this.praxisRule['negative-rule'] = negativeRule
+        break;
     }
   }
 
diff --git a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
index 22230e47..a5106e24 100644
--- a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
@@ -94,7 +94,7 @@ export class UpdateToolGroupComponent
     }
   }
 
-  hasMadeChanges(codes, type): boolean {
+  hasMadeChanges(codes: string[], type: RuleTypeEnum): boolean {
     const values = this.getValues(type);
 
     if (!values.initialRule && (codes || values.negativeRule)) {
diff --git a/src/app/components/tool-group/tool-group.component.html b/src/app/components/tool-group/tool-group.component.html
index 5274018e..0f553a26 100644
--- a/src/app/components/tool-group/tool-group.component.html
+++ b/src/app/components/tool-group/tool-group.component.html
@@ -37,7 +37,7 @@
             <li
               class="list-group-item d-flex justify-content-between align-items-center"
             >
-              Rule #{{ rule.id }}
+              Rule
               <span *ngIf="rule['negative-rule']">(Reverse)</span>
               <button
                 (click)="openRuleModal(rule, 'language')"
@@ -81,7 +81,7 @@
             <li
               class="list-group-item d-flex justify-content-between align-items-center"
             >
-              Rule #{{ rule.id }}
+              Rule
               <span *ngIf="rule['negative-rule']">(Reverse)</span>
               <button
                 (click)="openRuleModal(rule, 'country')"
@@ -126,7 +126,7 @@
             <li
               class="list-group-item d-flex justify-content-between align-items-center"
             >
-              Rule #{{ rule.id }}
+              Rule
               <span *ngIf="rule['negative-rule']">(Reverse)</span>
               <button
                 (click)="openRuleModal(rule, 'praxis')"
diff --git a/src/styles.css b/src/styles.css
index 4af949fc..5b8aea89 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -7,7 +7,6 @@
   overflow-y: auto;
 }
 
-
 /* .card with scroll */
 .card.autoScroll {
   max-height: 500px;
@@ -63,4 +62,3 @@
   background-color:#009cdc;
   box-shadow:0 1px 8px rgba(0,0,0,0.5);
 }
-

From 22c2e1582c3150d1c9ee55512a980d0e3de25fe9 Mon Sep 17 00:00:00 2001
From: Daniel Bisgrove <daniel@bizz-websites.com>
Date: Tue, 31 Oct 2023 08:45:46 -0400
Subject: [PATCH 2/5] Fixing tests

---
 src/app/_tests/toolGroupMocks.ts              | 178 +++++++++---------
 .../tool-group-resource.component.spec.ts     |  11 +-
 ...ool-group-rule-reuseable.component.spec.ts |  16 +-
 .../tool-group-rule.component.spec.ts         |   8 +-
 ...ool-group-tool-reuseable.component.spec.ts |   4 +-
 .../create-tool-group.component.spec.ts       |   9 +-
 .../update-tool-group.component.spec.ts       |  29 +--
 .../tool-group/tool-group.component.spec.ts   |  13 +-
 8 files changed, 141 insertions(+), 127 deletions(-)

diff --git a/src/app/_tests/toolGroupMocks.ts b/src/app/_tests/toolGroupMocks.ts
index 034826d0..effcf370 100644
--- a/src/app/_tests/toolGroupMocks.ts
+++ b/src/app/_tests/toolGroupMocks.ts
@@ -2,94 +2,100 @@ import { LanguageBCP47 } from "../service/languages-bcp47-tag.service";
 import { Resource } from "../models/resource";
 import { CountriesType, ToolGroup } from "../models/tool-group";
 
-export const languageUKMock = {
-  code: 'en-GB',
-  language: 'English',
-  region: 'United Kingdom',
-  name: 'English (British)',
-} as LanguageBCP47;
+export class ToolGroupMocks {
 
-export const languageUSMock = {
-  code: 'en-US',
-  language: 'English',
-  region: 'United States of America',
-  name: 'English (American)',
-} as LanguageBCP47;
+  languageUKMock = {
+    code: 'en-GB',
+    language: 'English',
+    region: 'United Kingdom',
+    name: 'English (British)',
+  } as LanguageBCP47;
 
-export const countryUKMock = {
-  code: 'GB',
-  name: 'United Kingdom',
-  native: 'United Kingdom',
-  phone: [44],
-  continent: 'EU',
-  capital: 'London',
-  currency: ['GBP'],
-  languages: ['en']
-} as CountriesType;
+  languageUSMock = {
+    code: 'en-US',
+    language: 'English',
+    region: 'United States of America',
+    name: 'English (American)',
+  } as LanguageBCP47;
 
-export const countryUSMock = {
-  code: 'US',
-  name: 'United States',
-  native: 'United States',
-  phone: [1],
-  continent: 'NA',
-  capital: 'Washington D.C.',
-  currency: ['USD', 'USN', 'USS'],
-  languages: ['en']
-} as CountriesType;
+  countryUKMock = {
+    code: 'GB',
+    name: 'United Kingdom',
+    native: 'United Kingdom',
+    phone: [44],
+    continent: 'EU',
+    capital: 'London',
+    currency: ['GBP'],
+    languages: ['en']
+  } as CountriesType;
 
-const resource = new Resource();
-resource.id = 13;
-resource.name = 'Test Resource';
+  countryUSMock = {
+    code: 'US',
+    name: 'United States',
+    native: 'United States',
+    phone: [1],
+    continent: 'NA',
+    capital: 'Washington D.C.',
+    currency: ['USD', 'USN', 'USS'],
+    languages: ['en']
+  } as CountriesType;
 
-export const toolGroupFullDetails = {
-  id: 8,
-  'suggestions-weight': '3.0',
-  name: 'Test Tool Group',
-  'rules-country': [
-    {
-      id: 1,
-      'negative-rule': false,
-      'tool-group': {
-        id: 8,
-      },
-      countries: [countryUKMock.code, countryUSMock.code],
-    }
-  ],
-  'rules-language': [
-    {
-      id: 2,
-      'negative-rule': true,
-      'tool-group': {
-        id: 8,
-      },
-      languages: [languageUKMock.code, languageUSMock.code],
-    }
-  ],
-  'rules-praxis': [
-    {
-      id: 3,
-      'negative-rule': false,
-      'tool-group': {
-        id: 8,
-      },
-      confidence: ['1','2'],
-      openness: ['3'],
-    }
-  ],
-  tools: [
-    {
-      id: 17,
-      'suggestions-weight': '12',
-      suggestionsWeight: '12',
-      tool: {
-        ...resource,
-        id: 15,
-        name: 'Resource Name'
-      },
-      'tool-group': {
-        id: 8,
-      },
-    }
-  ],
-} as unknown as ToolGroup;
+
+  toolGroupFullDetails = () => {
+    const resource = new Resource();
+    resource.id = 13;
+    resource.name = 'Test Resource';
+
+    return {
+      id: 8,
+      'suggestions-weight': '3.0',
+      name: 'Test Tool Group',
+      'rules-country': [
+        {
+          id: 1,
+          'negative-rule': false,
+          'tool-group': {
+            id: 8,
+          },
+          countries: [this.countryUKMock.code, this.countryUSMock.code],
+        }
+      ],
+      'rules-language': [
+        {
+          id: 2,
+          'negative-rule': true,
+          'tool-group': {
+            id: 8,
+          },
+          languages: [this.languageUKMock.code, this.languageUSMock.code],
+        }
+      ],
+      'rules-praxis': [
+        {
+          id: 3,
+          'negative-rule': false,
+          'tool-group': {
+            id: 8,
+          },
+          confidence: ['1','2'],
+          openness: ['3'],
+        }
+      ],
+      tools: [
+        {
+          id: 17,
+          'suggestions-weight': '12',
+          suggestionsWeight: '12',
+          tool: {
+            ...resource,
+            id: 15,
+            name: 'Resource Name'
+          },
+          'tool-group': {
+            id: 8,
+          },
+        }
+      ],
+    } as unknown as ToolGroup;
+  }
+}
diff --git a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
index b6fd8ab8..32a1874d 100644
--- a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
+++ b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
@@ -2,16 +2,15 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import * as _ from 'lodash'
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { ResourceService } from '../../service/resource/resource.service';
-import { ToolGroupRule, Tools } from '../../models/tool-group';
 import { Resource } from '../../models/resource';
-import { toolGroupFullDetails } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
 import { ToolGroupResourceComponent } from './tool-group-resource.component';
 import { ToolGroupToolReuseableComponent } from '../edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component';
+import { Tools } from '../../models/tool-group';
 
-fdescribe('ToolGroupResourceComponent', () => {
+describe('ToolGroupResourceComponent', () => {
   let comp: ToolGroupResourceComponent;
   let fixture: ComponentFixture<ToolGroupResourceComponent>;
 
@@ -25,7 +24,6 @@ fdescribe('ToolGroupResourceComponent', () => {
   const activeModalStub = ({
     close() {},
   } as unknown) as NgbActiveModal;
-  const toolGroupRule = new ToolGroupRule()
   const resources = [
     {
       ...new Resource(),
@@ -38,6 +36,8 @@ fdescribe('ToolGroupResourceComponent', () => {
       name: 'Test Resource',
     }
   ]
+  const mocks = new ToolGroupMocks();
+  const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
   beforeEach(() => {
     spyOn(toolGroupServiceStub, 'deleteRule').and.returnValue(
@@ -71,7 +71,6 @@ fdescribe('ToolGroupResourceComponent', () => {
     comp = fixture.componentInstance;
 
 
-
     comp.toolGroup = toolGroupFullDetails
     comp.resources = resources;
   });
diff --git a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
index 7517c971..52279119 100644
--- a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
+++ b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
@@ -1,13 +1,12 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import * as _ from 'lodash'
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { LanguageBCP47Service } from '../../service/languages-bcp47-tag.service';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { RuleTypeEnum, ToolGroup, ToolGroupRule, RulesType, PraxisTypeEnum } from '../../models/tool-group';
 import { ToolGroupRuleReuseableComponent } from './tool-group-rule-reuseable.component';
-import {languageUKMock, countryUKMock, countryUSMock, languageUSMock } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
 
 describe('ToolGroupRuleReuseableComponent', () => {
   let comp: ToolGroupRuleReuseableComponent;
@@ -65,11 +64,12 @@ describe('ToolGroupRuleReuseableComponent', () => {
 
   const toolGroup = new ToolGroup()
   toolGroup.id = 4;
+  const mocks = new ToolGroupMocks();
 
   beforeEach(() => {
     spyOn(languageBCP47ServiceStub, 'getLanguage').and.callFake((code) => {
-      if (code === 'en-GB') return languageUKMock;
-      if (code === 'en-US') return languageUSMock;
+      if (code === 'en-GB') return mocks.languageUKMock;
+      if (code === 'en-US') return mocks.languageUSMock;
     })
 
     TestBed.configureTestingModule({
@@ -115,8 +115,8 @@ describe('ToolGroupRuleReuseableComponent', () => {
         languages: [ 'ca' ],
       })
       expect(comp.selectedItems).toEqual([
-        countryUKMock,
-        countryUSMock
+        mocks.countryUKMock,
+        mocks.countryUSMock
       ])
       expect(comp.name).toEqual('Countries')
     });
@@ -135,8 +135,8 @@ describe('ToolGroupRuleReuseableComponent', () => {
         name: 'Arabic (Saudi Arabia)',
       })
       expect(comp.selectedItems).toEqual([
-        languageUKMock,
-        languageUSMock
+        mocks.languageUKMock,
+        mocks.languageUSMock
       ])
       expect(comp.name).toEqual('Languages')
     });
diff --git a/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts b/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
index 00ce8d60..ea1122e6 100644
--- a/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
+++ b/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
@@ -5,7 +5,7 @@ import * as _ from 'lodash'
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { RuleTypeEnum, ToolGroupRule, RulesType, CountriesType, PraxisTypeEnum, Praxis } from '../../models/tool-group';
-import { countryUKMock, toolGroupFullDetails, countryUSMock } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
 import { ToolGroupRuleReuseableComponent } from '../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { ToolGroupRuleComponent } from './tool-group-rule.component';
 
@@ -18,7 +18,9 @@ describe('ToolGroupRuleComponent', () => {
     createOrUpdateRule() {},
   } as unknown) as ToolGroupService;
 
+  const mocks = new ToolGroupMocks()
   const toolGroupRule = new ToolGroupRule()
+  const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
   beforeEach(() => {
     spyOn(toolGroupServiceStub, 'deleteRule').and.returnValue(
@@ -76,7 +78,7 @@ describe('ToolGroupRuleComponent', () => {
           'tool-group': {
             id: 5,
           },
-          countries: [countryUKMock.code],
+          countries: [mocks.countryUKMock.code],
         },
         {
           code: '9',
@@ -84,7 +86,7 @@ describe('ToolGroupRuleComponent', () => {
           'tool-group': {
             id: 5,
           },
-          countries: [countryUSMock.code],
+          countries: [mocks.countryUSMock.code],
         }
       ] as unknown as CountriesType[]
       comp.updateSelected(selectedItems, null)
diff --git a/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts b/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
index 51fbd400..5bedcc42 100644
--- a/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
+++ b/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
@@ -3,7 +3,7 @@ import { FormsModule } from '@angular/forms';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { Resource } from '../../models/resource';
-import { toolGroupFullDetails } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
 import { ToolGroupToolReuseableComponent } from './tool-group-tool-reuseable.component';
 
 
@@ -23,6 +23,8 @@ describe('ToolGroupToolReuseableComponent', () => {
       name: 'Test Resource',
     }
   ]
+  const mocks = new ToolGroupMocks();
+  const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
   beforeEach(() => {
     TestBed.configureTestingModule({
diff --git a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
index 11ba9dbe..062e483e 100644
--- a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
+++ b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
@@ -6,7 +6,7 @@ import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
 import { LanguageBCP47Service } from '../../../service/languages-bcp47-tag.service';
 import { RuleTypeEnum, ToolGroup, ToolGroupRule } from '../../../models/tool-group';
-import {languageUKMock, countryUKMock } from '../../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../../_tests/toolGroupMocks'
 import { ToolGroupRuleReuseableComponent } from '../../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { CreateToolGroupComponent } from './create-tool-group.component';
 
@@ -26,6 +26,7 @@ describe('CreateToolGroupComponent', () => {
   const toolGroup = new ToolGroup()
   const toolGroupRule = new ToolGroupRule()
   const createdToolGroupID = 16;
+  const mocks = new ToolGroupMocks()
 
   beforeEach(() => {
     spyOn(toolGroupServiceStub, 'createOrUpdateToolGroup').and.returnValue(
@@ -38,7 +39,7 @@ describe('CreateToolGroupComponent', () => {
       Promise.resolve<ToolGroupRule>(toolGroupRule),
     );
     spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      languageUKMock,
+      mocks.languageUKMock,
     );
 
     TestBed.configureTestingModule({
@@ -68,7 +69,7 @@ describe('CreateToolGroupComponent', () => {
   });
 
   it('creates Country Rule', (done) => {
-    comp.selectedCountries = [countryUKMock]
+    comp.selectedCountries = [mocks.countryUKMock]
     comp.countryRule['negative-rule'] = true
     fixture.debugElement
       .query(By.css('.btn.btn-success'))
@@ -83,7 +84,7 @@ describe('CreateToolGroupComponent', () => {
   });
 
   it('creates Language Rule', (done) => {
-    comp.selectedLanguages = [languageUKMock]
+    comp.selectedLanguages = [mocks.languageUKMock]
     comp.languageRule['negative-rule'] = false
     fixture.debugElement
       .query(By.css('.btn.btn-success'))
diff --git a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
index 1db10af6..7d00b289 100644
--- a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
+++ b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
@@ -3,11 +3,10 @@ import { FormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import * as _ from 'lodash'
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
 import { LanguageBCP47Service } from '../../../service/languages-bcp47-tag.service';
 import { RuleTypeEnum, ToolGroup, ToolGroupRule } from '../../../models/tool-group';
-import {languageUKMock, countryUKMock, toolGroupFullDetails, countryUSMock, languageUSMock } from '../../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../../_tests/toolGroupMocks'
 import { ToolGroupRuleReuseableComponent } from '../../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { UpdateToolGroupComponent } from './update-tool-group.component';
 
@@ -23,6 +22,8 @@ describe('UpdateToolGroupComponent', () => {
     getLanguage() {},
   } as unknown) as LanguageBCP47Service;
 
+  const mocks = new ToolGroupMocks()
+
   const toolGroup = new ToolGroup()
   const toolGroupRule = new ToolGroupRule()
   const createdToolGroupID = 16;
@@ -38,7 +39,7 @@ describe('UpdateToolGroupComponent', () => {
       Promise.resolve<ToolGroupRule>(toolGroupRule),
     );
     spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      languageUKMock,
+      mocks.languageUKMock,
     );
 
     TestBed.configureTestingModule({
@@ -56,7 +57,7 @@ describe('UpdateToolGroupComponent', () => {
 
     fixture = TestBed.createComponent(UpdateToolGroupComponent);
     comp = fixture.componentInstance;
-    comp.toolGroup = toolGroupFullDetails
+    comp.toolGroup = mocks.toolGroupFullDetails();
   });
 
   it('should not update as no changes were made', () => {
@@ -75,12 +76,12 @@ describe('UpdateToolGroupComponent', () => {
       comp.ngOnInit()
       comp.toolGroup.name = 'New Name';
       comp.selectedCountries = [
-        countryUKMock,
-        countryUSMock
+        mocks.countryUKMock,
+        mocks.countryUSMock
       ]
       comp.selectedLanguages = [
-        languageUKMock,
-        languageUSMock
+        mocks.languageUKMock,
+        mocks.languageUSMock
       ]
       comp.selectedPraxisConfidence = [
         {
@@ -112,7 +113,7 @@ describe('UpdateToolGroupComponent', () => {
 
     it('should update Country rule', () => {
       comp.selectedCountries = [
-        countryUKMock,
+        mocks.countryUKMock,
       ]
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
@@ -122,7 +123,7 @@ describe('UpdateToolGroupComponent', () => {
         comp.toolGroup.id,
         comp.countryRule.id,
         comp.countryRule['negative-rule'],
-        [countryUKMock.code],
+        [mocks.countryUKMock.code],
         RuleTypeEnum.COUNTRY,
       );
     });
@@ -137,14 +138,14 @@ describe('UpdateToolGroupComponent', () => {
         comp.toolGroup.id,
         comp.countryRule.id,
         comp.countryRule['negative-rule'],
-        [countryUKMock.code, countryUSMock.code],
+        [mocks.countryUKMock.code, mocks.countryUSMock.code],
         RuleTypeEnum.COUNTRY,
       );
     });
 
     it('should update Langauge rule', () => {
       comp.selectedLanguages = [
-        languageUSMock
+        mocks.languageUSMock
       ]
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
@@ -154,7 +155,7 @@ describe('UpdateToolGroupComponent', () => {
         comp.toolGroup.id,
         comp.languageRule.id,
         comp.languageRule['negative-rule'],
-        [languageUSMock.code],
+        [mocks.languageUSMock.code],
         RuleTypeEnum.LANGUAGE,
       );
     });
@@ -169,7 +170,7 @@ describe('UpdateToolGroupComponent', () => {
         comp.toolGroup.id,
         comp.languageRule.id,
         comp.languageRule['negative-rule'],
-        [languageUKMock.code, languageUSMock.code],
+        [mocks.languageUKMock.code, mocks.languageUSMock.code],
         RuleTypeEnum.LANGUAGE,
       );
     });
diff --git a/src/app/components/tool-group/tool-group.component.spec.ts b/src/app/components/tool-group/tool-group.component.spec.ts
index 65c03c94..e7f97246 100644
--- a/src/app/components/tool-group/tool-group.component.spec.ts
+++ b/src/app/components/tool-group/tool-group.component.spec.ts
@@ -4,7 +4,7 @@ import { NgbModal, NgbModalRef, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { LanguageBCP47Service } from '../../service/languages-bcp47-tag.service';
 import { CountryRule, LanguageRule, ToolGroup, ToolGroupRule } from '../..//models/tool-group';
-import { languageUKMock, toolGroupFullDetails } from '../../_tests/toolGroupMocks';
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupsComponent } from '../tool-groups/tool-groups.component';
 import { ToolGroupComponent } from './tool-group.component';
 
@@ -32,6 +32,7 @@ describe('ResourceComponent', () => {
     open() {},
   } as unknown) as NgbModal;
 
+  const mocks = new ToolGroupMocks();
   const toolGroup: ToolGroup = new ToolGroup();
   toolGroup.id = 8
   const rule: ToolGroupRule = new ToolGroupRule();
@@ -43,7 +44,7 @@ describe('ResourceComponent', () => {
   rule['tool-group'] = {
     ...toolGroup,
   }
-
+  const toolGroupFullDetails = mocks.toolGroupFullDetails();
   const modalRef = ({
     componentInstance: {
       source: null,
@@ -54,7 +55,7 @@ describe('ResourceComponent', () => {
 
   beforeEach(async(() => {
     spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      languageUKMock,
+      mocks.languageUKMock,
     );
     spyOn(toolGroupServiceStub, 'getToolGroup').and.returnValue(
       Promise.resolve(toolGroupFullDetails),
@@ -101,7 +102,9 @@ describe('ResourceComponent', () => {
 
   describe('openUpdateModal', () => {
     it('should call loadAllDetails()', (done) => {
-      spyOn(comp, 'loadAllDetails')
+      spyOn(comp, 'loadAllDetails').and.returnValue(
+        Promise.resolve(toolGroupFullDetails),
+      )
       comp.openUpdateModal()
 
       setTimeout(() => {
@@ -154,7 +157,7 @@ describe('ResourceComponent', () => {
   describe('getReadableValue Languages', () => {
     it('should return UK language', () => {
       const value = comp.getReadableValue('en-GB', 'language', null)
-      expect(value).toEqual(languageUKMock);
+      expect(value).toEqual(mocks.languageUKMock);
     });
   });
 

From 182e5291ebefaa1e08515de1462cbcf064563383 Mon Sep 17 00:00:00 2001
From: Daniel Bisgrove <daniel@bizz-websites.com>
Date: Tue, 31 Oct 2023 12:21:43 -0400
Subject: [PATCH 3/5] Fixing tests and Prettier and EsLint issues

---
 src/app/_tests/toolGroupMocks.ts              |  54 +--
 src/app/app.module.ts                         |   2 -
 .../tool-group-resource.component.spec.ts     |  80 ++---
 ...ool-group-rule-reuseable.component.spec.ts | 177 +++++----
 .../tool-group-rule-reuseable.component.ts    |  43 ++-
 .../tool-group-rule.component.spec.ts         |  92 ++---
 .../tool-group-rule.component.ts              |   7 +-
 ...ool-group-tool-reuseable.component.spec.ts |  25 +-
 .../abstract-edit-tool-group.component.ts     |  16 +-
 .../create-tool-group.component.spec.ts       | 103 ++++--
 .../create-tool-group.component.ts            |  13 +-
 .../update-tool-group.component.spec.ts       |  71 ++--
 .../update-tool-group.component.ts            |  64 ++--
 .../tool-group/tool-group.component.spec.ts   | 125 ++++---
 .../tool-group/tool-group.component.ts        |   7 +-
 .../tool-groups/tool-groups.component.spec.ts |  20 +-
 .../tool-groups/tool-groups.component.ts      |   9 +-
 src/app/models/tool-group.ts                  |   6 +-
 .../service/languages-bcp47-tag.service.ts    | 339 ------------------
 .../tool-group/tool-group.service.spec.ts     | 148 ++++----
 .../service/tool-group/tool-group.service.ts  |  43 +--
 21 files changed, 576 insertions(+), 868 deletions(-)
 delete mode 100644 src/app/service/languages-bcp47-tag.service.ts

diff --git a/src/app/_tests/toolGroupMocks.ts b/src/app/_tests/toolGroupMocks.ts
index effcf370..a543d913 100644
--- a/src/app/_tests/toolGroupMocks.ts
+++ b/src/app/_tests/toolGroupMocks.ts
@@ -1,22 +1,23 @@
-import { LanguageBCP47 } from "../service/languages-bcp47-tag.service";
-import { Resource } from "../models/resource";
-import { CountriesType, ToolGroup } from "../models/tool-group";
+import { Language } from '../models/language';
+import { Resource } from '../models/resource';
+import { CountriesType, ToolGroup } from '../models/tool-group';
 
 export class ToolGroupMocks {
-
   languageUKMock = {
     code: 'en-GB',
-    language: 'English',
-    region: 'United Kingdom',
     name: 'English (British)',
-  } as LanguageBCP47;
+    id: 5,
+    customPages: null,
+    canConfirmDelete: null,
+  } as Language;
 
   languageUSMock = {
     code: 'en-US',
-    language: 'English',
-    region: 'United States of America',
     name: 'English (American)',
-  } as LanguageBCP47;
+    id: 2,
+    customPages: null,
+    canConfirmDelete: null,
+  } as Language;
 
   countryUKMock = {
     code: 'GB',
@@ -26,7 +27,7 @@ export class ToolGroupMocks {
     continent: 'EU',
     capital: 'London',
     currency: ['GBP'],
-    languages: ['en']
+    languages: ['en'],
   } as CountriesType;
 
   countryUSMock = {
@@ -37,16 +38,27 @@ export class ToolGroupMocks {
     continent: 'NA',
     capital: 'Washington D.C.',
     currency: ['USD', 'USN', 'USS'],
-    languages: ['en']
+    languages: ['en'],
   } as CountriesType;
 
+  getLanguagesResponse = [
+    {
+      code: 'ar-SA',
+      name: 'Arabic (Saudi Arabia)',
+      id: 9,
+      customPages: null,
+      canConfirmDelete: null,
+    },
+    this.languageUKMock,
+    this.languageUSMock,
+  ] as Language[];
 
   toolGroupFullDetails = () => {
     const resource = new Resource();
     resource.id = 13;
     resource.name = 'Test Resource';
 
-    return {
+    return ({
       id: 8,
       'suggestions-weight': '3.0',
       name: 'Test Tool Group',
@@ -58,7 +70,7 @@ export class ToolGroupMocks {
             id: 8,
           },
           countries: [this.countryUKMock.code, this.countryUSMock.code],
-        }
+        },
       ],
       'rules-language': [
         {
@@ -68,7 +80,7 @@ export class ToolGroupMocks {
             id: 8,
           },
           languages: [this.languageUKMock.code, this.languageUSMock.code],
-        }
+        },
       ],
       'rules-praxis': [
         {
@@ -77,9 +89,9 @@ export class ToolGroupMocks {
           'tool-group': {
             id: 8,
           },
-          confidence: ['1','2'],
+          confidence: ['1', '2'],
           openness: ['3'],
-        }
+        },
       ],
       tools: [
         {
@@ -89,13 +101,13 @@ export class ToolGroupMocks {
           tool: {
             ...resource,
             id: 15,
-            name: 'Resource Name'
+            name: 'Resource Name',
           },
           'tool-group': {
             id: 8,
           },
-        }
+        },
       ],
-    } as unknown as ToolGroup;
-  }
+    } as unknown) as ToolGroup;
+  };
 }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index e77c947e..650590e7 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -58,7 +58,6 @@ import { ToolGroupsComponent } from './components/tool-groups/tool-groups.compon
 import { ToolGroupService } from './service/tool-group/tool-group.service';
 import { CreateToolGroupComponent } from './components/edit-tool-group/create-tool-group/create-tool-group.component';
 import { ToolGroupComponent } from './components/tool-group/tool-group.component';
-import { LanguageBCP47Service } from './service/languages-bcp47-tag.service';
 import { UpdateToolGroupComponent } from './components/edit-tool-group/update-tool-group/update-tool-group.component';
 import { ToolGroupRuleComponent } from './components/edit-tool-group-rule/tool-group-rule.component';
 import { ToolGroupRuleReuseableComponent } from './components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
@@ -132,7 +131,6 @@ import { ToolGroupResourceComponent } from './components/edit-tool-group-resourc
     UserAuthSessionService,
     AttributeTranslationService,
     ToolGroupService,
-    LanguageBCP47Service,
   ],
   entryComponents: [
     UpdateResourceComponent,
diff --git a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
index 32a1874d..8d26b4e4 100644
--- a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
+++ b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
@@ -5,7 +5,7 @@ import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { ResourceService } from '../../service/resource/resource.service';
 import { Resource } from '../../models/resource';
-import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupResourceComponent } from './tool-group-resource.component';
 import { ToolGroupToolReuseableComponent } from '../edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component';
 import { Tools } from '../../models/tool-group';
@@ -34,8 +34,8 @@ describe('ToolGroupResourceComponent', () => {
       ...new Resource(),
       id: 13,
       name: 'Test Resource',
-    }
-  ]
+    },
+  ];
   const mocks = new ToolGroupMocks();
   const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
@@ -63,95 +63,89 @@ describe('ToolGroupResourceComponent', () => {
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
         { provide: ResourceService, useValue: resourceServiceStub },
-        { provide: NgbActiveModal, useValue: activeModalStub  },
+        { provide: NgbActiveModal, useValue: activeModalStub },
       ],
     }).compileComponents();
 
     fixture = TestBed.createComponent(ToolGroupResourceComponent);
     comp = fixture.componentInstance;
 
-
-    comp.toolGroup = toolGroupFullDetails
+    comp.toolGroup = toolGroupFullDetails;
     comp.resources = resources;
   });
 
   describe('ngOnInit', () => {
-
     it('should assign tools', () => {
       comp.ngOnInit();
-      expect(comp.initialTools).toEqual(toolGroupFullDetails.tools)
-      expect(comp.tools).toEqual(toolGroupFullDetails.tools)
+      expect(comp.initialTools).toEqual(toolGroupFullDetails.tools);
+      expect(comp.tools).toEqual(toolGroupFullDetails.tools);
     });
 
     it('should create new Tool', () => {
-      comp.toolGroup.tools = []
+      comp.toolGroup.tools = [];
       comp.ngOnInit();
-      expect(comp.initialTools).toEqual([])
-      expect(comp.tools[0].tool).toEqual(undefined)
+      expect(comp.initialTools).toEqual([]);
+      expect(comp.tools[0].tool).toEqual(undefined);
     });
 
-
     it('should re-fetch resources', () => {
-      comp.resources = []
+      comp.resources = [];
       comp.ngOnInit();
       expect(resourceServiceStub.getResources).toHaveBeenCalled();
     });
   });
 
   describe('updateTool() & deleteTool()', () => {
-    const tool = toolGroupFullDetails.tools[0] as unknown as Tools;
+    const tool = (toolGroupFullDetails.tools[0] as unknown) as Tools;
     beforeEach(() => {
       comp.ngOnInit();
       comp.tools = [
         {
-          ...tool
+          ...tool,
         },
         {
           ...tool,
           id: '5',
-        }
-      ]
-    })
+        },
+      ];
+    });
 
     it('should update suggestionsWeight - updateTool()', (done) => {
       tool.suggestionsWeight = '50';
       comp.updateTool(tool);
       setTimeout(() => {
-        console.log('comp.tools', comp.tools)
-        expect(comp.tools[0].suggestionsWeight).toEqual('50')
-        done()
-      })
+        console.log('comp.tools', comp.tools);
+        expect(comp.tools[0].suggestionsWeight).toEqual('50');
+        done();
+      });
     });
 
     it('should delete tool - deleteTool()', () => {
-      expect(comp.tools.length).toEqual(2)
+      expect(comp.tools.length).toEqual(2);
       comp.deleteTool('5');
-      expect(comp.tools.length).toEqual(1)
+      expect(comp.tools.length).toEqual(1);
     });
-
   });
 
-
-
   describe('createOrUpdate()', () => {
-    const tool = toolGroupFullDetails.tools[0] as unknown as Tools;
+    const tool = (toolGroupFullDetails.tools[0] as unknown) as Tools;
     beforeEach(() => {
       comp.ngOnInit();
-    })
+    });
 
     it('should create one tool and update another', (done) => {
       comp.tools = [
         {
-          ...tool
+          ...tool,
         },
         {
           ...tool,
           id: '5',
-        }
-      ]
+        },
+      ];
       comp.createOrUpdate();
       setTimeout(() => {
-        expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledTimes(2)
+        expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledTimes(2);
         // Second request
         expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledWith(
           comp.toolGroup.id,
@@ -159,28 +153,28 @@ describe('ToolGroupResourceComponent', () => {
           comp.tools[1].tool.id.toString(),
           comp.tools[1].suggestionsWeight,
           false,
-        )
+        );
         expect(activeModalStub.close).toHaveBeenCalled();
-        done()
-      })
+        done();
+      });
     });
 
     it('should just update one tool', (done) => {
-      comp.initialTools = [tool]
-      comp.tools = [tool]
+      comp.initialTools = [tool];
+      comp.tools = [tool];
       comp.createOrUpdate();
       setTimeout(() => {
-        expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledTimes(1)
+        expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledTimes(1);
         expect(toolGroupServiceStub.addOrUpdateTool).toHaveBeenCalledWith(
           comp.toolGroup.id,
           comp.tools[0].id,
           comp.tools[0].tool.id.toString(),
           comp.tools[0].suggestionsWeight,
           true,
-        )
+        );
         expect(activeModalStub.close).toHaveBeenCalled();
-        done()
-      })
+        done();
+      });
     });
   });
 });
diff --git a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
index 52279119..63cbaa93 100644
--- a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
+++ b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.spec.ts
@@ -2,11 +2,18 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { NgArrayPipesModule } from 'ngx-pipes';
-import { LanguageBCP47Service } from '../../service/languages-bcp47-tag.service';
+import { LanguageService } from '../../service/language.service';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { RuleTypeEnum, ToolGroup, ToolGroupRule, RulesType, PraxisTypeEnum } from '../../models/tool-group';
+import { Language } from '../../models/language';
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
+import {
+  RuleTypeEnum,
+  ToolGroup,
+  ToolGroupRule,
+  RulesType,
+  PraxisTypeEnum,
+} from '../../models/tool-group';
 import { ToolGroupRuleReuseableComponent } from './tool-group-rule-reuseable.component';
-import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
 
 describe('ToolGroupRuleReuseableComponent', () => {
   let comp: ToolGroupRuleReuseableComponent;
@@ -15,71 +22,49 @@ describe('ToolGroupRuleReuseableComponent', () => {
   const toolGroupServiceStub = ({
     praxisConfidentData: {
       0: {
-        name: 'Confidence 1'
+        name: 'Confidence 1',
       },
       1: {
-        name: 'Confidence 2'
+        name: 'Confidence 2',
       },
       2: {
-        name: 'Confidence 3'
-      }
+        name: 'Confidence 3',
+      },
     },
     praxisOpennessData: {
       0: {
-        name: 'Openness 1'
+        name: 'Openness 1',
       },
       1: {
-        name: 'Openness 2'
+        name: 'Openness 2',
       },
       2: {
-        name: 'Openness 3'
-      }
-    }
+        name: 'Openness 3',
+      },
+    },
   } as unknown) as ToolGroupService;
-  const languageBCP47ServiceStub = ({
-    getLanguage() {},
-    getLanguages(){
-      return [
-        {
-          code: 'ar-SA',
-          language: 'Arabic',
-          region: 'Saudi Arabia',
-          name: 'Arabic (Saudi Arabia)',
-        },
-        {
-          code: 'en-US',
-          language: 'English',
-          region: 'United States',
-          name: 'English (United States)',
-        },
-        {
-          code: 'en-GB',
-          language: 'English',
-          region: 'United Kingdom',
-          name: 'English (British)',
-        },
-      ]
-    }
-  } as unknown) as LanguageBCP47Service;
+  const mocks = new ToolGroupMocks();
+
+  const languageServiceStub = ({
+    getLanguages() {
+      return mocks.getLanguagesResponse;
+    },
+  } as unknown) as LanguageService;
 
-  const toolGroup = new ToolGroup()
+  const toolGroup = new ToolGroup();
   toolGroup.id = 4;
-  const mocks = new ToolGroupMocks();
 
   beforeEach(() => {
-    spyOn(languageBCP47ServiceStub, 'getLanguage').and.callFake((code) => {
-      if (code === 'en-GB') return mocks.languageUKMock;
-      if (code === 'en-US') return mocks.languageUSMock;
-    })
+    spyOn(languageServiceStub, 'getLanguages').and.returnValue(
+      Promise.resolve<Language[]>(mocks.getLanguagesResponse),
+    );
 
     TestBed.configureTestingModule({
-      declarations: [
-        ToolGroupRuleReuseableComponent,
-      ],
+      declarations: [ToolGroupRuleReuseableComponent],
       imports: [NgbModule.forRoot(), FormsModule, NgArrayPipesModule],
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
-        { provide: LanguageBCP47Service, useValue: languageBCP47ServiceStub },
+        { provide: LanguageService, useValue: languageServiceStub },
         { provide: NgbActiveModal },
       ],
     }).compileComponents();
@@ -95,94 +80,98 @@ describe('ToolGroupRuleReuseableComponent', () => {
       toolGroupRule = new ToolGroupRule();
       toolGroupRule.id = 5;
       toolGroupRule['tool-group'] = toolGroup;
-    })
+    });
 
     it('should assign the country data', () => {
-      toolGroupRule.countries = ['GB', 'US']
+      toolGroupRule.countries = ['GB', 'US'];
       comp.rule = toolGroupRule as RulesType;
-      comp.ruleType = RuleTypeEnum.COUNTRY
-      comp.praxisType = undefined
-      comp.ngOnInit()
+      comp.ruleType = RuleTypeEnum.COUNTRY;
+      comp.praxisType = undefined;
+      comp.ngOnInit();
 
       expect(comp.items[0]).toEqual({
         code: 'AD',
         name: 'Andorra',
         native: 'Andorra',
-        phone: [ 376 ],
+        phone: [376],
         continent: 'EU',
         capital: 'Andorra la Vella',
-        currency: [ 'EUR' ],
-        languages: [ 'ca' ],
-      })
+        currency: ['EUR'],
+        languages: ['ca'],
+      });
       expect(comp.selectedItems).toEqual([
         mocks.countryUKMock,
-        mocks.countryUSMock
-      ])
-      expect(comp.name).toEqual('Countries')
+        mocks.countryUSMock,
+      ]);
+      expect(comp.name).toEqual('Countries');
     });
 
-    it('should assign the language data', () => {
-      toolGroupRule.languages = ['en-GB', 'en-US']
+    it('should assign the language data', (done) => {
+      toolGroupRule.languages = ['en-GB', 'en-US'];
       comp.rule = toolGroupRule as RulesType;
-      comp.ruleType = RuleTypeEnum.LANGUAGE
-      comp.praxisType = undefined
-      comp.ngOnInit()
+      comp.ruleType = RuleTypeEnum.LANGUAGE;
+      comp.praxisType = undefined;
+      comp.ngOnInit();
 
-      expect(comp.items[0]).toEqual({
-        code: 'ar-SA',
-        language: 'Arabic',
-        region: 'Saudi Arabia',
-        name: 'Arabic (Saudi Arabia)',
-      })
-      expect(comp.selectedItems).toEqual([
-        mocks.languageUKMock,
-        mocks.languageUSMock
-      ])
-      expect(comp.name).toEqual('Languages')
+      setTimeout(() => {
+        expect(comp.items[0]).toEqual({
+          code: 'ar-SA',
+          name: 'Arabic (Saudi Arabia)',
+          id: 9,
+          customPages: null,
+          canConfirmDelete: null,
+        });
+        expect(comp.selectedItems).toEqual([
+          mocks.languageUKMock,
+          mocks.languageUSMock,
+        ]);
+        expect(comp.name).toEqual('Languages');
+        done();
+      });
     });
 
     it('should assign the praxis confidence data', () => {
-      toolGroupRule.confidence = ['0','2']
+      toolGroupRule.confidence = ['0', '2'];
       comp.rule = toolGroupRule as RulesType;
-      comp.ruleType = RuleTypeEnum.PRAXIS
-      comp.praxisType = PraxisTypeEnum.CONFIDENCE
-      comp.ngOnInit()
+      comp.ruleType = RuleTypeEnum.PRAXIS;
+      comp.praxisType = PraxisTypeEnum.CONFIDENCE;
+      comp.ngOnInit();
 
       expect(comp.items[0]).toEqual({
         code: '0',
-        name: 'Confidence 1'
-      })
+        name: 'Confidence 1',
+      });
       expect(comp.selectedItems).toEqual([
         {
           code: '0',
-          name: 'Confidence 1'
+          name: 'Confidence 1',
         },
         {
           code: '2',
           name: 'Confidence 3',
-        }
-      ])
-      expect(comp.name).toEqual('Confidence')
+        },
+      ]);
+      expect(comp.name).toEqual('Confidence');
     });
 
     it('should assign the praxis openness data', () => {
-      toolGroupRule.openness = ['1']
+      toolGroupRule.openness = ['1'];
       comp.rule = toolGroupRule as RulesType;
-      comp.ruleType = RuleTypeEnum.PRAXIS
-      comp.praxisType = PraxisTypeEnum.OPENNESS
-      comp.ngOnInit()
+      comp.ruleType = RuleTypeEnum.PRAXIS;
+      comp.praxisType = PraxisTypeEnum.OPENNESS;
+      comp.ngOnInit();
 
       expect(comp.items[0]).toEqual({
         code: '0',
-        name: 'Openness 1'
-      })
+        name: 'Openness 1',
+      });
       expect(comp.selectedItems).toEqual([
         {
           code: '1',
-          name: 'Openness 2'
+          name: 'Openness 2',
         },
-      ])
-      expect(comp.name).toEqual('Openness')
+      ]);
+      expect(comp.name).toEqual('Openness');
     });
   });
 });
diff --git a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.ts b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.ts
index dade117c..a5f75aa7 100644
--- a/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.ts
+++ b/src/app/components/edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component.ts
@@ -10,15 +10,13 @@ import {
 } from '../../models/tool-group';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { countries } from 'countries-list';
-import {
-  LanguageBCP47Service,
-  LanguageBCP47,
-} from '../../service/languages-bcp47-tag.service';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
+import { LanguageService } from '../../service/language.service';
+import { Language } from '../../models/language';
 
 type Item =
-  | (LanguageBCP47 & CountriesType & Praxis)
-  | (CountriesType & Praxis & LanguageBCP47);
+  | (Language & CountriesType & Praxis)
+  | (CountriesType & Praxis & Language);
 
 @Component({
   selector: 'admin-tool-group-rule-reuseable',
@@ -32,20 +30,20 @@ export class ToolGroupRuleReuseableComponent implements OnInit {
   @Input() ruleType: RuleTypeEnum;
   @Input() praxisType: PraxisTypeEnum;
   @Output() selectedItemsEmit = new EventEmitter<
-    (LanguageBCP47 | CountriesType | Praxis)[]
+    (Language | CountriesType | Praxis)[]
   >();
   @Output() negativeRuleOutput = new EventEmitter<boolean>();
-  selectedItems: (LanguageBCP47 | CountriesType | Praxis)[] = [];
+  selectedItems: (Language | CountriesType | Praxis)[] = [];
   negativeRule = false;
   negativeInputId: number;
-  items: (LanguageBCP47 | CountriesType | Praxis)[];
-  selectedItem: LanguageBCP47 | CountriesType | Praxis;
+  items: (Language | CountriesType | Praxis)[];
+  selectedItem: Language | CountriesType | Praxis;
   name: string;
   errorMessage: string;
 
   constructor(
     protected activeModal: NgbActiveModal,
-    protected languageBCP47Service: LanguageBCP47Service,
+    protected languageService: LanguageService,
     protected toolGroupService: ToolGroupService,
   ) {}
 
@@ -67,15 +65,22 @@ export class ToolGroupRuleReuseableComponent implements OnInit {
             return this.items.find((country) => country.code === countryCode);
           }) as unknown) as CountriesType[];
         }
+        this.selectedItemsEmit.emit(this.selectedItems);
         break;
       case RuleTypeEnum.LANGUAGE:
         this.name = 'Languages';
-        this.items = this.languageBCP47Service.getLanguages();
-        if (this.rule.languages) {
-          this.selectedItems = this.rule.languages.map((langCode) => {
-            return this.languageBCP47Service.getLanguage(langCode);
-          });
-        }
+        this.languageService.getLanguages().then((items) => {
+          this.items = items;
+          if (this.rule.languages) {
+            this.selectedItems = this.rule.languages.map((langCode) => {
+              return (
+                this.items.find((item) => item.code === langCode) ||
+                ((langCode as unknown) as Language)
+              );
+            });
+          }
+          this.selectedItemsEmit.emit(this.selectedItems);
+        });
         break;
       case RuleTypeEnum.PRAXIS:
         switch (this.praxisType) {
@@ -116,9 +121,9 @@ export class ToolGroupRuleReuseableComponent implements OnInit {
             }
             break;
         }
+        this.selectedItemsEmit.emit(this.selectedItems);
         break;
     }
-    this.selectedItemsEmit.emit(this.selectedItems);
   }
 
   handleSelectedItem(event) {
@@ -133,7 +138,7 @@ export class ToolGroupRuleReuseableComponent implements OnInit {
   handleDeleteSelectedItem(selecteditem: Item): void {
     this.selectedItems = (this.selectedItems.filter(
       (item) => item.code !== selecteditem.code,
-    ) as unknown) as LanguageBCP47[] | CountriesType[];
+    ) as unknown) as Language[] | CountriesType[];
     this.selectedItemsEmit.emit(this.selectedItems);
   }
 
diff --git a/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts b/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
index ea1122e6..f91d96a9 100644
--- a/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
+++ b/src/app/components/edit-tool-group-rule/tool-group-rule.component.spec.ts
@@ -1,11 +1,18 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import * as _ from 'lodash'
+import * as _ from 'lodash';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { RuleTypeEnum, ToolGroupRule, RulesType, CountriesType, PraxisTypeEnum, Praxis } from '../../models/tool-group';
-import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
+import {
+  RuleTypeEnum,
+  ToolGroupRule,
+  RulesType,
+  CountriesType,
+  PraxisTypeEnum,
+  Praxis,
+} from '../../models/tool-group';
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupRuleReuseableComponent } from '../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { ToolGroupRuleComponent } from './tool-group-rule.component';
 
@@ -18,8 +25,8 @@ describe('ToolGroupRuleComponent', () => {
     createOrUpdateRule() {},
   } as unknown) as ToolGroupService;
 
-  const mocks = new ToolGroupMocks()
-  const toolGroupRule = new ToolGroupRule()
+  const mocks = new ToolGroupMocks();
+  const toolGroupRule = new ToolGroupRule();
   const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
   beforeEach(() => {
@@ -33,10 +40,7 @@ describe('ToolGroupRuleComponent', () => {
     );
 
     TestBed.configureTestingModule({
-      declarations: [
-        ToolGroupRuleComponent,
-        ToolGroupRuleReuseableComponent,
-      ],
+      declarations: [ToolGroupRuleComponent, ToolGroupRuleReuseableComponent],
       imports: [NgbModule.forRoot(), FormsModule, NgArrayPipesModule],
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
@@ -67,11 +71,10 @@ describe('ToolGroupRuleComponent', () => {
     });
   });
 
-
   describe('updateSelected()', () => {
     it('should set Countries data', () => {
-      comp.ngOnInit()
-      const selectedItems = [
+      comp.ngOnInit();
+      const selectedItems = ([
         {
           code: '5',
           'negative-rule': true,
@@ -87,50 +90,50 @@ describe('ToolGroupRuleComponent', () => {
             id: 5,
           },
           countries: [mocks.countryUSMock.code],
-        }
-      ] as unknown as CountriesType[]
-      comp.updateSelected(selectedItems, null)
+        },
+      ] as unknown) as CountriesType[];
+      comp.updateSelected(selectedItems, null);
 
-      expect(comp.rule.countries).toEqual(['5','9'])
-      expect(comp.ruleData).toEqual(['5','9'])
+      expect(comp.rule.countries).toEqual(['5', '9']);
+      expect(comp.ruleData).toEqual(['5', '9']);
     });
 
     it('should set Praxis - confidence data', () => {
       comp.ruleType = RuleTypeEnum.PRAXIS;
-      comp.ngOnInit()
-      const selectedItems = [
+      comp.ngOnInit();
+      const selectedItems = ([
         {
           code: '1',
-          name: 'test one'
+          name: 'test one',
         },
         {
           code: '3',
-          name: 'test three'
-        }
-      ] as unknown as Praxis[]
-      comp.updateSelected(selectedItems, PraxisTypeEnum.CONFIDENCE)
+          name: 'test three',
+        },
+      ] as unknown) as Praxis[];
+      comp.updateSelected(selectedItems, PraxisTypeEnum.CONFIDENCE);
 
-      expect(comp.rule.confidence).toEqual(['1','3'])
-      expect(comp.ruleData.confidence).toEqual(['1','3'])
+      expect(comp.rule.confidence).toEqual(['1', '3']);
+      expect(comp.ruleData.confidence).toEqual(['1', '3']);
     });
 
     it('should set Praxis - openness data', () => {
       comp.ruleType = RuleTypeEnum.PRAXIS;
-      comp.ngOnInit()
-      const selectedItems = [
+      comp.ngOnInit();
+      const selectedItems = ([
         {
           code: '2',
-          name: 'test two'
+          name: 'test two',
         },
         {
           code: '4',
-          name: 'test four'
-        }
-      ] as unknown as Praxis[]
-      comp.updateSelected(selectedItems, PraxisTypeEnum.OPENNESS)
+          name: 'test four',
+        },
+      ] as unknown) as Praxis[];
+      comp.updateSelected(selectedItems, PraxisTypeEnum.OPENNESS);
 
-      expect(comp.rule.openness).toEqual(['2','4'])
-      expect(comp.ruleData.openness).toEqual(['2','4'])
+      expect(comp.rule.openness).toEqual(['2', '4']);
+      expect(comp.ruleData.openness).toEqual(['2', '4']);
     });
   });
 
@@ -141,9 +144,8 @@ describe('ToolGroupRuleComponent', () => {
     setTimeout(() => {
       expect(comp.rule['negative-rule']).toEqual(true);
       done();
-    })
-  })
-
+    });
+  });
 
   it('createOrUpdateRule()', () => {
     comp.createOrUpdateRule();
@@ -152,14 +154,16 @@ describe('ToolGroupRuleComponent', () => {
       comp.rule.id,
       comp.rule['negative-rule'],
       comp.ruleData,
-      comp.ruleType
-    )
-  })
+      comp.ruleType,
+    );
+  });
 
   it('deleteRule()', () => {
     comp.deleteRule();
     expect(toolGroupServiceStub.deleteRule).toHaveBeenCalledWith(
-      comp.rule['tool-group'].id, comp.rule.id, comp.ruleType
-    )
-  })
+      comp.rule['tool-group'].id,
+      comp.rule.id,
+      comp.ruleType,
+    );
+  });
 });
diff --git a/src/app/components/edit-tool-group-rule/tool-group-rule.component.ts b/src/app/components/edit-tool-group-rule/tool-group-rule.component.ts
index 3e39bb57..ac71dd5d 100644
--- a/src/app/components/edit-tool-group-rule/tool-group-rule.component.ts
+++ b/src/app/components/edit-tool-group-rule/tool-group-rule.component.ts
@@ -8,8 +8,7 @@ import {
   PraxisTypeEnum,
 } from '../../models/tool-group';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { LanguageBCP47 } from '../../service/languages-bcp47-tag.service';
-
+import { Language } from '../../models/language';
 
 @Component({
   selector: 'admin-tool-group-rule',
@@ -44,7 +43,7 @@ export class ToolGroupRuleComponent implements OnInit {
   }
 
   updateSelected(
-    selectedItems: (CountriesType | LanguageBCP47 | Praxis)[],
+    selectedItems: (CountriesType | Language | Praxis)[],
     praxisType: PraxisTypeEnum,
   ): void {
     const codes = selectedItems.map((item) => item.code);
@@ -102,7 +101,7 @@ export class ToolGroupRuleComponent implements OnInit {
       .catch(this.handleError.bind(this));
   }
 
-  protected getCodes(items: (CountriesType | LanguageBCP47)[]): string[] {
+  protected getCodes(items: (CountriesType | Language)[]): string[] {
     return items.map((item) => item.code);
   }
 
diff --git a/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts b/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
index 5bedcc42..c76a7c3f 100644
--- a/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
+++ b/src/app/components/edit-tool-group-tool-reuseable/tool-group-tool-reuseable.component.spec.ts
@@ -3,10 +3,9 @@ import { FormsModule } from '@angular/forms';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { Resource } from '../../models/resource';
-import { ToolGroupMocks } from '../../_tests/toolGroupMocks'
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupToolReuseableComponent } from './tool-group-tool-reuseable.component';
 
-
 describe('ToolGroupToolReuseableComponent', () => {
   let comp: ToolGroupToolReuseableComponent;
   let fixture: ComponentFixture<ToolGroupToolReuseableComponent>;
@@ -21,20 +20,16 @@ describe('ToolGroupToolReuseableComponent', () => {
       ...new Resource(),
       id: 13,
       name: 'Test Resource',
-    }
-  ]
+    },
+  ];
   const mocks = new ToolGroupMocks();
   const toolGroupFullDetails = mocks.toolGroupFullDetails();
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [
-        ToolGroupToolReuseableComponent,
-      ],
+      declarations: [ToolGroupToolReuseableComponent],
       imports: [NgbModule.forRoot(), FormsModule, NgArrayPipesModule],
-      providers: [
-        { provide: NgbActiveModal },
-      ],
+      providers: [{ provide: NgbActiveModal }],
     }).compileComponents();
 
     fixture = TestBed.createComponent(ToolGroupToolReuseableComponent);
@@ -46,15 +41,15 @@ describe('ToolGroupToolReuseableComponent', () => {
       comp.tool = toolGroupFullDetails.tools[0];
       comp.resources = resources;
 
-      comp.updatedToolEmit.subscribe(value => ({
+      comp.updatedToolEmit.subscribe((value) => ({
         ...value,
         tool: {
           ...value.tool,
-          name: 'New Name'
+          name: 'New Name',
         },
-      }))
-      comp.ngOnInit()
-      expect(comp.suggestionsWeight).toEqual('12')
+      }));
+      comp.ngOnInit();
+      expect(comp.suggestionsWeight).toEqual('12');
     });
   });
 });
diff --git a/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts b/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
index 20efd8a2..4ace8df9 100644
--- a/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/abstract-edit-tool-group.component.ts
@@ -1,7 +1,7 @@
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { Input, Output, EventEmitter } from '@angular/core';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { LanguageBCP47 } from '../../service/languages-bcp47-tag.service';
+import { Language } from '../../models/language';
 import {
   CountriesType,
   ToolGroup,
@@ -16,7 +16,7 @@ import {
 export abstract class AbstractEditToolGroupComponent {
   @Input() toolGroup: ToolGroup = new ToolGroup();
   @Input() selectedCountries: CountriesType[] = [];
-  @Input() selectedLanguages: LanguageBCP47[] = [];
+  @Input() selectedLanguages: Language[] = [];
   @Input() selectedPraxisConfidence: Praxis[] = [];
   @Input() selectedPraxisOpenness: Praxis[] = [];
   @Output() EditedToolGroup: EventEmitter<any> = new EventEmitter();
@@ -58,7 +58,7 @@ export abstract class AbstractEditToolGroupComponent {
   }
 
   updateSelected(
-    selectedItems: (CountriesType | LanguageBCP47 | Praxis)[],
+    selectedItems: (CountriesType | Language | Praxis)[],
     type: RuleType,
     subType: PraxisType,
   ): void {
@@ -67,7 +67,7 @@ export abstract class AbstractEditToolGroupComponent {
         this.selectedCountries = selectedItems as CountriesType[];
         break;
       case RuleTypeEnum.LANGUAGE:
-        this.selectedLanguages = selectedItems as LanguageBCP47[];
+        this.selectedLanguages = selectedItems as Language[];
         break;
       case RuleTypeEnum.PRAXIS:
         switch (subType) {
@@ -90,8 +90,8 @@ export abstract class AbstractEditToolGroupComponent {
       case RuleTypeEnum.LANGUAGE:
         this.languageRule['negative-rule'] = negativeRule;
         break;
-        case RuleTypeEnum.PRAXIS:
-          this.praxisRule['negative-rule'] = negativeRule
+      case RuleTypeEnum.PRAXIS:
+        this.praxisRule['negative-rule'] = negativeRule;
         break;
     }
   }
@@ -113,9 +113,7 @@ export abstract class AbstractEditToolGroupComponent {
     this.errorMessage = message;
   }
 
-  protected getCodes(
-    items: (CountriesType | LanguageBCP47 | Praxis)[],
-  ): string[] {
+  protected getCodes(items: (CountriesType | Language | Praxis)[]): string[] {
     return items.map((item) => item.code);
   }
 
diff --git a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
index 062e483e..00ab7a22 100644
--- a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
+++ b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.spec.ts
@@ -4,12 +4,16 @@ import { FormsModule } from '@angular/forms';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
-import { LanguageBCP47Service } from '../../../service/languages-bcp47-tag.service';
-import { RuleTypeEnum, ToolGroup, ToolGroupRule } from '../../../models/tool-group';
-import { ToolGroupMocks } from '../../../_tests/toolGroupMocks'
+import { LanguageService } from '../../../service/language.service';
+import {
+  RuleTypeEnum,
+  ToolGroup,
+  ToolGroupRule,
+} from '../../../models/tool-group';
+import { ToolGroupMocks } from '../../../_tests/toolGroupMocks';
 import { ToolGroupRuleReuseableComponent } from '../../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { CreateToolGroupComponent } from './create-tool-group.component';
-
+import { Language } from '../../../models/language';
 
 describe('CreateToolGroupComponent', () => {
   let comp: CreateToolGroupComponent;
@@ -19,14 +23,14 @@ describe('CreateToolGroupComponent', () => {
     createOrUpdateToolGroup() {},
     createOrUpdateRule() {},
   } as unknown) as ToolGroupService;
-  const languageBCP47ServiceStub = ({
-    getLanguage() {},
-  } as unknown) as LanguageBCP47Service;
+  const languageServiceStub = ({
+    getLanguages() {},
+  } as unknown) as LanguageService;
 
-  const toolGroup = new ToolGroup()
-  const toolGroupRule = new ToolGroupRule()
+  const toolGroup = new ToolGroup();
+  const toolGroupRule = new ToolGroupRule();
   const createdToolGroupID = 16;
-  const mocks = new ToolGroupMocks()
+  const mocks = new ToolGroupMocks();
 
   beforeEach(() => {
     spyOn(toolGroupServiceStub, 'createOrUpdateToolGroup').and.returnValue(
@@ -38,19 +42,16 @@ describe('CreateToolGroupComponent', () => {
     spyOn(toolGroupServiceStub, 'createOrUpdateRule').and.returnValue(
       Promise.resolve<ToolGroupRule>(toolGroupRule),
     );
-    spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      mocks.languageUKMock,
+    spyOn(languageServiceStub, 'getLanguages').and.returnValue(
+      Promise.resolve<Language[]>([mocks.languageUKMock]),
     );
 
     TestBed.configureTestingModule({
-      declarations: [
-        CreateToolGroupComponent,
-        ToolGroupRuleReuseableComponent,
-      ],
+      declarations: [CreateToolGroupComponent, ToolGroupRuleReuseableComponent],
       imports: [NgbModule.forRoot(), FormsModule, NgArrayPipesModule],
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
-        { provide: LanguageBCP47Service, useValue: languageBCP47ServiceStub },
+        { provide: LanguageService, useValue: languageServiceStub },
         { provide: NgbActiveModal },
       ],
     }).compileComponents();
@@ -65,44 +66,67 @@ describe('CreateToolGroupComponent', () => {
       .query(By.css('.btn.btn-success'))
       .nativeElement.click();
 
-    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(comp.toolGroup, false);
+    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(
+      comp.toolGroup,
+      false,
+    );
   });
 
   it('creates Country Rule', (done) => {
-    comp.selectedCountries = [mocks.countryUKMock]
-    comp.countryRule['negative-rule'] = true
+    comp.selectedCountries = [mocks.countryUKMock];
+    comp.countryRule['negative-rule'] = true;
     fixture.debugElement
       .query(By.css('.btn.btn-success'))
       .nativeElement.click();
 
-    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(comp.toolGroup, false);
+    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(
+      comp.toolGroup,
+      false,
+    );
 
     setTimeout(() => {
-      expect(toolGroupServiceStub.createOrUpdateRule).toHaveBeenCalledWith(createdToolGroupID, null, true, ['GB'], RuleTypeEnum.COUNTRY);
+      expect(toolGroupServiceStub.createOrUpdateRule).toHaveBeenCalledWith(
+        createdToolGroupID,
+        null,
+        true,
+        ['GB'],
+        RuleTypeEnum.COUNTRY,
+      );
       done();
-    })
+    });
   });
 
   it('creates Language Rule', (done) => {
-    comp.selectedLanguages = [mocks.languageUKMock]
-    comp.languageRule['negative-rule'] = false
+    comp.selectedLanguages = [mocks.languageUKMock];
+    comp.languageRule['negative-rule'] = false;
     fixture.debugElement
       .query(By.css('.btn.btn-success'))
       .nativeElement.click();
 
-    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(comp.toolGroup, false);
+    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(
+      comp.toolGroup,
+      false,
+    );
 
     setTimeout(() => {
-      expect(toolGroupServiceStub.createOrUpdateRule).toHaveBeenCalledWith(createdToolGroupID, null, false, ['en-GB'], RuleTypeEnum.LANGUAGE);
+      expect(toolGroupServiceStub.createOrUpdateRule).toHaveBeenCalledWith(
+        createdToolGroupID,
+        null,
+        false,
+        ['en-GB'],
+        RuleTypeEnum.LANGUAGE,
+      );
       done();
-    })
+    });
   });
 
   it('creates Praxis Rule', (done) => {
-    comp.selectedPraxisConfidence = [{
-      name: 'test 1',
-      code: '0',
-    }];
+    comp.selectedPraxisConfidence = [
+      {
+        name: 'test 1',
+        code: '0',
+      },
+    ];
     comp.selectedPraxisOpenness = [
       {
         name: 'test 1',
@@ -111,14 +135,17 @@ describe('CreateToolGroupComponent', () => {
       {
         name: 'test 1',
         code: '4',
-      }
+      },
     ];
-    comp.praxisRule['negative-rule'] = false
+    comp.praxisRule['negative-rule'] = false;
     fixture.debugElement
       .query(By.css('.btn.btn-success'))
       .nativeElement.click();
 
-    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(comp.toolGroup, false);
+    expect(toolGroupServiceStub.createOrUpdateToolGroup).toHaveBeenCalledWith(
+      comp.toolGroup,
+      false,
+    );
 
     setTimeout(() => {
       expect(toolGroupServiceStub.createOrUpdateRule).toHaveBeenCalledWith(
@@ -127,11 +154,11 @@ describe('CreateToolGroupComponent', () => {
         false,
         {
           confidence: ['0'],
-          openness: ['3','4'],
+          openness: ['3', '4'],
         },
-        RuleTypeEnum.PRAXIS
+        RuleTypeEnum.PRAXIS,
       );
       done();
-    })
+    });
   });
 });
diff --git a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.ts b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.ts
index 5a82b38b..9a97e34a 100644
--- a/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/create-tool-group/create-tool-group.component.ts
@@ -1,8 +1,13 @@
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { Component, Input, OnInit } from '@angular/core';
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
-import { LanguageBCP47 } from '../../../service/languages-bcp47-tag.service';
-import { CountriesType, ToolGroup, RuleTypeEnum, Praxis } from '../../../models/tool-group';
+import { Language } from '../../../models/language';
+import {
+  CountriesType,
+  ToolGroup,
+  RuleTypeEnum,
+  Praxis,
+} from '../../../models/tool-group';
 import { AbstractEditToolGroupComponent } from '../abstract-edit-tool-group.component';
 
 @Component({
@@ -14,7 +19,7 @@ export class CreateToolGroupComponent
   implements OnInit {
   @Input() toolGroup: ToolGroup = new ToolGroup();
   @Input() selectedCountries: CountriesType[] = [];
-  @Input() selectedLanguages: LanguageBCP47[] = [];
+  @Input() selectedLanguages: Language[] = [];
   @Input() selectedPraxisConfidence: Praxis[] = [];
   @Input() selectedPraxisOpenness: Praxis[] = [];
 
@@ -31,7 +36,7 @@ export class CreateToolGroupComponent
     try {
       const toolGroup = await this.toolGroupService.createOrUpdateToolGroup(
         this.toolGroup,
-        false
+        false,
       );
       const promises = [];
 
diff --git a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
index 7d00b289..6d51ba5c 100644
--- a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
+++ b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.spec.ts
@@ -4,9 +4,14 @@ import { By } from '@angular/platform-browser';
 import { NgArrayPipesModule } from 'ngx-pipes';
 import { NgbActiveModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
-import { LanguageBCP47Service } from '../../../service/languages-bcp47-tag.service';
-import { RuleTypeEnum, ToolGroup, ToolGroupRule } from '../../../models/tool-group';
-import { ToolGroupMocks } from '../../../_tests/toolGroupMocks'
+import { LanguageService } from '../../../service/language.service';
+import {
+  RuleTypeEnum,
+  ToolGroup,
+  ToolGroupRule,
+} from '../../../models/tool-group';
+import { Language } from '../../../models/language';
+import { ToolGroupMocks } from '../../../_tests/toolGroupMocks';
 import { ToolGroupRuleReuseableComponent } from '../../edit-tool-group-rule-reuseable/tool-group-rule-reuseable.component';
 import { UpdateToolGroupComponent } from './update-tool-group.component';
 
@@ -18,14 +23,14 @@ describe('UpdateToolGroupComponent', () => {
     createOrUpdateToolGroup() {},
     createOrUpdateRule() {},
   } as unknown) as ToolGroupService;
-  const languageBCP47ServiceStub = ({
-    getLanguage() {},
-  } as unknown) as LanguageBCP47Service;
+  const languageServiceStub = ({
+    getLanguages() {},
+  } as unknown) as LanguageService;
 
-  const mocks = new ToolGroupMocks()
+  const mocks = new ToolGroupMocks();
 
-  const toolGroup = new ToolGroup()
-  const toolGroupRule = new ToolGroupRule()
+  const toolGroup = new ToolGroup();
+  const toolGroupRule = new ToolGroupRule();
   const createdToolGroupID = 16;
 
   beforeEach(() => {
@@ -38,19 +43,16 @@ describe('UpdateToolGroupComponent', () => {
     spyOn(toolGroupServiceStub, 'createOrUpdateRule').and.returnValue(
       Promise.resolve<ToolGroupRule>(toolGroupRule),
     );
-    spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      mocks.languageUKMock,
+    spyOn(languageServiceStub, 'getLanguages').and.returnValue(
+      Promise.resolve<Language[]>([mocks.languageUKMock]),
     );
 
     TestBed.configureTestingModule({
-      declarations: [
-        UpdateToolGroupComponent,
-        ToolGroupRuleReuseableComponent,
-      ],
+      declarations: [UpdateToolGroupComponent, ToolGroupRuleReuseableComponent],
       imports: [NgbModule.forRoot(), FormsModule, NgArrayPipesModule],
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
-        { provide: LanguageBCP47Service, useValue: languageBCP47ServiceStub },
+        { provide: LanguageService, useValue: languageServiceStub },
         { provide: NgbActiveModal },
       ],
     }).compileComponents();
@@ -66,23 +68,15 @@ describe('UpdateToolGroupComponent', () => {
       .nativeElement.click();
 
     expect(toolGroupServiceStub.createOrUpdateToolGroup).not.toHaveBeenCalled();
-    expect(toolGroupServiceStub.createOrUpdateRule).not.toHaveBeenCalled()
+    expect(toolGroupServiceStub.createOrUpdateRule).not.toHaveBeenCalled();
   });
 
-
   describe('saveToolGroup()', () => {
-
     beforeEach(() => {
-      comp.ngOnInit()
+      comp.ngOnInit();
       comp.toolGroup.name = 'New Name';
-      comp.selectedCountries = [
-        mocks.countryUKMock,
-        mocks.countryUSMock
-      ]
-      comp.selectedLanguages = [
-        mocks.languageUKMock,
-        mocks.languageUSMock
-      ]
+      comp.selectedCountries = [mocks.countryUKMock, mocks.countryUSMock];
+      comp.selectedLanguages = [mocks.languageUKMock, mocks.languageUSMock];
       comp.selectedPraxisConfidence = [
         {
           name: 'test 1',
@@ -91,17 +85,16 @@ describe('UpdateToolGroupComponent', () => {
         {
           name: 'test 2',
           code: '2',
-        }
-      ]
+        },
+      ];
       comp.selectedPraxisOpenness = [
         {
           name: 'test 3',
           code: '3',
-        }
-      ]
+        },
+      ];
     });
 
-
     it('should update Tool Group but not rules resource', () => {
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
@@ -112,9 +105,7 @@ describe('UpdateToolGroupComponent', () => {
     });
 
     it('should update Country rule', () => {
-      comp.selectedCountries = [
-        mocks.countryUKMock,
-      ]
+      comp.selectedCountries = [mocks.countryUKMock];
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
         .nativeElement.click();
@@ -144,9 +135,7 @@ describe('UpdateToolGroupComponent', () => {
     });
 
     it('should update Langauge rule', () => {
-      comp.selectedLanguages = [
-        mocks.languageUSMock
-      ]
+      comp.selectedLanguages = [mocks.languageUSMock];
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
         .nativeElement.click();
@@ -161,7 +150,7 @@ describe('UpdateToolGroupComponent', () => {
     });
 
     it('should update Langauge rule as negative rule changed', () => {
-      comp.languageRule['negative-rule'] = false
+      comp.languageRule['negative-rule'] = false;
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
         .nativeElement.click();
@@ -181,7 +170,7 @@ describe('UpdateToolGroupComponent', () => {
           name: 'test 1',
           code: '1',
         },
-      ]
+      ];
       fixture.debugElement
         .query(By.css('.btn.btn-success'))
         .nativeElement.click();
diff --git a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
index a5106e24..a9397b1e 100644
--- a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
@@ -1,8 +1,8 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import * as _ from 'lodash'
+import * as _ from 'lodash';
 import { ToolGroupService } from '../../../service/tool-group/tool-group.service';
-import { LanguageBCP47 } from '../../../service/languages-bcp47-tag.service';
+import { Language } from '../../../models/language';
 import {
   CountriesType,
   ToolGroup,
@@ -27,7 +27,7 @@ export class UpdateToolGroupComponent
   implements OnInit {
   @Input() toolGroup: ToolGroup;
   @Input() selectedCountries: CountriesType[] = [];
-  @Input() selectedLanguages: LanguageBCP47[] = [];
+  @Input() selectedLanguages: Language[] = [];
   @Input() selectedPraxisConfidence: Praxis[] = [];
   @Input() selectedPraxisOpenness: Praxis[] = [];
   initialToolGroup: ToolGroup;
@@ -52,44 +52,51 @@ export class UpdateToolGroupComponent
       array1
         .slice()
         .sort()
-        .every((value, index) => value.toString().toLowerCase() === array2Sorted[index].toString().toLowerCase())
+        .every(
+          (value, index) =>
+            value.toString().toLowerCase() ===
+            array2Sorted[index].toString().toLowerCase(),
+        )
     );
   };
 
-  getValues(type: RuleTypeEnum, praxisType?: PraxisTypeEnum)  {
-    switch(type) {
+  getValues(type: RuleTypeEnum, praxisType?: PraxisTypeEnum) {
+    switch (type) {
       case RuleTypeEnum.COUNTRY:
-        const initialcountry = this.initialToolGroup['rules-country'][0] || undefined;
+        const initialcountry =
+          this.initialToolGroup['rules-country'][0] || undefined;
         return {
           initialRule: initialcountry,
           initialCodes: initialcountry.countries || [],
           initialNegativeRule: initialcountry['negative-rule'],
           negativeRule: this.countryRule['negative-rule'],
-        }
+        };
       case RuleTypeEnum.LANGUAGE:
-        const initialLanguage = this.initialToolGroup['rules-language'][0] || undefined;
+        const initialLanguage =
+          this.initialToolGroup['rules-language'][0] || undefined;
         return {
           initialRule: initialLanguage,
           initialCodes: initialLanguage.languages || [],
           initialNegativeRule: initialLanguage['negative-rule'],
           negativeRule: this.languageRule['negative-rule'],
-        }
+        };
       case RuleTypeEnum.PRAXIS:
-        const initialPraxis = this.initialToolGroup['rules-praxis'][0] || undefined;
+        const initialPraxis =
+          this.initialToolGroup['rules-praxis'][0] || undefined;
         if (praxisType === PraxisTypeEnum.CONFIDENCE) {
           return {
             initialRule: initialPraxis,
             initialCodes: initialPraxis.confidence,
             initialNegativeRule: initialPraxis['negative-rule'],
             negativeRule: this.praxisRule['negative-rule'],
-          }
+          };
         } else {
           return {
             initialRule: initialPraxis,
             initialCodes: initialPraxis.openness,
             initialNegativeRule: initialPraxis['negative-rule'],
             negativeRule: this.praxisRule['negative-rule'],
-          }
+          };
         }
     }
   }
@@ -101,20 +108,24 @@ export class UpdateToolGroupComponent
       return true;
     } else if (values.initialRule) {
       const codeChanges = !this.isEqual(values.initialCodes, codes);
-      const negativeChanges = values.initialNegativeRule !== values.negativeRule;
+      const negativeChanges =
+        values.initialNegativeRule !== values.negativeRule;
       if (codeChanges || negativeChanges) {
-        return true
+        return true;
       }
       if (type === RuleTypeEnum.PRAXIS) {
         // Test confidence
-        const values = this.getValues(type, PraxisTypeEnum.CONFIDENCE);
-        const codeChanges = !this.isEqual(values.initialCodes, super.getCodes(this.selectedPraxisConfidence));
-        if (codeChanges) {
-          return true
+        const confidenceValues = this.getValues(type, PraxisTypeEnum.CONFIDENCE);
+        const confidenceCodeChanges = !this.isEqual(
+          confidenceValues.initialCodes,
+          super.getCodes(this.selectedPraxisConfidence),
+        );
+        if (confidenceCodeChanges) {
+          return true;
         }
       }
     }
-    return false
+    return false;
   }
 
   async saveToolGroup(): Promise<void> {
@@ -122,13 +133,12 @@ export class UpdateToolGroupComponent
     const promises = [];
     try {
       if (
-        this.initialToolGroup.name !== this.toolGroup.name
-        || this.initialToolGroup.suggestedWeight !== this.toolGroup.suggestedWeight
+        this.initialToolGroup.name !== this.toolGroup.name ||
+        this.initialToolGroup.suggestedWeight !== this.toolGroup.suggestedWeight
       ) {
-        promises.push(this.toolGroupService.createOrUpdateToolGroup(
-          this.toolGroup,
-          true,
-        ));
+        promises.push(
+          this.toolGroupService.createOrUpdateToolGroup(this.toolGroup, true),
+        );
       }
 
       const countryCodes = super.getCodes(this.selectedCountries);
@@ -193,7 +203,7 @@ export class UpdateToolGroupComponent
       );
       const invalidResults = results.filter((result) => !result.success);
       if (invalidResults.length) {
-        throw new Error(invalidResults.join('. '))
+        throw new Error(invalidResults.join('. '));
       } else {
         super.saveToolGroup();
       }
diff --git a/src/app/components/tool-group/tool-group.component.spec.ts b/src/app/components/tool-group/tool-group.component.spec.ts
index e7f97246..829a69f5 100644
--- a/src/app/components/tool-group/tool-group.component.spec.ts
+++ b/src/app/components/tool-group/tool-group.component.spec.ts
@@ -2,8 +2,16 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 import { NgbModal, NgbModalRef, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { LanguageBCP47Service } from '../../service/languages-bcp47-tag.service';
-import { CountryRule, LanguageRule, ToolGroup, ToolGroupRule } from '../..//models/tool-group';
+import { LanguageService } from '../../service/language.service';
+import { ResourceService } from '../../service/resource/resource.service';
+import {
+  CountryRule,
+  LanguageRule,
+  ToolGroup,
+  ToolGroupRule,
+} from '../..//models/tool-group';
+import { Language } from '../../models/language';
+import { Resource } from '../../models/resource';
 import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupsComponent } from '../tool-groups/tool-groups.component';
 import { ToolGroupComponent } from './tool-group.component';
@@ -11,66 +19,74 @@ import { ToolGroupComponent } from './tool-group.component';
 describe('ResourceComponent', () => {
   let comp: ToolGroupComponent;
   let fixture: ComponentFixture<ToolGroupComponent>;
-
+  const mocks = new ToolGroupMocks();
+  const resourceServiceStub = ({
+    getResources() {},
+  } as unknown) as ResourceService;
   const toolGroupServiceStub = ({
     getToolGroup() {},
+    getToolGroups() {},
     praxisConfidentData: {
       0: {
-        name: 'Confidence'
-      }
+        name: 'Confidence',
+      },
     },
     praxisOpennessData: {
       0: {
-        name: 'Openness'
-      }
-    }
+        name: 'Openness',
+      },
+    },
   } as unknown) as ToolGroupService;
-  const languageBCP47ServiceStub = ({
-    getLanguage() {},
-  } as unknown) as LanguageBCP47Service;
+  const languageServiceStub = ({
+    getLanguages() {
+      return mocks.getLanguagesResponse;
+    },
+  } as unknown) as LanguageService;
   const modalServiceStub = ({
     open() {},
   } as unknown) as NgbModal;
 
-  const mocks = new ToolGroupMocks();
   const toolGroup: ToolGroup = new ToolGroup();
-  toolGroup.id = 8
+  toolGroup.id = 8;
   const rule: ToolGroupRule = new ToolGroupRule();
   rule.id = 17;
   rule.languages = ['en-GB', 'en-US'];
   rule.countries = ['US', 'UK'];
-  rule.confidence = ['1','5'];
+  rule.confidence = ['1', '5'];
   rule.openness = ['3'];
   rule['tool-group'] = {
     ...toolGroup,
-  }
+  };
   const toolGroupFullDetails = mocks.toolGroupFullDetails();
   const modalRef = ({
     componentInstance: {
       source: null,
     },
-    result: Promise.resolve()
+    result: Promise.resolve(),
   } as unknown) as NgbModalRef;
-
+  const resource = new Resource();
 
   beforeEach(async(() => {
-    spyOn(languageBCP47ServiceStub, 'getLanguage').and.returnValue(
-      mocks.languageUKMock,
+    spyOn(languageServiceStub, 'getLanguages').and.returnValue(
+      Promise.resolve<Language[]>(mocks.getLanguagesResponse),
     );
     spyOn(toolGroupServiceStub, 'getToolGroup').and.returnValue(
       Promise.resolve(toolGroupFullDetails),
     );
+    spyOn(toolGroupServiceStub, 'getToolGroups').and.returnValue(
+      Promise.resolve([toolGroupFullDetails]),
+    );
     spyOn(modalServiceStub, 'open').and.returnValue(modalRef);
 
+    spyOn(resourceServiceStub, 'getResources').and.returnValue(
+      Promise.resolve([resource]),
+    );
     TestBed.configureTestingModule({
-      declarations: [
-        ToolGroupsComponent,
-        ToolGroupComponent,
-      ],
+      declarations: [ToolGroupsComponent, ToolGroupComponent],
       imports: [NgbModule.forRoot(), FormsModule],
       providers: [
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
-        { provide: LanguageBCP47Service, useValue: languageBCP47ServiceStub },
+        { provide: LanguageService, useValue: languageServiceStub },
         { provide: NgbModal, useValue: modalServiceStub },
       ],
     }).compileComponents();
@@ -80,22 +96,28 @@ describe('ResourceComponent', () => {
     fixture = TestBed.createComponent(ToolGroupComponent);
     comp = fixture.componentInstance;
     comp.toolGroup = toolGroup;
-    comp.toolGroupsComponent = new ToolGroupsComponent(null, null, null);
+    comp.toolGroupsComponent = new ToolGroupsComponent(
+      toolGroupServiceStub,
+      modalServiceStub,
+      resourceServiceStub,
+      languageServiceStub,
+    );
+    comp.toolGroupsComponent.ngOnInit();
   });
 
   describe('loadAllDetails', () => {
     it('should not call getToolGroup()', async () => {
-      comp.hasLoadedInitialDetails = true
+      comp.hasLoadedInitialDetails = true;
       const returnedValue = await comp.loadAllDetails();
       expect(returnedValue).toEqual(toolGroup);
       expect(toolGroupServiceStub.getToolGroup).not.toHaveBeenCalled();
     });
     it('should call getToolGroup()', async () => {
-      comp.hasLoadedInitialDetails = false
+      comp.hasLoadedInitialDetails = false;
       const returnedValue = await comp.loadAllDetails();
-      expect(returnedValue['rules-praxis'][0].id).toEqual(3)
-      expect(returnedValue.tools[0].suggestionsWeight).toEqual('12')
-      expect(comp.hasLoadedInitialDetails).toEqual(true)
+      expect(returnedValue['rules-praxis'][0].id).toEqual(3);
+      expect(returnedValue.tools[0].suggestionsWeight).toEqual('12');
+      expect(comp.hasLoadedInitialDetails).toEqual(true);
       expect(toolGroupServiceStub.getToolGroup).toHaveBeenCalled();
     });
   });
@@ -104,11 +126,11 @@ describe('ResourceComponent', () => {
     it('should call loadAllDetails()', (done) => {
       spyOn(comp, 'loadAllDetails').and.returnValue(
         Promise.resolve(toolGroupFullDetails),
-      )
-      comp.openUpdateModal()
+      );
+      comp.openUpdateModal();
 
       setTimeout(() => {
-        expect(comp.loadAllDetails).toHaveBeenCalled()
+        expect(comp.loadAllDetails).toHaveBeenCalled();
         done();
       });
     });
@@ -116,7 +138,7 @@ describe('ResourceComponent', () => {
 
   describe('openRuleModal', () => {
     it('should open Rule modal and send Rule data', () => {
-      comp.openRuleModal(rule as LanguageRule & CountryRule, 'country')
+      comp.openRuleModal(rule as LanguageRule & CountryRule, 'country');
       expect(modalServiceStub.open).toHaveBeenCalled();
       expect(modalRef.componentInstance.rule).toBe(rule);
       expect(modalRef.componentInstance.ruleType).toBe('country');
@@ -127,7 +149,7 @@ describe('ResourceComponent', () => {
     it('should open Rule modal and send new Rule data', () => {
       const newRule = new ToolGroupRule();
       newRule['tool-group'] = comp.toolGroup;
-      comp.createRule('country')
+      comp.createRule('country');
       expect(modalServiceStub.open).toHaveBeenCalled();
       expect(modalRef.componentInstance.rule['tool-group'].id).toBe(8);
       expect(modalRef.componentInstance.ruleType).toBe('country');
@@ -136,45 +158,46 @@ describe('ResourceComponent', () => {
 
   describe('addResource', () => {
     it('should open Add Resoiurce modal and send data', () => {
-      comp.addResource()
+      comp.addResource();
       expect(modalServiceStub.open).toHaveBeenCalled();
-      expect(modalRef.componentInstance.resources).toBe(comp.toolGroupsComponent.resources);
+      expect(modalRef.componentInstance.resources).toBe(
+        comp.toolGroupsComponent.resources,
+      );
       expect(modalRef.componentInstance.toolGroup).toBe(toolGroup);
     });
   });
 
   describe('handleToggleAccordian', () => {
     it('should call loadAllDetails() when handleToggleAccordian() is called', () => {
-      spyOn(comp, 'loadAllDetails')
-      comp.showDetails = false
-      comp.handleToggleAccordian()
+      spyOn(comp, 'loadAllDetails');
+      comp.showDetails = false;
+      comp.handleToggleAccordian();
       expect(comp.showDetails).toEqual(true);
       expect(comp.loadAllDetails).toHaveBeenCalled();
-
     });
   });
 
-  describe('getReadableValue Languages', () => {
+  describe('getReadableValue', () => {
+    beforeEach(() => {
+      comp.toolGroupsComponent.languages = mocks.getLanguagesResponse;
+    });
+
     it('should return UK language', () => {
-      const value = comp.getReadableValue('en-GB', 'language', null)
+      const value = comp.getReadableValue('en-GB', 'language', null);
       expect(value).toEqual(mocks.languageUKMock);
     });
-  });
 
-  describe('getReadableValue Praxis Confident', () => {
     it('should return Confidence value', () => {
-      const value = comp.getReadableValue('0', 'praxis', 'confidence')
+      const value = comp.getReadableValue('0', 'praxis', 'confidence');
       expect(value).toEqual({
-        name: 'Confidence'
+        name: 'Confidence',
       });
     });
-  });
 
-  describe('getReadableValue Praxis Openess', () => {
     it('should return Openness value', () => {
-      const value = comp.getReadableValue('0', 'praxis', 'openness')
+      const value = comp.getReadableValue('0', 'praxis', 'openness');
       expect(value).toEqual({
-        name: 'Openness'
+        name: 'Openness',
       });
     });
   });
diff --git a/src/app/components/tool-group/tool-group.component.ts b/src/app/components/tool-group/tool-group.component.ts
index 9f8d3227..29cf20ab 100644
--- a/src/app/components/tool-group/tool-group.component.ts
+++ b/src/app/components/tool-group/tool-group.component.ts
@@ -7,7 +7,6 @@ import {
 import { Subject } from 'rxjs';
 import { countries } from 'countries-list';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
-import { LanguageBCP47Service } from '../../service/languages-bcp47-tag.service';
 import {
   ToolGroup,
   ToolGroupRule,
@@ -39,14 +38,12 @@ export class ToolGroupComponent implements OnDestroy {
   showDetails = false;
   hasLoadedInitialDetails = false;
   errorMessage: string;
-  languages: string[][] = [];
 
   private _translationLoaded = new Subject<number>();
   translationLoaded$ = this._translationLoaded.asObservable();
 
   constructor(
     private modalService: NgbModal,
-    private languageBCP47Service: LanguageBCP47Service,
     protected toolGroupService: ToolGroupService,
   ) {}
 
@@ -120,7 +117,9 @@ export class ToolGroupComponent implements OnDestroy {
     let value;
     switch (type) {
       case RuleTypeEnum.LANGUAGE:
-        value = this.languageBCP47Service.getLanguage(code);
+        value = this.toolGroupsComponent.languages.find(
+          (language) => language.code === code,
+        ) || { name: code };
         break;
       case RuleTypeEnum.COUNTRY:
         value = countries[code];
diff --git a/src/app/components/tool-groups/tool-groups.component.spec.ts b/src/app/components/tool-groups/tool-groups.component.spec.ts
index c020b4f9..e4461a2e 100644
--- a/src/app/components/tool-groups/tool-groups.component.spec.ts
+++ b/src/app/components/tool-groups/tool-groups.component.spec.ts
@@ -3,14 +3,18 @@ import { FormsModule } from '@angular/forms';
 import { NgbModal, NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { ResourceService } from '../../service/resource/resource.service';
+import { LanguageService } from '../../service/language.service';
 import { Resource } from '../../models/resource';
 import { ToolGroup } from '../../models/tool-group';
+import { Language } from '../../models/language';
+import { ToolGroupMocks } from '../../_tests/toolGroupMocks';
 import { ToolGroupsComponent } from './tool-groups.component';
 import { ToolGroupComponent } from '../tool-group/tool-group.component';
 
 describe('ToolGroupsComponent', () => {
   let comp: ToolGroupsComponent;
   let fixture: ComponentFixture<ToolGroupsComponent>;
+  const mocks = new ToolGroupMocks();
 
   const resourceServiceStub = ({
     getResources() {},
@@ -18,9 +22,14 @@ describe('ToolGroupsComponent', () => {
   const toolGroupServiceStub = ({
     getToolGroups() {},
   } as unknown) as ToolGroupService;
+  const languageServiceStub = ({
+    getLanguages() {
+      return mocks.getLanguagesResponse;
+    },
+  } as unknown) as LanguageService;
 
   const resource: Resource = new Resource();
-  const toolGroup: ToolGroup =  new ToolGroup();
+  const toolGroup: ToolGroup = new ToolGroup();
 
   beforeEach(async(() => {
     spyOn(resourceServiceStub, 'getResources').and.returnValue(
@@ -29,15 +38,16 @@ describe('ToolGroupsComponent', () => {
     spyOn(toolGroupServiceStub, 'getToolGroups').and.returnValue(
       Promise.resolve([toolGroup]),
     );
+    spyOn(languageServiceStub, 'getLanguages').and.returnValue(
+      Promise.resolve<Language[]>(mocks.getLanguagesResponse),
+    );
     TestBed.configureTestingModule({
-      declarations: [
-        ToolGroupsComponent,
-        ToolGroupComponent,
-      ],
+      declarations: [ToolGroupsComponent, ToolGroupComponent],
       imports: [NgbModule.forRoot(), FormsModule],
       providers: [
         { provide: ResourceService, useValue: resourceServiceStub },
         { provide: ToolGroupService, useValue: toolGroupServiceStub },
+        { provide: LanguageService, useValue: languageServiceStub },
         { provide: NgbModal },
       ],
     }).compileComponents();
diff --git a/src/app/components/tool-groups/tool-groups.component.ts b/src/app/components/tool-groups/tool-groups.component.ts
index 9d13a243..c2734c78 100644
--- a/src/app/components/tool-groups/tool-groups.component.ts
+++ b/src/app/components/tool-groups/tool-groups.component.ts
@@ -2,6 +2,8 @@ import { Component, OnInit } from '@angular/core';
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
 import { ToolGroupService } from '../../service/tool-group/tool-group.service';
 import { ResourceService } from '../../service/resource/resource.service';
+import { LanguageService } from '../../service/language.service';
+import { Language } from '../../models/language';
 import { ToolGroup } from '../../models/tool-group';
 import { Resource } from '../../models/resource';
 import { CreateToolGroupComponent } from '../edit-tool-group/create-tool-group/create-tool-group.component';
@@ -16,11 +18,13 @@ export class ToolGroupsComponent implements OnInit {
   loadingToolGroups = false;
   errorMessage: string;
   resources: Resource[];
+  languages: Language[];
 
   constructor(
     private toolGroupService: ToolGroupService,
     private modalService: NgbModal,
     private resourceService: ResourceService,
+    private languageService: LanguageService,
   ) {}
 
   ngOnInit(): void {
@@ -28,6 +32,9 @@ export class ToolGroupsComponent implements OnInit {
     this.resourceService.getResources().then((resources) => {
       this.resources = resources;
     });
+    this.languageService.getLanguages().then((languages) => {
+      this.languages = languages;
+    });
   }
 
   loadToolGroups(): Promise<void> {
@@ -57,7 +64,7 @@ export class ToolGroupsComponent implements OnInit {
     modalRef.result.then(() => this.loadToolGroups(), console.log);
   }
 
-  private handleError(message): void {
+  protected handleError(message): void {
     this.errorMessage = message;
   }
 }
diff --git a/src/app/models/tool-group.ts b/src/app/models/tool-group.ts
index 01866075..c9c855ad 100644
--- a/src/app/models/tool-group.ts
+++ b/src/app/models/tool-group.ts
@@ -89,6 +89,6 @@ export interface Tools {
 }
 
 export type RulesType =
-| (CountryRule & LanguageRule & PraxisRule)
-| (LanguageRule & PraxisRule & CountryRule)
-| (PraxisRule & CountryRule & LanguageRule)
+  | (CountryRule & LanguageRule & PraxisRule)
+  | (LanguageRule & PraxisRule & CountryRule)
+  | (PraxisRule & CountryRule & LanguageRule);
diff --git a/src/app/service/languages-bcp47-tag.service.ts b/src/app/service/languages-bcp47-tag.service.ts
deleted file mode 100644
index e1610cd2..00000000
--- a/src/app/service/languages-bcp47-tag.service.ts
+++ /dev/null
@@ -1,339 +0,0 @@
-import { Injectable } from '@angular/core';
-import { AbstractService } from './abstract.service';
-// This file is tested in src/app/service/tool-group/tool-group.service.spec.ts
-export interface LanguageBCP47 {
-  code: string;
-  language: string;
-  region: string;
-  name: string;
-}
-
-const languages: LanguageBCP47[] = [
-  {
-    code: 'ar-SA',
-    language: 'Arabic',
-    region: 'Saudi Arabia',
-    name: 'Arabic (Saudi Arabia)',
-  },
-  {
-    code: 'bn-BD',
-    language: 'Bangla',
-    region: 'Bangladesh',
-    name: 'Bangla (Bangladesh)',
-  },
-  {
-    code: 'bn-IN',
-    language: 'Bangla',
-    region: 'India',
-    name: 'Bangla (India)',
-  },
-  {
-    code: 'cs-CZ',
-    language: 'Czech',
-    region: 'Czech Republic',
-    name: 'Czech (Czech Republic)',
-  },
-  {
-    code: 'da-DK',
-    language: 'Danish',
-    region: 'Denmark',
-    name: 'Danish (Denmark)',
-  },
-  {
-    code: 'de-AT',
-    language: 'German',
-    region: 'Austria',
-    name: 'German (Austrian)',
-  },
-  {
-    code: 'de-CH',
-    language: 'German',
-    region: 'Switzerland',
-    name: 'German (Switzerland)',
-  },
-  {
-    code: 'de-DE',
-    language: 'German',
-    region: 'Germany',
-    name: 'German (Germany)',
-  },
-  {
-    code: 'el-GR',
-    language: 'Greek',
-    region: 'Greece',
-    name: 'Modern Greek',
-  },
-  {
-    code: 'en-US',
-    language: 'English',
-    region: 'United States',
-    name: 'English (United States)',
-  },
-  {
-    code: 'en-GB',
-    language: 'English',
-    region: 'United Kingdom',
-    name: 'English (British)',
-  },
-  {
-    code: 'en-AU',
-    language: 'English',
-    region: 'Australia',
-    name: 'English (Australian)',
-  },
-  {
-    code: 'en-CA',
-    language: 'English',
-    region: 'Canada',
-    name: 'English (Canadian)',
-  },
-  {
-    code: 'en-IE',
-    language: 'English',
-    region: 'Ireland',
-    name: 'English (Irish)',
-  },
-  {
-    code: 'en-IN',
-    language: 'English',
-    region: 'India',
-    name: 'English (Indian)',
-  },
-  {
-    code: 'en-NZ',
-    language: 'English',
-    region: 'New Zealand',
-    name: 'English (New Zealand)',
-  },
-  {
-    code: 'en-ZA',
-    language: 'English',
-    region: 'South Africa',
-    name: 'English (South Africa)',
-  },
-  {
-    code: 'es-ES',
-    language: 'Spanish',
-    region: 'Spain',
-    name: 'Spanish (Spain)',
-  },
-  {
-    code: 'es-AR',
-    language: 'Spanish',
-    region: 'Argentina',
-    name: 'Spanish (Argentine)',
-  },
-  {
-    code: 'es-CL',
-    language: 'Spanish',
-    region: 'Chile',
-    name: 'Spanish (Chilean)',
-  },
-  {
-    code: 'es-CO',
-    language: 'Spanish',
-    region: 'Columbia',
-    name: 'Spanish (Colombian)',
-  },
-  {
-    code: 'es-MX',
-    language: 'Spanish',
-    region: 'Mexico',
-    name: 'Spanish (Mexican)',
-  },
-  {
-    code: 'es-US',
-    language: 'Spanish',
-    region: 'United States',
-    name: 'Spanish (American)',
-  },
-  {
-    code: 'fr-FR',
-    language: 'French',
-    region: 'France',
-    name: 'French (France)',
-  },
-  {
-    code: 'fi-FI',
-    language: 'Finnish',
-    region: 'Finland',
-    name: 'Finnish (Finland)',
-  },
-  {
-    code: 'fr-BE',
-    language: 'French',
-    region: 'Belgium',
-    name: 'French (Belgian)',
-  },
-  {
-    code: 'fr-CA',
-    language: 'French',
-    region: 'Canada',
-    name: 'French (Canadian)',
-  },
-  {
-    code: 'fr-CH',
-    language: 'French',
-    region: 'Switzerland',
-    name: 'French (Switzerland)',
-  },
-  {
-    code: 'he-IL',
-    language: 'Hebrew',
-    region: 'Israel',
-    name: 'Hebrew (Israel)',
-  },
-  {
-    code: 'hi-IN',
-    language: 'Hindi',
-    region: 'India',
-    name: 'Hindi (India)',
-  },
-  {
-    code: 'hu-HU',
-    language: 'Hungarian',
-    region: 'Hungary',
-    name: 'Hungarian (Hungary)',
-  },
-  {
-    code: 'id-ID',
-    language: 'Indonesian',
-    region: 'Indonesia',
-    name: 'Indonesian (Indonesia)',
-  },
-  {
-    code: 'it-IT',
-    language: 'Italian',
-    region: 'Italy',
-    name: 'Italian (Italy)',
-  },
-  {
-    code: 'it-CH',
-    language: 'Italian',
-    region: 'Switzerland',
-    name: 'Italian (Switzerland)',
-  },
-  {
-    code: 'ja-JP',
-    language: 'Japanese',
-    region: 'Japan',
-    name: 'Japanese (Japan)',
-  },
-  {
-    code: 'ko-KR',
-    language: 'Korean',
-    region: 'Republic of Korea',
-    name: 'Korean (Republic of Korea)',
-  },
-  {
-    code: 'nl-BE',
-    language: 'Dutch',
-    region: 'Belgium',
-    name: 'Belgian Dutch',
-  },
-  {
-    code: 'nl-NL',
-    language: 'Dutch',
-    region: 'The Netherlands',
-    name: 'Dutch (The Netherlands)',
-  },
-  {
-    code: 'no-NO',
-    language: 'Norwegian',
-    region: 'Norway',
-    name: 'Norwegian (Norway)',
-  },
-  {
-    code: 'pl-PL',
-    language: 'Polish',
-    region: 'Poland',
-    name: 'Polish (Poland)',
-  },
-  {
-    code: 'pt-PT',
-    language: 'Portugese',
-    region: 'Portugal',
-    name: 'Portuguese (Portugal)',
-  },
-  {
-    code: 'pt-BR',
-    language: 'Portugese',
-    region: 'Brazil',
-    name: 'Portuguese (Brazil)',
-  },
-  {
-    code: 'ro-RO',
-    language: 'Romanian',
-    region: 'Romania',
-    name: 'Romanian (Romania)',
-  },
-  {
-    code: 'ru-RU',
-    language: 'Russian',
-    region: 'Russian Federation',
-    name: 'Russian (Russian Federation)',
-  },
-  {
-    code: 'sk-SK',
-    language: 'Slovak',
-    region: 'Slovakia',
-    name: 'Slovak (Slovakia)',
-  },
-  {
-    code: 'sv-SE',
-    language: 'Swedish',
-    region: 'Sweden',
-    name: 'Swedish (Sweden)',
-  },
-  {
-    code: 'ta-IN',
-    language: 'Tamil',
-    region: 'India',
-    name: 'Indian Tamil',
-  },
-  {
-    code: 'ta-LK',
-    language: 'Tamil',
-    region: 'Sri',
-    name: 'Lanka	Sri Lankan Tamil',
-  },
-  {
-    code: 'th-TH',
-    language: 'Thai',
-    region: 'Thailand',
-    name: 'Thai (Thailand)',
-  },
-  {
-    code: 'tr-TR',
-    language: 'Turkish',
-    region: 'Turkey',
-    name: 'Turkish (Turkey)',
-  },
-  {
-    code: 'zh-CN',
-    language: 'Chinese',
-    region: 'China',
-    name: 'Mainland China, simplified characters',
-  },
-  {
-    code: 'zh-HK',
-    language: 'Chinese',
-    region: 'Hong Kong',
-    name: 'Hong Kong, traditional characters',
-  },
-  {
-    code: 'zh-TW',
-    language: 'Chinese',
-    region: 'Taiwan',
-    name: 'Taiwan, traditional characters',
-  },
-];
-@Injectable()
-export class LanguageBCP47Service extends AbstractService {
-  getLanguages(): LanguageBCP47[] {
-    return languages;
-  }
-  getLanguage(code: string): LanguageBCP47 | null {
-    return languages.find((language) => language.code === code);
-  }
-}
diff --git a/src/app/service/tool-group/tool-group.service.spec.ts b/src/app/service/tool-group/tool-group.service.spec.ts
index dcc11eaa..8f2dd975 100644
--- a/src/app/service/tool-group/tool-group.service.spec.ts
+++ b/src/app/service/tool-group/tool-group.service.spec.ts
@@ -4,13 +4,14 @@ import { Observable } from 'rxjs/Observable';
 import { ToolGroupService } from './tool-group.service';
 import { AuthService } from '../auth/auth.service';
 import {
-  LanguageBCP47Service,
-} from '../../service/languages-bcp47-tag.service';
-import { ToolGroup, RuleTypeEnum, ToolGroupRule } from '../../models/tool-group';
+  ToolGroup,
+  RuleTypeEnum,
+  ToolGroupRule,
+} from '../../models/tool-group';
 import { environment } from '../../../environments/environment';
 
 const headers: RequestOptionsArgs = {};
-const toolGroupsUrl = environment.base_url + 'tool-groups'
+const toolGroupsUrl = environment.base_url + 'tool-groups';
 class MockHttp extends Http {}
 class MockAuthService extends AuthService {
   getAuthorizationAndOptions() {
@@ -21,13 +22,11 @@ class MockAuthService extends AuthService {
 describe('ToolGroupService', () => {
   const mockHttp = new MockHttp(null, null);
   const mockAuthService = new MockAuthService(null, null);
-  const mockLanguageService = new LanguageBCP47Service();
-  const service = new ToolGroupService(mockHttp, mockAuthService, mockLanguageService);
+  const service = new ToolGroupService(mockHttp, mockAuthService);
 
   const toolGroup = new ToolGroup();
 
   describe('Get Single Tool Group', () => {
-
     beforeEach(() => {
       spyOn(mockHttp, 'get').and.returnValue(
         Observable.create((observer) => {
@@ -44,14 +43,20 @@ describe('ToolGroupService', () => {
     it('should fetch a single toolGroup', () => {
       const id = 7;
       service.getToolGroup(id);
-      expect(mockHttp.get).toHaveBeenCalledWith(`${toolGroupsUrl}/${id}?include=rules-language,rules-praxis,rules-country,tools,tools.tool`, headers);
+      expect(mockHttp.get).toHaveBeenCalledWith(
+        `${toolGroupsUrl}/${id}?include=rules-language,rules-praxis,rules-country,tools.tool`,
+        headers,
+      );
     });
 
     it('should return tool group with only languages', () => {
       const id = 8;
-      const includes = 'rules-language,rules-country'
+      const includes = 'rules-language,rules-country';
       service.getToolGroup(id, includes);
-      expect(mockHttp.get).toHaveBeenCalledWith(`${toolGroupsUrl}/${id}?include=${includes}`, headers);
+      expect(mockHttp.get).toHaveBeenCalledWith(
+        `${toolGroupsUrl}/${id}?include=${includes}`,
+        headers,
+      );
     });
   });
 
@@ -61,10 +66,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return [
-                toolGroup,
-                toolGroup,
-              ]
+              return [toolGroup, toolGroup];
             },
           });
           observer.complete();
@@ -84,7 +86,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return toolGroup
+              return toolGroup;
             },
           });
           observer.complete();
@@ -94,7 +96,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return toolGroup
+              return toolGroup;
             },
           });
           observer.complete();
@@ -131,7 +133,7 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
@@ -153,7 +155,7 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
@@ -161,7 +163,10 @@ describe('ToolGroupService', () => {
       const id = 8;
       service.deleteToolGroup(id);
 
-      expect(mockHttp.delete).toHaveBeenCalledWith(`${toolGroupsUrl}/${id}`, headers);
+      expect(mockHttp.delete).toHaveBeenCalledWith(
+        `${toolGroupsUrl}/${id}`,
+        headers,
+      );
     });
   });
 
@@ -173,7 +178,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return rule
+              return rule;
             },
           });
           observer.complete();
@@ -183,7 +188,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return rule
+              return rule;
             },
           });
           observer.complete();
@@ -203,20 +208,20 @@ describe('ToolGroupService', () => {
       );
     });
 
-    const toolGroupId = 8
-    const ruleId = 1
+    const toolGroupId = 8;
+    const ruleId = 1;
 
     it('should create a Country Rule', () => {
-      const negativeRule = false
-      const data = ['string', 'string2']
-      const type = 'country'
+      const negativeRule = false;
+      const data = ['string', 'string2'];
+      const type = 'country';
 
       service.createOrUpdateRule(
         toolGroupId,
         null,
         negativeRule,
         data,
-        type as RuleTypeEnum.COUNTRY
+        type as RuleTypeEnum.COUNTRY,
       );
 
       expect(mockHttp.post).toHaveBeenCalledWith(
@@ -230,24 +235,24 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
     it('should create a Praxis Rule', () => {
-      const negativeRule = true
+      const negativeRule = true;
       const data = {
-        confidence: ['1','5'],
-        openness: ['3','0']
-      }
-      const type = 'praxis'
+        confidence: ['1', '5'],
+        openness: ['3', '0'],
+      };
+      const type = 'praxis';
 
       service.createOrUpdateRule(
         toolGroupId,
         null,
         negativeRule,
         data,
-        type as RuleTypeEnum.PRAXIS
+        type as RuleTypeEnum.PRAXIS,
       );
 
       expect(mockHttp.post).toHaveBeenCalledWith(
@@ -261,21 +266,21 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
     it('should edit a Language Rule', () => {
-      const negativeRule = true
-      const data = ['string', 'string2']
-      const type = 'language'
+      const negativeRule = true;
+      const data = ['string', 'string2'];
+      const type = 'language';
 
       service.createOrUpdateRule(
         toolGroupId,
         ruleId,
         negativeRule,
         data,
-        type as RuleTypeEnum.LANGUAGE
+        type as RuleTypeEnum.LANGUAGE,
       );
 
       expect(mockHttp.put).toHaveBeenCalledWith(
@@ -289,60 +294,53 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
     it('should delete a country rule', () => {
-      service.deleteRule(toolGroupId, ruleId, 'country' as RuleTypeEnum.COUNTRY);
+      service.deleteRule(
+        toolGroupId,
+        ruleId,
+        'country' as RuleTypeEnum.COUNTRY,
+      );
       expect(mockHttp.delete).toHaveBeenCalledWith(
         `${toolGroupsUrl}/${toolGroupId}/rules-country/${ruleId}`,
-        headers
+        headers,
       );
     });
     it('should delete a praxis rule', () => {
       service.deleteRule(toolGroupId, ruleId, 'praxis' as RuleTypeEnum.PRAXIS);
       expect(mockHttp.delete).toHaveBeenCalledWith(
         `${toolGroupsUrl}/${toolGroupId}/rules-praxis/${ruleId}`,
-        headers
+        headers,
       );
     });
     it('should delete a language rule', () => {
-      service.deleteRule(toolGroupId, ruleId, 'language' as RuleTypeEnum.LANGUAGE);
+      service.deleteRule(
+        toolGroupId,
+        ruleId,
+        'language' as RuleTypeEnum.LANGUAGE,
+      );
       expect(mockHttp.delete).toHaveBeenCalledWith(
         `${toolGroupsUrl}/${toolGroupId}/rules-language/${ruleId}`,
-        headers
+        headers,
       );
     });
   });
 
-  describe('getReadableValue', () => {
-    it('should return the correct value', () => {
-      const code = 'en-GB'
-      const value = service.getReadableValue(code, 'language' as RuleTypeEnum.LANGUAGE);
-
-      expect(value).toEqual({
-        code: 'en-GB',
-        language: 'English',
-        region: 'United Kingdom',
-        name: 'English (British)',
-      });
-    });
-  });
-
-
   describe('Create/Edit/Delete Tools', () => {
     const tool = {
       id: '1',
       suggestionsWeight: 2.5,
-    }
+    };
 
     beforeEach(() => {
       spyOn(mockHttp, 'post').and.returnValue(
         Observable.create((observer) => {
           observer.next({
             json() {
-              return tool
+              return tool;
             },
           });
           observer.complete();
@@ -352,7 +350,7 @@ describe('ToolGroupService', () => {
         Observable.create((observer) => {
           observer.next({
             json() {
-              return tool
+              return tool;
             },
           });
           observer.complete();
@@ -372,20 +370,20 @@ describe('ToolGroupService', () => {
       );
     });
 
-    const toolGroupId = 8
-    const id = '1'
-    const toolId = '1'
+    const toolGroupId = 8;
+    const id = '1';
+    const toolId = '1';
 
     it('should create a Tool', () => {
-      const suggestionsWeight = '2.0'
-      const isUpdate = false
+      const suggestionsWeight = '2.0';
+      const isUpdate = false;
 
       service.addOrUpdateTool(
         toolGroupId,
         null,
         toolId,
         suggestionsWeight,
-        isUpdate
+        isUpdate,
       );
 
       expect(mockHttp.post).toHaveBeenCalledWith(
@@ -406,20 +404,20 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
     it('should edit a Tool', () => {
-      const suggestionsWeight = '2.0'
-      const isUpdate = true
+      const suggestionsWeight = '2.0';
+      const isUpdate = true;
 
       service.addOrUpdateTool(
         toolGroupId,
         id,
         toolId,
         suggestionsWeight,
-        isUpdate
+        isUpdate,
       );
 
       expect(mockHttp.put).toHaveBeenCalledWith(
@@ -440,7 +438,7 @@ describe('ToolGroupService', () => {
             },
           },
         },
-        headers
+        headers,
       );
     });
 
@@ -448,7 +446,7 @@ describe('ToolGroupService', () => {
       service.deleteTool(toolGroupId, toolId);
       expect(mockHttp.delete).toHaveBeenCalledWith(
         `${toolGroupsUrl}/${toolGroupId}/tools/${id}`,
-        headers
+        headers,
       );
     });
   });
diff --git a/src/app/service/tool-group/tool-group.service.ts b/src/app/service/tool-group/tool-group.service.ts
index e532dd1a..9448b5a8 100644
--- a/src/app/service/tool-group/tool-group.service.ts
+++ b/src/app/service/tool-group/tool-group.service.ts
@@ -1,12 +1,7 @@
 import { Injectable } from '@angular/core';
 import { Http } from '@angular/http';
 import { JsonApiDataStore } from 'jsonapi-datastore';
-import { countries, ICountry } from 'countries-list';
 import { AuthService } from '../auth/auth.service';
-import {
-  LanguageBCP47Service,
-  LanguageBCP47,
-} from '../../service/languages-bcp47-tag.service';
 import { AbstractService } from '../abstract.service';
 import { ToolGroup, RuleTypeEnum } from '../../models/tool-group';
 import { environment } from '../../../environments/environment';
@@ -17,11 +12,7 @@ interface PraxisData {
 }
 @Injectable()
 export class ToolGroupService extends AbstractService {
-  constructor(
-    private http: Http,
-    private authService: AuthService,
-    private languageBCP47Service: LanguageBCP47Service,
-  ) {
+  constructor(private http: Http, private authService: AuthService) {
     super();
   }
   private readonly toolGroupsUrl = environment.base_url + 'tool-groups';
@@ -72,7 +63,7 @@ export class ToolGroupService extends AbstractService {
 
   getToolGroup(
     id: number,
-    include = 'rules-language,rules-praxis,rules-country,tools,tools.tool',
+    include = 'rules-language,rules-praxis,rules-country,tools.tool',
   ): Promise<ToolGroup> {
     return this.http
       .get(
@@ -84,7 +75,10 @@ export class ToolGroupService extends AbstractService {
       .catch(this.handleError);
   }
 
-  createOrUpdateToolGroup(toolGroup: ToolGroup, isUpdate: boolean): Promise<ToolGroup> {
+  createOrUpdateToolGroup(
+    toolGroup: ToolGroup,
+    isUpdate: boolean,
+  ): Promise<ToolGroup> {
     const payload = {
       data: {
         type: 'tool-group',
@@ -97,14 +91,14 @@ export class ToolGroupService extends AbstractService {
 
     if (isUpdate) {
       return this.http
-      .put(
-        `${this.toolGroupsUrl}/${toolGroup.id}`,
-        payload,
-        this.authService.getAuthorizationAndOptions(),
-      )
-      .toPromise()
-      .then((response) => new JsonApiDataStore().sync(response.json()))
-      .catch(this.handleError);
+        .put(
+          `${this.toolGroupsUrl}/${toolGroup.id}`,
+          payload,
+          this.authService.getAuthorizationAndOptions(),
+        )
+        .toPromise()
+        .then((response) => new JsonApiDataStore().sync(response.json()))
+        .catch(this.handleError);
     }
     return this.http
       .post(
@@ -223,15 +217,6 @@ export class ToolGroupService extends AbstractService {
       .catch(this.handleError);
   }
 
-  getReadableValue(code: string, type: RuleTypeEnum): LanguageBCP47 | ICountry {
-    if (type === RuleTypeEnum.LANGUAGE) {
-      return this.languageBCP47Service.getLanguage(code);
-    }
-    if (type === RuleTypeEnum.COUNTRY) {
-      return countries[code];
-    }
-  }
-
   addOrUpdateTool(
     toolGroupId: number,
     id: string,

From 984cebc1a0e87f3ee6dc5c14f2d7a3d35ad643bf Mon Sep 17 00:00:00 2001
From: Daniel Bisgrove <daniel@bizz-websites.com>
Date: Tue, 31 Oct 2023 12:22:02 -0400
Subject: [PATCH 4/5] Removing log

---
 .../tool-group-resource.component.spec.ts                        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
index 8d26b4e4..65fa453e 100644
--- a/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
+++ b/src/app/components/edit-tool-group-resource/tool-group-resource.component.spec.ts
@@ -114,7 +114,6 @@ describe('ToolGroupResourceComponent', () => {
       tool.suggestionsWeight = '50';
       comp.updateTool(tool);
       setTimeout(() => {
-        console.log('comp.tools', comp.tools);
         expect(comp.tools[0].suggestionsWeight).toEqual('50');
         done();
       });

From 9283b9ceeceecb54b015cb4190ac17912f6fc551 Mon Sep 17 00:00:00 2001
From: Daniel Bisgrove <daniel@bizz-websites.com>
Date: Tue, 31 Oct 2023 13:03:39 -0400
Subject: [PATCH 5/5] prettier fix

---
 .../update-tool-group/update-tool-group.component.ts         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
index a9397b1e..8419ebcd 100644
--- a/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
+++ b/src/app/components/edit-tool-group/update-tool-group/update-tool-group.component.ts
@@ -115,7 +115,10 @@ export class UpdateToolGroupComponent
       }
       if (type === RuleTypeEnum.PRAXIS) {
         // Test confidence
-        const confidenceValues = this.getValues(type, PraxisTypeEnum.CONFIDENCE);
+        const confidenceValues = this.getValues(
+          type,
+          PraxisTypeEnum.CONFIDENCE,
+        );
         const confidenceCodeChanges = !this.isEqual(
           confidenceValues.initialCodes,
           super.getCodes(this.selectedPraxisConfidence),