diff --git a/package.json b/package.json
index 461fde5d6a38a9176f6a7c387ae2e1f8d2b317bb..770ce3ae85a694e2154ec4ba013bb98430eb11c5 100644
--- a/package.json
+++ b/package.json
@@ -3,15 +3,8 @@
   "version": "2.4.0",
   "description": "HBP interactive atlas viewer. Integrating KG query, dataset previews & more. Based on humanbrainproject/nehuba & google/neuroglancer. Built with angular",
   "scripts": {
-    "dev-server-export": "webpack-dev-server --config webpack.export.js",
-    "build-export": "webpack --config webpack.export.js",
-    "build-export-min": "webpack --config webpack.export.min.js",
-    "build-export-aot": "webpack --config webpack.export.aot.js",
-    "build-aot": "PRODUCTION=true GIT_HASH=`jq -r '.version' package.json` webpack --config webpack.aot.js && node ./third_party/matomo/processMatomo.js",
-    "plugin-server": "node ./src/plugin_examples/server.js",
-    "dev-server": "BACKEND_URL=${BACKEND_URL:-http://localhost:3000/} webpack-dev-server --config webpack.dev.js --mode development",
-    "dev-server-aot": "BACKEND_URL=${BACKEND_URL:-http://localhost:3000/} PRODUCTION=true GIT_HASH=`jq -r '.version' package.json` webpack-dev-server --config webpack.dev-aot.js",
-    "dev-server-all-interfaces": "webpack-dev-server --config webpack.dev.js --mode development --hot --host 0.0.0.0",
+    "build-aot": "PRODUCTION=true GIT_HASH=`jq -r '.version' package.json` webpack --config ./webpack/webpack.aot.js && node ./third_party/matomo/processMatomo.js",
+    "dev-server-aot": "BACKEND_URL=${BACKEND_URL:-http://localhost:3000/} PRODUCTION=true GIT_HASH=`jq -r '.version' package.json` webpack-dev-server --config ./webpack/webpack.dev-aot.js",
     "test": "karma start spec/karma.conf.js",
     "e2e": "protractor e2e/protractor.conf",
     "lint": "eslint src --ext .ts",
diff --git a/src/ui/connectivityBrowser/connectivityBrowser.component.ts b/src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.component.ts
similarity index 98%
rename from src/ui/connectivityBrowser/connectivityBrowser.component.ts
rename to src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.component.ts
index 03f768c8a7b9968f5e5bef33d15a1ff812f89a4b..c2b6022478b973149e00d88b597c494378bb6272 100644
--- a/src/ui/connectivityBrowser/connectivityBrowser.component.ts
+++ b/src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.component.ts
@@ -71,6 +71,9 @@ export class ConnectivityBrowserComponent implements OnInit, AfterViewInit, OnDe
       })
     }
 
+    @Output()
+    connectivityDataReceived = new EventEmitter<any>()
+
     @Output()
     setOpenState: EventEmitter<boolean> = new EventEmitter()
 
@@ -132,7 +135,7 @@ export class ConnectivityBrowserComponent implements OnInit, AfterViewInit, OnDe
     constructor(
         private store$: Store<any>,
         private changeDetectionRef: ChangeDetectorRef,
-        private httpClient: HttpClient
+        private httpClient: HttpClient,
     ) {
 
       this.overwrittenColorMap$ = this.store$.pipe(
@@ -209,7 +212,7 @@ export class ConnectivityBrowserComponent implements OnInit, AfterViewInit, OnDe
           this.setColorMap$.pipe(
             distinctUntilChanged()
           ),
-          fromEvent(this.connectivityComponentElement.nativeElement, 'connectivityDataReceived').pipe(
+          fromEvent(this.connectivityComponentElement?.nativeElement, 'connectivityDataReceived').pipe(
             map((e: CustomEvent) => e.detail)
           )
         ).subscribe(([flag, connectedAreas]) => {
@@ -225,7 +228,6 @@ export class ConnectivityBrowserComponent implements OnInit, AfterViewInit, OnDe
               })
             )
             this.noDataReceived = false
-
             this.connectivityNumberReceived.emit(connectedAreas.length)
             this.connectedAreas = connectedAreas
 
diff --git a/src/ui/connectivityBrowser/connectivityBrowser.template.html b/src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.template.html
similarity index 98%
rename from src/ui/connectivityBrowser/connectivityBrowser.template.html
rename to src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.template.html
index 3f69aa9c292f8d61a236f30bad6f9f963938b84e..fa47192a66062082a8d29c557871a35bb6726a49 100644
--- a/src/ui/connectivityBrowser/connectivityBrowser.template.html
+++ b/src/atlasComponents/connectivity/connectivityBrowser/connectivityBrowser.template.html
@@ -1,5 +1,6 @@
 <div class="w-100 h-100 d-block d-flex flex-column pb-2">
     <hbp-connectivity-matrix-row
+            (connectivityDataReceived)="connectivityDataReceived.emit($event)"
             #connectivityComponent
             *ngIf="regionName"
             [region]="regionName + (regionHemisphere? ' - ' + regionHemisphere : '')"
diff --git a/src/atlasComponents/connectivity/index.ts b/src/atlasComponents/connectivity/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..c9a2e808fc6290283e77ea4bccff8f199eea3ca0
--- /dev/null
+++ b/src/atlasComponents/connectivity/index.ts
@@ -0,0 +1,2 @@
+export { ConnectivityBrowserComponent } from "./connectivityBrowser/connectivityBrowser.component";
+export { AtlasCmptConnModule } from "./module";
\ No newline at end of file
diff --git a/src/atlasComponents/connectivity/module.ts b/src/atlasComponents/connectivity/module.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8d629f66cfeb00b9f7b1f38fa45780725cac8f87
--- /dev/null
+++ b/src/atlasComponents/connectivity/module.ts
@@ -0,0 +1,24 @@
+import { CommonModule } from "@angular/common";
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from "@angular/core";
+import { AngularMaterialModule } from "src/ui/sharedModules/angularMaterial.module";
+import { DatabrowserModule } from "../databrowserModule";
+import { ConnectivityBrowserComponent } from "./connectivityBrowser/connectivityBrowser.component";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    DatabrowserModule,
+    AngularMaterialModule,
+  ],
+  declarations: [
+    ConnectivityBrowserComponent,
+  ],
+  exports: [
+    ConnectivityBrowserComponent,
+  ],
+  schemas: [
+    CUSTOM_ELEMENTS_SCHEMA,
+  ],
+})
+
+export class AtlasCmptConnModule{}
\ No newline at end of file
diff --git a/src/ui/databrowserModule/bulkDownload/bulkDownloadBtn.component.ts b/src/atlasComponents/databrowserModule/bulkDownload/bulkDownloadBtn.component.ts
similarity index 100%
rename from src/ui/databrowserModule/bulkDownload/bulkDownloadBtn.component.ts
rename to src/atlasComponents/databrowserModule/bulkDownload/bulkDownloadBtn.component.ts
diff --git a/src/ui/databrowserModule/bulkDownload/bulkDownloadBtn.template.html b/src/atlasComponents/databrowserModule/bulkDownload/bulkDownloadBtn.template.html
similarity index 100%
rename from src/ui/databrowserModule/bulkDownload/bulkDownloadBtn.template.html
rename to src/atlasComponents/databrowserModule/bulkDownload/bulkDownloadBtn.template.html
diff --git a/src/ui/databrowserModule/constants.ts b/src/atlasComponents/databrowserModule/constants.ts
similarity index 100%
rename from src/ui/databrowserModule/constants.ts
rename to src/atlasComponents/databrowserModule/constants.ts
diff --git a/src/ui/databrowserModule/contributor/index.ts b/src/atlasComponents/databrowserModule/contributor/index.ts
similarity index 100%
rename from src/ui/databrowserModule/contributor/index.ts
rename to src/atlasComponents/databrowserModule/contributor/index.ts
diff --git a/src/ui/databrowserModule/contributor/kgLink.pipe.ts b/src/atlasComponents/databrowserModule/contributor/kgLink.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/contributor/kgLink.pipe.ts
rename to src/atlasComponents/databrowserModule/contributor/kgLink.pipe.ts
diff --git a/src/ui/databrowserModule/contributor/module.ts b/src/atlasComponents/databrowserModule/contributor/module.ts
similarity index 100%
rename from src/ui/databrowserModule/contributor/module.ts
rename to src/atlasComponents/databrowserModule/contributor/module.ts
diff --git a/src/ui/databrowserModule/contributor/util.ts b/src/atlasComponents/databrowserModule/contributor/util.ts
similarity index 100%
rename from src/ui/databrowserModule/contributor/util.ts
rename to src/atlasComponents/databrowserModule/contributor/util.ts
diff --git a/src/ui/databrowserModule/databrowser.module.ts b/src/atlasComponents/databrowserModule/databrowser.module.ts
similarity index 99%
rename from src/ui/databrowserModule/databrowser.module.ts
rename to src/atlasComponents/databrowserModule/databrowser.module.ts
index b03aec66953c43b10a40dca97a1f308b85f4cfcd..60aa012d2ee3cb06d4f9364125156a8f2fc0ada1 100644
--- a/src/ui/databrowserModule/databrowser.module.ts
+++ b/src/atlasComponents/databrowserModule/databrowser.module.ts
@@ -40,7 +40,7 @@ import {
 import { ShownPreviewsDirective } from "./preview/shownPreviews.directive";
 import { FilterPreviewByType } from "./preview/filterPreview.pipe";
 import { PreviewCardComponent } from "./preview/previewCard/previewCard.component";
-import { LayerBrowserModule } from "../layerbrowser";
+import { LayerBrowserModule } from "../../ui/layerbrowser";
 import { DatabrowserDirective } from "./databrowser/databrowser.directive";
 import { ContributorModule } from "./contributor";
 import { DatabrowserService } from "./databrowser.service";
diff --git a/src/ui/databrowserModule/databrowser.service.spec.ts b/src/atlasComponents/databrowserModule/databrowser.service.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser.service.spec.ts
rename to src/atlasComponents/databrowserModule/databrowser.service.spec.ts
diff --git a/src/ui/databrowserModule/databrowser.service.ts b/src/atlasComponents/databrowserModule/databrowser.service.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser.service.ts
rename to src/atlasComponents/databrowserModule/databrowser.service.ts
diff --git a/src/ui/databrowserModule/databrowser.useEffect.spec.ts b/src/atlasComponents/databrowserModule/databrowser.useEffect.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser.useEffect.spec.ts
rename to src/atlasComponents/databrowserModule/databrowser.useEffect.spec.ts
diff --git a/src/ui/databrowserModule/databrowser.useEffect.ts b/src/atlasComponents/databrowserModule/databrowser.useEffect.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser.useEffect.ts
rename to src/atlasComponents/databrowserModule/databrowser.useEffect.ts
diff --git a/src/ui/databrowserModule/databrowser/databrowser.base.ts b/src/atlasComponents/databrowserModule/databrowser/databrowser.base.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser/databrowser.base.ts
rename to src/atlasComponents/databrowserModule/databrowser/databrowser.base.ts
diff --git a/src/ui/databrowserModule/databrowser/databrowser.component.ts b/src/atlasComponents/databrowserModule/databrowser/databrowser.component.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser/databrowser.component.ts
rename to src/atlasComponents/databrowserModule/databrowser/databrowser.component.ts
diff --git a/src/ui/databrowserModule/databrowser/databrowser.directive.ts b/src/atlasComponents/databrowserModule/databrowser/databrowser.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/databrowser/databrowser.directive.ts
rename to src/atlasComponents/databrowserModule/databrowser/databrowser.directive.ts
diff --git a/src/ui/databrowserModule/databrowser/databrowser.style.css b/src/atlasComponents/databrowserModule/databrowser/databrowser.style.css
similarity index 100%
rename from src/ui/databrowserModule/databrowser/databrowser.style.css
rename to src/atlasComponents/databrowserModule/databrowser/databrowser.style.css
diff --git a/src/ui/databrowserModule/databrowser/databrowser.template.html b/src/atlasComponents/databrowserModule/databrowser/databrowser.template.html
similarity index 100%
rename from src/ui/databrowserModule/databrowser/databrowser.template.html
rename to src/atlasComponents/databrowserModule/databrowser/databrowser.template.html
diff --git a/src/ui/databrowserModule/index.ts b/src/atlasComponents/databrowserModule/index.ts
similarity index 100%
rename from src/ui/databrowserModule/index.ts
rename to src/atlasComponents/databrowserModule/index.ts
diff --git a/src/ui/databrowserModule/kgSingleDatasetService.service.ts b/src/atlasComponents/databrowserModule/kgSingleDatasetService.service.ts
similarity index 100%
rename from src/ui/databrowserModule/kgSingleDatasetService.service.ts
rename to src/atlasComponents/databrowserModule/kgSingleDatasetService.service.ts
diff --git a/src/ui/databrowserModule/modalityPicker/modalityPicker.component.spec.ts b/src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.component.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/modalityPicker/modalityPicker.component.spec.ts
rename to src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.component.spec.ts
diff --git a/src/ui/databrowserModule/modalityPicker/modalityPicker.component.ts b/src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.component.ts
similarity index 100%
rename from src/ui/databrowserModule/modalityPicker/modalityPicker.component.ts
rename to src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.component.ts
diff --git a/src/ui/databrowserModule/modalityPicker/modalityPicker.style.css b/src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.style.css
similarity index 100%
rename from src/ui/databrowserModule/modalityPicker/modalityPicker.style.css
rename to src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.style.css
diff --git a/src/ui/databrowserModule/modalityPicker/modalityPicker.template.html b/src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.template.html
similarity index 100%
rename from src/ui/databrowserModule/modalityPicker/modalityPicker.template.html
rename to src/atlasComponents/databrowserModule/modalityPicker/modalityPicker.template.html
diff --git a/src/ui/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.component.ts b/src/atlasComponents/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.component.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.component.ts
rename to src/atlasComponents/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.component.ts
diff --git a/src/ui/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.template.html b/src/atlasComponents/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.template.html
similarity index 100%
rename from src/ui/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.template.html
rename to src/atlasComponents/databrowserModule/preview/datasetPreviews/datasetPreviewsList/datasetPreviewList.template.html
diff --git a/src/ui/databrowserModule/preview/filterPreview.pipe.ts b/src/atlasComponents/databrowserModule/preview/filterPreview.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/filterPreview.pipe.ts
rename to src/atlasComponents/databrowserModule/preview/filterPreview.pipe.ts
diff --git a/src/ui/databrowserModule/preview/preview.base.ts b/src/atlasComponents/databrowserModule/preview/preview.base.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/preview.base.ts
rename to src/atlasComponents/databrowserModule/preview/preview.base.ts
diff --git a/src/ui/databrowserModule/preview/previewCard/previewCard.component.ts b/src/atlasComponents/databrowserModule/preview/previewCard/previewCard.component.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewCard/previewCard.component.ts
rename to src/atlasComponents/databrowserModule/preview/previewCard/previewCard.component.ts
diff --git a/src/ui/databrowserModule/preview/previewCard/previewCard.style.css b/src/atlasComponents/databrowserModule/preview/previewCard/previewCard.style.css
similarity index 100%
rename from src/ui/databrowserModule/preview/previewCard/previewCard.style.css
rename to src/atlasComponents/databrowserModule/preview/previewCard/previewCard.style.css
diff --git a/src/ui/databrowserModule/preview/previewCard/previewCard.template.html b/src/atlasComponents/databrowserModule/preview/previewCard/previewCard.template.html
similarity index 100%
rename from src/ui/databrowserModule/preview/previewCard/previewCard.template.html
rename to src/atlasComponents/databrowserModule/preview/previewCard/previewCard.template.html
diff --git a/src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.component.ts b/src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.component.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.component.ts
rename to src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.component.ts
diff --git a/src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.style.css b/src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.style.css
similarity index 100%
rename from src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.style.css
rename to src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.style.css
diff --git a/src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.template.html b/src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.template.html
similarity index 100%
rename from src/ui/databrowserModule/preview/previewComponentWrapper/previewCW.template.html
rename to src/atlasComponents/databrowserModule/preview/previewComponentWrapper/previewCW.template.html
diff --git a/src/ui/databrowserModule/preview/previewDatasetFile.directive.spec.ts b/src/atlasComponents/databrowserModule/preview/previewDatasetFile.directive.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewDatasetFile.directive.spec.ts
rename to src/atlasComponents/databrowserModule/preview/previewDatasetFile.directive.spec.ts
diff --git a/src/ui/databrowserModule/preview/previewDatasetFile.directive.ts b/src/atlasComponents/databrowserModule/preview/previewDatasetFile.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewDatasetFile.directive.ts
rename to src/atlasComponents/databrowserModule/preview/previewDatasetFile.directive.ts
diff --git a/src/ui/databrowserModule/preview/previewFileIcon.pipe.ts b/src/atlasComponents/databrowserModule/preview/previewFileIcon.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewFileIcon.pipe.ts
rename to src/atlasComponents/databrowserModule/preview/previewFileIcon.pipe.ts
diff --git a/src/ui/databrowserModule/preview/previewFileType.pipe.ts b/src/atlasComponents/databrowserModule/preview/previewFileType.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/previewFileType.pipe.ts
rename to src/atlasComponents/databrowserModule/preview/previewFileType.pipe.ts
diff --git a/src/ui/databrowserModule/preview/shownPreviews.directive.ts b/src/atlasComponents/databrowserModule/preview/shownPreviews.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/preview/shownPreviews.directive.ts
rename to src/atlasComponents/databrowserModule/preview/shownPreviews.directive.ts
diff --git a/src/ui/databrowserModule/pure.spec.ts b/src/atlasComponents/databrowserModule/pure.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/pure.spec.ts
rename to src/atlasComponents/databrowserModule/pure.spec.ts
diff --git a/src/ui/databrowserModule/pure.ts b/src/atlasComponents/databrowserModule/pure.ts
similarity index 100%
rename from src/ui/databrowserModule/pure.ts
rename to src/atlasComponents/databrowserModule/pure.ts
diff --git a/src/ui/databrowserModule/showDatasetDialog.directive.spec.ts b/src/atlasComponents/databrowserModule/showDatasetDialog.directive.spec.ts
similarity index 98%
rename from src/ui/databrowserModule/showDatasetDialog.directive.spec.ts
rename to src/atlasComponents/databrowserModule/showDatasetDialog.directive.spec.ts
index 18fa8349d210f0f86fdc82ecd8a2af4efaf57db4..4dbac0cb6856c0bacb1218aef34d2e66a456d666 100644
--- a/src/ui/databrowserModule/showDatasetDialog.directive.spec.ts
+++ b/src/atlasComponents/databrowserModule/showDatasetDialog.directive.spec.ts
@@ -1,6 +1,6 @@
 import { Component } from "@angular/core";
 import { async, TestBed } from "@angular/core/testing";
-import { AngularMaterialModule } from "../sharedModules/angularMaterial.module";
+import { AngularMaterialModule } from "../../ui/sharedModules/angularMaterial.module";
 import { ShowDatasetDialogDirective, IAV_DATASET_SHOW_DATASET_DIALOG_CMP } from "./showDatasetDialog.directive";
 import { By } from "@angular/platform-browser";
 import { MatDialog } from "@angular/material/dialog";
diff --git a/src/ui/databrowserModule/showDatasetDialog.directive.ts b/src/atlasComponents/databrowserModule/showDatasetDialog.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/showDatasetDialog.directive.ts
rename to src/atlasComponents/databrowserModule/showDatasetDialog.directive.ts
diff --git a/src/ui/databrowserModule/shownDataset.directive.ts b/src/atlasComponents/databrowserModule/shownDataset.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/shownDataset.directive.ts
rename to src/atlasComponents/databrowserModule/shownDataset.directive.ts
diff --git a/src/ui/databrowserModule/singleDataset/detailedView/singleDataset.component.spec.ts b/src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.component.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/detailedView/singleDataset.component.spec.ts
rename to src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.component.spec.ts
diff --git a/src/ui/databrowserModule/singleDataset/detailedView/singleDataset.component.ts b/src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.component.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/detailedView/singleDataset.component.ts
rename to src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.component.ts
diff --git a/src/ui/databrowserModule/singleDataset/detailedView/singleDataset.style.css b/src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.style.css
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/detailedView/singleDataset.style.css
rename to src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.style.css
diff --git a/src/ui/databrowserModule/singleDataset/detailedView/singleDataset.template.html b/src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.template.html
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/detailedView/singleDataset.template.html
rename to src/atlasComponents/databrowserModule/singleDataset/detailedView/singleDataset.template.html
diff --git a/src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.component.ts b/src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.component.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.component.ts
rename to src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.component.ts
diff --git a/src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.style.css b/src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.style.css
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.style.css
rename to src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.style.css
diff --git a/src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.template.html b/src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.template.html
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/listView/singleDatasetListView.template.html
rename to src/atlasComponents/databrowserModule/singleDataset/listView/singleDatasetListView.template.html
diff --git a/src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.component.ts b/src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.component.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.component.ts
rename to src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.component.ts
diff --git a/src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.style.css b/src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.style.css
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.style.css
rename to src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.style.css
diff --git a/src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.template.html b/src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.template.html
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/sideNavView/sDsSideNavView.template.html
rename to src/atlasComponents/databrowserModule/singleDataset/sideNavView/sDsSideNavView.template.html
diff --git a/src/ui/databrowserModule/singleDataset/singleDataset.base.spec.ts b/src/atlasComponents/databrowserModule/singleDataset/singleDataset.base.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/singleDataset.base.spec.ts
rename to src/atlasComponents/databrowserModule/singleDataset/singleDataset.base.spec.ts
diff --git a/src/ui/databrowserModule/singleDataset/singleDataset.base.ts b/src/atlasComponents/databrowserModule/singleDataset/singleDataset.base.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/singleDataset.base.ts
rename to src/atlasComponents/databrowserModule/singleDataset/singleDataset.base.ts
diff --git a/src/ui/databrowserModule/singleDataset/singleDataset.directive.ts b/src/atlasComponents/databrowserModule/singleDataset/singleDataset.directive.ts
similarity index 100%
rename from src/ui/databrowserModule/singleDataset/singleDataset.directive.ts
rename to src/atlasComponents/databrowserModule/singleDataset/singleDataset.directive.ts
diff --git a/src/ui/databrowserModule/store.module.ts b/src/atlasComponents/databrowserModule/store.module.ts
similarity index 100%
rename from src/ui/databrowserModule/store.module.ts
rename to src/atlasComponents/databrowserModule/store.module.ts
diff --git a/src/ui/databrowserModule/util/aggregateArrayIntoRoot.pipe.ts b/src/atlasComponents/databrowserModule/util/aggregateArrayIntoRoot.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/aggregateArrayIntoRoot.pipe.ts
rename to src/atlasComponents/databrowserModule/util/aggregateArrayIntoRoot.pipe.ts
diff --git a/src/ui/databrowserModule/util/appendFilterModality.pipe.ts b/src/atlasComponents/databrowserModule/util/appendFilterModality.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/appendFilterModality.pipe.ts
rename to src/atlasComponents/databrowserModule/util/appendFilterModality.pipe.ts
diff --git a/src/ui/databrowserModule/util/copyProperty.pipe.spec.ts b/src/atlasComponents/databrowserModule/util/copyProperty.pipe.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/util/copyProperty.pipe.spec.ts
rename to src/atlasComponents/databrowserModule/util/copyProperty.pipe.spec.ts
diff --git a/src/ui/databrowserModule/util/copyProperty.pipe.ts b/src/atlasComponents/databrowserModule/util/copyProperty.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/copyProperty.pipe.ts
rename to src/atlasComponents/databrowserModule/util/copyProperty.pipe.ts
diff --git a/src/ui/databrowserModule/util/datasetIsFaved.pipe.ts b/src/atlasComponents/databrowserModule/util/datasetIsFaved.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/datasetIsFaved.pipe.ts
rename to src/atlasComponents/databrowserModule/util/datasetIsFaved.pipe.ts
diff --git a/src/ui/databrowserModule/util/filterDataEntriesByMethods.pipe.ts b/src/atlasComponents/databrowserModule/util/filterDataEntriesByMethods.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/filterDataEntriesByMethods.pipe.ts
rename to src/atlasComponents/databrowserModule/util/filterDataEntriesByMethods.pipe.ts
diff --git a/src/ui/databrowserModule/util/filterDataEntriesByRegion.pipe.spec.ts b/src/atlasComponents/databrowserModule/util/filterDataEntriesByRegion.pipe.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/util/filterDataEntriesByRegion.pipe.spec.ts
rename to src/atlasComponents/databrowserModule/util/filterDataEntriesByRegion.pipe.spec.ts
diff --git a/src/ui/databrowserModule/util/filterDataEntriesByRegion.pipe.ts b/src/atlasComponents/databrowserModule/util/filterDataEntriesByRegion.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/filterDataEntriesByRegion.pipe.ts
rename to src/atlasComponents/databrowserModule/util/filterDataEntriesByRegion.pipe.ts
diff --git a/src/ui/databrowserModule/util/getKgSchemaIdFromFullId.pipe.ts b/src/atlasComponents/databrowserModule/util/getKgSchemaIdFromFullId.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/getKgSchemaIdFromFullId.pipe.ts
rename to src/atlasComponents/databrowserModule/util/getKgSchemaIdFromFullId.pipe.ts
diff --git a/src/ui/databrowserModule/util/pathToNestedChildren.pipe.spec.ts b/src/atlasComponents/databrowserModule/util/pathToNestedChildren.pipe.spec.ts
similarity index 100%
rename from src/ui/databrowserModule/util/pathToNestedChildren.pipe.spec.ts
rename to src/atlasComponents/databrowserModule/util/pathToNestedChildren.pipe.spec.ts
diff --git a/src/ui/databrowserModule/util/pathToNestedChildren.pipe.ts b/src/atlasComponents/databrowserModule/util/pathToNestedChildren.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/pathToNestedChildren.pipe.ts
rename to src/atlasComponents/databrowserModule/util/pathToNestedChildren.pipe.ts
diff --git a/src/ui/databrowserModule/util/previewFileDisabledByReferenceSpace.pipe.ts b/src/atlasComponents/databrowserModule/util/previewFileDisabledByReferenceSpace.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/previewFileDisabledByReferenceSpace.pipe.ts
rename to src/atlasComponents/databrowserModule/util/previewFileDisabledByReferenceSpace.pipe.ts
diff --git a/src/ui/databrowserModule/util/regionBackgroundToRgb.pipe.ts b/src/atlasComponents/databrowserModule/util/regionBackgroundToRgb.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/regionBackgroundToRgb.pipe.ts
rename to src/atlasComponents/databrowserModule/util/regionBackgroundToRgb.pipe.ts
diff --git a/src/ui/databrowserModule/util/resetCounterModality.pipe.ts b/src/atlasComponents/databrowserModule/util/resetCounterModality.pipe.ts
similarity index 100%
rename from src/ui/databrowserModule/util/resetCounterModality.pipe.ts
rename to src/atlasComponents/databrowserModule/util/resetCounterModality.pipe.ts
diff --git a/src/atlasComponents/parcellation/index.ts b/src/atlasComponents/parcellation/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4af8252e223c89fce580454087e7038563e1fab4
--- /dev/null
+++ b/src/atlasComponents/parcellation/index.ts
@@ -0,0 +1,4 @@
+export { FilterNameBySearch } from "./regionHierachy/filterNameBySearch.pipe";
+export { AtlasCmpParcellationModule } from "./module";
+export { RegionHierarchy } from "./regionHierachy/regionHierarchy.component";
+export { RegionTextSearchAutocomplete } from "./regionSearch/regionSearch.component";
diff --git a/src/atlasComponents/parcellation/module.ts b/src/atlasComponents/parcellation/module.ts
new file mode 100644
index 0000000000000000000000000000000000000000..78821146430138aa7afe3998ce3959c09f3c099f
--- /dev/null
+++ b/src/atlasComponents/parcellation/module.ts
@@ -0,0 +1,34 @@
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { AngularMaterialModule } from "src/ui/sharedModules/angularMaterial.module";
+import { ParcellationRegionModule } from "src/atlasComponents/parcellationRegion";
+import { RegionHierarchy } from "./regionHierachy/regionHierarchy.component";
+import { RegionTextSearchAutocomplete } from "./regionSearch/regionSearch.component";
+import { FilterNameBySearch } from "./regionHierachy/filterNameBySearch.pipe";
+import { UtilModule } from "src/util";
+import { FormsModule, ReactiveFormsModule } from "@angular/forms";
+import { ComponentsModule } from "src/components";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    UtilModule,
+    FormsModule,
+    ReactiveFormsModule,
+    AngularMaterialModule,
+    ParcellationRegionModule,
+    ComponentsModule,
+  ],
+  declarations: [
+    RegionHierarchy,
+    RegionTextSearchAutocomplete,
+
+    FilterNameBySearch,
+  ],
+  exports: [
+    RegionHierarchy,
+    RegionTextSearchAutocomplete,
+    FilterNameBySearch,
+  ]
+})
+export class AtlasCmpParcellationModule{}
\ No newline at end of file
diff --git a/src/ui/viewerStateController/regionHierachy/filterNameBySearch.pipe.ts b/src/atlasComponents/parcellation/regionHierachy/filterNameBySearch.pipe.ts
similarity index 100%
rename from src/ui/viewerStateController/regionHierachy/filterNameBySearch.pipe.ts
rename to src/atlasComponents/parcellation/regionHierachy/filterNameBySearch.pipe.ts
diff --git a/src/ui/viewerStateController/regionHierachy/regionHierarchy.component.ts b/src/atlasComponents/parcellation/regionHierachy/regionHierarchy.component.ts
similarity index 97%
rename from src/ui/viewerStateController/regionHierachy/regionHierarchy.component.ts
rename to src/atlasComponents/parcellation/regionHierachy/regionHierarchy.component.ts
index 2534f5548129666f3201ea821e1319c6b2bbc572..715f000757552e41ee4e67ace06e9de56006e69e 100644
--- a/src/ui/viewerStateController/regionHierachy/regionHierarchy.component.ts
+++ b/src/atlasComponents/parcellation/regionHierachy/regionHierarchy.component.ts
@@ -1,8 +1,8 @@
 import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostListener, Input, OnInit, Output, ViewChild } from "@angular/core";
 import { fromEvent, Subject, Subscription } from "rxjs";
 import { buffer, debounceTime } from "rxjs/operators";
-import { generateLabelIndexId } from "src/services/stateStore.service";
 import { FilterNameBySearch } from "./filterNameBySearch.pipe";
+import { serialiseParcellationRegion } from "common/util"
 
 const insertHighlight: (name: string, searchTerm: string) => string = (name: string, searchTerm: string = '') => {
   const regex = new RegExp(searchTerm, 'gi')
@@ -15,7 +15,7 @@ const getDisplayTreeNode: (searchTerm: string, selectedRegions: any[]) => (item:
   return !!labelIndex
     && !!ngId
     && selectedRegions.findIndex(re =>
-      generateLabelIndexId({ labelIndex: re.labelIndex, ngId: re.ngId }) === generateLabelIndexId({ ngId, labelIndex }),
+      serialiseParcellationRegion({ labelIndex: re.labelIndex, ngId: re.ngId }) === serialiseParcellationRegion({ ngId, labelIndex }),
     ) >= 0
     ? `<span class="cursor-default regionSelected">${insertHighlight(name, searchTerm)}</span>` + (status ? ` <span class="text-muted">(${insertHighlight(status, searchTerm)})</span>` : ``)
     : `<span class="cursor-default regionNotSelected">${insertHighlight(name, searchTerm)}</span>` + (status ? ` <span class="text-muted">(${insertHighlight(status, searchTerm)})</span>` : ``)
diff --git a/src/ui/viewerStateController/regionHierachy/regionHierarchy.style.css b/src/atlasComponents/parcellation/regionHierachy/regionHierarchy.style.css
similarity index 100%
rename from src/ui/viewerStateController/regionHierachy/regionHierarchy.style.css
rename to src/atlasComponents/parcellation/regionHierachy/regionHierarchy.style.css
diff --git a/src/ui/viewerStateController/regionHierachy/regionHierarchy.template.html b/src/atlasComponents/parcellation/regionHierachy/regionHierarchy.template.html
similarity index 100%
rename from src/ui/viewerStateController/regionHierachy/regionHierarchy.template.html
rename to src/atlasComponents/parcellation/regionHierachy/regionHierarchy.template.html
diff --git a/src/ui/viewerStateController/regionSearch/regionSearch.component.ts b/src/atlasComponents/parcellation/regionSearch/regionSearch.component.ts
similarity index 95%
rename from src/ui/viewerStateController/regionSearch/regionSearch.component.ts
rename to src/atlasComponents/parcellation/regionSearch/regionSearch.component.ts
index c5989bbb4f29ac46ba5ce1d05fc87974f95c95da..87a600839de215e162a3baf9dd6ba82d7446c8eb 100644
--- a/src/ui/viewerStateController/regionSearch/regionSearch.component.ts
+++ b/src/atlasComponents/parcellation/regionSearch/regionSearch.component.ts
@@ -5,13 +5,14 @@ import { combineLatest, Observable, Subject, merge } from "rxjs";
 import { debounceTime, distinctUntilChanged, filter, map, shareReplay, startWith, take, tap, withLatestFrom } from "rxjs/operators";
 import { VIEWER_STATE_ACTION_TYPES } from "src/services/effect/effect";
 import { ADD_TO_REGIONS_SELECTION_WITH_IDS, CHANGE_NAVIGATION, SELECT_REGIONS } from "src/services/state/viewerState.store";
-import { generateLabelIndexId, getMultiNgIdsRegionsLabelIndexMap, IavRootStoreInterface } from "src/services/stateStore.service";
+import { getMultiNgIdsRegionsLabelIndexMap } from "src/services/stateStore.service";
 import { LoggingService } from "src/logging";
 import { MatDialog } from "@angular/material/dialog";
 import { MatAutocompleteSelectedEvent } from "@angular/material/autocomplete";
 import { PureContantService } from "src/util";
 import { viewerStateToggleRegionSelect, viewerStateNavigateToRegion, viewerStateSetSelectedRegions, viewerStateSetSelectedRegionsWithIds } from "src/services/state/viewerState.store.helper";
 import { ARIA_LABELS, CONST } from 'common/constants'
+import { serialiseParcellationRegion } from "common/util"
 
 const filterRegionBasedOnText = searchTerm => region => `${region.name.toLowerCase()}${region.status? ' (' + region.status + ')' : null}`.includes(searchTerm.toLowerCase())
   || (region.relatedAreas && region.relatedAreas.some(relatedArea => relatedArea.name && relatedArea.name.toLowerCase().includes(searchTerm.toLowerCase())))
@@ -53,7 +54,7 @@ export class RegionTextSearchAutocomplete {
   public selectedRegionLabelIndexSet: Set<string> = new Set()
 
   constructor(
-    private store$: Store<IavRootStoreInterface>,
+    private store$: Store<any>,
     private dialog: MatDialog,
     private pureConstantService: PureContantService,
     private log: LoggingService
@@ -80,7 +81,7 @@ export class RegionTextSearchAutocomplete {
                 ...region,
                 ngId,
                 labelIndex,
-                labelIndexId: generateLabelIndexId({ ngId, labelIndex }),
+                labelIndexId: serialiseParcellationRegion({ ngId, labelIndex }),
               })
             }
           }
@@ -97,7 +98,7 @@ export class RegionTextSearchAutocomplete {
       select('regionsSelected'),
       distinctUntilChanged(),
       tap(regions => {
-        const arrLabelIndexId = regions.map(({ ngId, labelIndex }) => generateLabelIndexId({ ngId, labelIndex }))
+        const arrLabelIndexId = regions.map(({ ngId, labelIndex }) => serialiseParcellationRegion({ ngId, labelIndex }))
         this.selectedRegionLabelIndexSet = new Set(arrLabelIndexId)
       }),
       startWith([]),
diff --git a/src/ui/viewerStateController/regionSearch/regionSearch.style.css b/src/atlasComponents/parcellation/regionSearch/regionSearch.style.css
similarity index 100%
rename from src/ui/viewerStateController/regionSearch/regionSearch.style.css
rename to src/atlasComponents/parcellation/regionSearch/regionSearch.style.css
diff --git a/src/ui/viewerStateController/regionSearch/regionSearch.template.html b/src/atlasComponents/parcellation/regionSearch/regionSearch.template.html
similarity index 100%
rename from src/ui/viewerStateController/regionSearch/regionSearch.template.html
rename to src/atlasComponents/parcellation/regionSearch/regionSearch.template.html
diff --git a/src/atlasComponents/parcellationRegion/index.ts b/src/atlasComponents/parcellationRegion/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b3f4198bc8c372d02e1c43b01cd9809d18de3d1c
--- /dev/null
+++ b/src/atlasComponents/parcellationRegion/index.ts
@@ -0,0 +1,10 @@
+export {
+  ParcellationRegionModule,
+} from "./module"
+
+
+export { RegionDirective } from "./region.directive";
+export { RegionListSimpleViewComponent } from "./regionListSimpleView/regionListSimpleView.component";
+export { RegionMenuComponent } from "./regionMenu/regionMenu.component";
+export { SimpleRegionComponent } from "./regionSimple/regionSimple.component";
+export { RenderViewOriginDatasetLabelPipe } from "./region.base";
\ No newline at end of file
diff --git a/src/atlasComponents/parcellationRegion/module.ts b/src/atlasComponents/parcellationRegion/module.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1e400b5e25835f7ae6cee44a939f993b2e1f2253
--- /dev/null
+++ b/src/atlasComponents/parcellationRegion/module.ts
@@ -0,0 +1,39 @@
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { ComponentsModule } from "src/components";
+import { DatabrowserModule } from "src/atlasComponents/databrowserModule";
+import { AngularMaterialModule } from "src/ui/sharedModules/angularMaterial.module";
+import { UtilModule } from "src/util";
+import { RenderViewOriginDatasetLabelPipe } from "./region.base";
+import { RegionDirective } from "./region.directive";
+import { RegionListSimpleViewComponent } from "./regionListSimpleView/regionListSimpleView.component";
+import { RegionMenuComponent } from "./regionMenu/regionMenu.component";
+import { SimpleRegionComponent } from "./regionSimple/regionSimple.component";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    UtilModule,
+    DatabrowserModule,
+    AngularMaterialModule,
+    ComponentsModule,
+  ],
+  declarations: [
+    RegionMenuComponent,
+    RegionListSimpleViewComponent,
+    SimpleRegionComponent,
+
+    RegionDirective,
+    RenderViewOriginDatasetLabelPipe,
+  ],
+  exports: [
+    RegionMenuComponent,
+    RegionListSimpleViewComponent,
+    SimpleRegionComponent,
+
+    RegionDirective,
+    RenderViewOriginDatasetLabelPipe,
+  ]
+})
+
+export class ParcellationRegionModule{}
\ No newline at end of file
diff --git a/src/ui/parcellationRegion/region.base.spec.ts b/src/atlasComponents/parcellationRegion/region.base.spec.ts
similarity index 100%
rename from src/ui/parcellationRegion/region.base.spec.ts
rename to src/atlasComponents/parcellationRegion/region.base.spec.ts
diff --git a/src/ui/parcellationRegion/region.base.ts b/src/atlasComponents/parcellationRegion/region.base.ts
similarity index 100%
rename from src/ui/parcellationRegion/region.base.ts
rename to src/atlasComponents/parcellationRegion/region.base.ts
diff --git a/src/ui/parcellationRegion/region.directive.ts b/src/atlasComponents/parcellationRegion/region.directive.ts
similarity index 100%
rename from src/ui/parcellationRegion/region.directive.ts
rename to src/atlasComponents/parcellationRegion/region.directive.ts
diff --git a/src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.component.ts b/src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.component.ts
similarity index 100%
rename from src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.component.ts
rename to src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.component.ts
diff --git a/src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.style.css b/src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.style.css
similarity index 100%
rename from src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.style.css
rename to src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.style.css
diff --git a/src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.template.html b/src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.template.html
similarity index 100%
rename from src/ui/parcellationRegion/regionListSimpleView/regionListSimpleView.template.html
rename to src/atlasComponents/parcellationRegion/regionListSimpleView/regionListSimpleView.template.html
diff --git a/src/ui/parcellationRegion/regionMenu/regionMenu.component.spec.ts b/src/atlasComponents/parcellationRegion/regionMenu/regionMenu.component.spec.ts
similarity index 100%
rename from src/ui/parcellationRegion/regionMenu/regionMenu.component.spec.ts
rename to src/atlasComponents/parcellationRegion/regionMenu/regionMenu.component.spec.ts
diff --git a/src/ui/parcellationRegion/regionMenu/regionMenu.component.ts b/src/atlasComponents/parcellationRegion/regionMenu/regionMenu.component.ts
similarity index 100%
rename from src/ui/parcellationRegion/regionMenu/regionMenu.component.ts
rename to src/atlasComponents/parcellationRegion/regionMenu/regionMenu.component.ts
diff --git a/src/ui/parcellationRegion/regionMenu/regionMenu.style.css b/src/atlasComponents/parcellationRegion/regionMenu/regionMenu.style.css
similarity index 100%
rename from src/ui/parcellationRegion/regionMenu/regionMenu.style.css
rename to src/atlasComponents/parcellationRegion/regionMenu/regionMenu.style.css
diff --git a/src/ui/parcellationRegion/regionMenu/regionMenu.template.html b/src/atlasComponents/parcellationRegion/regionMenu/regionMenu.template.html
similarity index 93%
rename from src/ui/parcellationRegion/regionMenu/regionMenu.template.html
rename to src/atlasComponents/parcellationRegion/regionMenu/regionMenu.template.html
index 65f9d1b40ad7a03247fd7248a62e396e05d281ba..ac243dc5cf13882cadeafd73c0ddb4ce3700fc8b 100644
--- a/src/ui/parcellationRegion/regionMenu/regionMenu.template.html
+++ b/src/atlasComponents/parcellationRegion/regionMenu/regionMenu.template.html
@@ -108,18 +108,6 @@
   </div>
 </mat-card>
 
-<!-- ToDo make dynamic with AVAILABLE CONNECTIVITY DATASETS data - get info from atlas viewer core -->
-<mat-menu
-  #connectivitySourceDatasets="matMenu"
-  xPosition="before"
-  hasBackdrop="false">
-  <div>
-    <button mat-menu-item (mousedown)="showConnectivity(region.name)">
-      <span>1000 Brain Study - DTI connectivity</span>
-    </button>
-  </div>
-</mat-menu>
-
 <!-- template for switching template -->
 <mat-menu #regionInOtherTemplatesMenu="matMenu"
   [aria-label]="SHOW_IN_OTHER_REF_SPACE">
diff --git a/src/ui/parcellationRegion/regionSimple/regionSimple.component.ts b/src/atlasComponents/parcellationRegion/regionSimple/regionSimple.component.ts
similarity index 100%
rename from src/ui/parcellationRegion/regionSimple/regionSimple.component.ts
rename to src/atlasComponents/parcellationRegion/regionSimple/regionSimple.component.ts
diff --git a/src/ui/parcellationRegion/regionSimple/regionSimple.style.css b/src/atlasComponents/parcellationRegion/regionSimple/regionSimple.style.css
similarity index 100%
rename from src/ui/parcellationRegion/regionSimple/regionSimple.style.css
rename to src/atlasComponents/parcellationRegion/regionSimple/regionSimple.style.css
diff --git a/src/ui/parcellationRegion/regionSimple/regionSimple.template.html b/src/atlasComponents/parcellationRegion/regionSimple/regionSimple.template.html
similarity index 100%
rename from src/ui/parcellationRegion/regionSimple/regionSimple.template.html
rename to src/atlasComponents/parcellationRegion/regionSimple/regionSimple.template.html
diff --git a/src/ui/regionalFeatures/featureContainer/featureContainer.component.ts b/src/atlasComponents/regionalFeatures/featureContainer/featureContainer.component.ts
similarity index 100%
rename from src/ui/regionalFeatures/featureContainer/featureContainer.component.ts
rename to src/atlasComponents/regionalFeatures/featureContainer/featureContainer.component.ts
diff --git a/src/ui/regionalFeatures/index.ts b/src/atlasComponents/regionalFeatures/index.ts
similarity index 100%
rename from src/ui/regionalFeatures/index.ts
rename to src/atlasComponents/regionalFeatures/index.ts
diff --git a/src/ui/regionalFeatures/module.ts b/src/atlasComponents/regionalFeatures/module.ts
similarity index 94%
rename from src/ui/regionalFeatures/module.ts
rename to src/atlasComponents/regionalFeatures/module.ts
index f90b3a6ee0593d324d30394b8ba746541f8fa2c0..d18d51d9002d2a764c460b1da5a65ffad3ed8e79 100644
--- a/src/ui/regionalFeatures/module.ts
+++ b/src/atlasComponents/regionalFeatures/module.ts
@@ -1,7 +1,7 @@
 import { CommonModule } from "@angular/common";
 import { NgModule } from "@angular/core";
 import { UtilModule } from "src/util";
-import { AngularMaterialModule } from "../sharedModules/angularMaterial.module";
+import { AngularMaterialModule } from "../../ui/sharedModules/angularMaterial.module";
 import { FeatureContainer } from "./featureContainer/featureContainer.component";
 import { FilterRegionalFeaturesByTypePipe } from "./pipes/filterRegionalFeaturesByType.pipe";
 import { FilterRegionFeaturesById } from "./pipes/filterRegionFeaturesById.pipe";
diff --git a/src/ui/regionalFeatures/pipes/filterRegionFeaturesById.pipe.ts b/src/atlasComponents/regionalFeatures/pipes/filterRegionFeaturesById.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/pipes/filterRegionFeaturesById.pipe.ts
rename to src/atlasComponents/regionalFeatures/pipes/filterRegionFeaturesById.pipe.ts
diff --git a/src/ui/regionalFeatures/pipes/filterRegionalFeaturesByType.pipe.ts b/src/atlasComponents/regionalFeatures/pipes/filterRegionalFeaturesByType.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/pipes/filterRegionalFeaturesByType.pipe.ts
rename to src/atlasComponents/regionalFeatures/pipes/filterRegionalFeaturesByType.pipe.ts
diff --git a/src/ui/regionalFeatures/pipes/findRegionFeatureById.pipe.ts b/src/atlasComponents/regionalFeatures/pipes/findRegionFeatureById.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/pipes/findRegionFeatureById.pipe.ts
rename to src/atlasComponents/regionalFeatures/pipes/findRegionFeatureById.pipe.ts
diff --git a/src/ui/regionalFeatures/regionGetAllFeatures.directive.ts b/src/atlasComponents/regionalFeatures/regionGetAllFeatures.directive.ts
similarity index 100%
rename from src/ui/regionalFeatures/regionGetAllFeatures.directive.ts
rename to src/atlasComponents/regionalFeatures/regionGetAllFeatures.directive.ts
diff --git a/src/ui/regionalFeatures/regionalFeature.service.ts b/src/atlasComponents/regionalFeatures/regionalFeature.service.ts
similarity index 100%
rename from src/ui/regionalFeatures/regionalFeature.service.ts
rename to src/atlasComponents/regionalFeatures/regionalFeature.service.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/base/regionFeature.base.ts b/src/atlasComponents/regionalFeatures/singleFeatures/base/regionFeature.base.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/base/regionFeature.base.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/base/regionFeature.base.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts b/src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts
similarity index 97%
rename from src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts
index 37c0fdc07a32a9d479d8f1fa85c804f8ad6b2f5b..af0dcab8913fa06d2f7ad55f6ffadc309aae69dc 100644
--- a/src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts
+++ b/src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.component.ts
@@ -3,7 +3,7 @@ import { Store } from "@ngrx/store";
 import { merge, Subject, Subscription } from "rxjs";
 import { debounceTime, map, scan, take } from "rxjs/operators";
 import { viewerStateChangeNavigation } from "src/services/state/viewerState/actions";
-import { RegionalFeaturesService } from "src/ui/regionalFeatures/regionalFeature.service";
+import { RegionalFeaturesService } from "src/atlasComponents/regionalFeatures/regionalFeature.service";
 import { ClickInterceptor, CLICK_INTERCEPTOR_INJECTOR } from "src/util";
 import { IHasId } from "src/util/interfaces";
 import { RegionFeatureBase } from "../../base/regionFeature.base";
diff --git a/src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.style.css b/src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.style.css
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.style.css
rename to src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.style.css
diff --git a/src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.template.html b/src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.template.html
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.template.html
rename to src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/iEEGRecordings/iEEGRecordings.template.html
diff --git a/src/ui/regionalFeatures/singleFeatures/iEEGRecordings/module.ts b/src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/module.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/iEEGRecordings/module.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/iEEGRecordings/module.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/interfaces.ts b/src/atlasComponents/regionalFeatures/singleFeatures/interfaces.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/interfaces.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/interfaces.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/filterReceptorBytype.pipe.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/filterReceptorBytype.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/filterReceptorBytype.pipe.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/filterReceptorBytype.pipe.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/getAllReceptors.pipe.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getAllReceptors.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/getAllReceptors.pipe.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getAllReceptors.pipe.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/getId.pipe.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getId.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/getId.pipe.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getId.pipe.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/getUrl.pipe.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getUrl.pipe.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/getUrl.pipe.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/getUrl.pipe.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/module.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/module.ts
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/module.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/module.ts
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts
similarity index 95%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts
index 1ecf5f8d6c8b1f60bcb2520039666fe0b4a3f17d..a9b5f3652f04a53961f3a334f7a951ba36fa5407 100644
--- a/src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts
+++ b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.component.ts
@@ -1,6 +1,6 @@
 import { Component, ElementRef, EventEmitter, HostListener, OnDestroy, Optional } from "@angular/core";
 import { fromEvent, Observable, of, Subscription } from "rxjs";
-import { RegionalFeaturesService } from "src/ui/regionalFeatures/regionalFeature.service";
+import { RegionalFeaturesService } from "src/atlasComponents/regionalFeatures/regionalFeature.service";
 import { PureContantService } from "src/util";
 import { RegionFeatureBase } from "../../base/regionFeature.base";
 import { ISingleFeature } from "../../interfaces";
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.style.css b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.style.css
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.style.css
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.style.css
diff --git a/src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.template.html b/src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.template.html
similarity index 100%
rename from src/ui/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.template.html
rename to src/atlasComponents/regionalFeatures/singleFeatures/receptorDensity/receptorDensity/receptorDensity.template.html
diff --git a/src/ui/regionalFeatures/util.ts b/src/atlasComponents/regionalFeatures/util.ts
similarity index 100%
rename from src/ui/regionalFeatures/util.ts
rename to src/atlasComponents/regionalFeatures/util.ts
diff --git a/src/ui/atlasDropdown/atlasDropdown.component.spec.ts b/src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.component.spec.ts
similarity index 100%
rename from src/ui/atlasDropdown/atlasDropdown.component.spec.ts
rename to src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.component.spec.ts
diff --git a/src/ui/atlasDropdown/atlasDropdown.component.ts b/src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.component.ts
similarity index 100%
rename from src/ui/atlasDropdown/atlasDropdown.component.ts
rename to src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.component.ts
diff --git a/src/ui/atlasDropdown/atlasDropdown.style.css b/src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.style.css
similarity index 100%
rename from src/ui/atlasDropdown/atlasDropdown.style.css
rename to src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.style.css
diff --git a/src/ui/atlasDropdown/atlasDropdown.template.html b/src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.template.html
similarity index 100%
rename from src/ui/atlasDropdown/atlasDropdown.template.html
rename to src/atlasComponents/uiSelectors/atlasDropdown/atlasDropdown.template.html
diff --git a/src/ui/atlasLayerSelector/atlasLayerSelector.component.ts b/src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.component.ts
similarity index 100%
rename from src/ui/atlasLayerSelector/atlasLayerSelector.component.ts
rename to src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.component.ts
diff --git a/src/ui/atlasLayerSelector/atlasLayerSelector.style.css b/src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.style.css
similarity index 100%
rename from src/ui/atlasLayerSelector/atlasLayerSelector.style.css
rename to src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.style.css
diff --git a/src/ui/atlasLayerSelector/atlasLayerSelector.template.html b/src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.template.html
similarity index 100%
rename from src/ui/atlasLayerSelector/atlasLayerSelector.template.html
rename to src/atlasComponents/uiSelectors/atlasLayerSelector/atlasLayerSelector.template.html
diff --git a/src/atlasComponents/uiSelectors/index.ts b/src/atlasComponents/uiSelectors/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..28925e7dac73fcc4f6b8896a1026ec6c556a24e4
--- /dev/null
+++ b/src/atlasComponents/uiSelectors/index.ts
@@ -0,0 +1,3 @@
+export { AtlasCmpUiSelectorsModule } from "./module"
+export { AtlasDropdownSelector } from "./atlasDropdown/atlasDropdown.component"
+export { AtlasLayerSelector } from "./atlasLayerSelector/atlasLayerSelector.component"
\ No newline at end of file
diff --git a/src/atlasComponents/uiSelectors/module.ts b/src/atlasComponents/uiSelectors/module.ts
new file mode 100644
index 0000000000000000000000000000000000000000..034f9445353f4e43e0a2f7e8e1b62055eccdb419
--- /dev/null
+++ b/src/atlasComponents/uiSelectors/module.ts
@@ -0,0 +1,26 @@
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { AngularMaterialModule } from "src/ui/sharedModules/angularMaterial.module";
+import { UtilModule } from "src/util";
+import { DatabrowserModule } from "src/atlasComponents/databrowserModule";
+import { AtlasDropdownSelector } from "./atlasDropdown/atlasDropdown.component";
+import { AtlasLayerSelector } from "./atlasLayerSelector/atlasLayerSelector.component";
+
+@NgModule({
+  imports: [
+    CommonModule,
+    AngularMaterialModule,
+    UtilModule,
+    DatabrowserModule,
+  ],
+  declarations: [
+    AtlasDropdownSelector,
+    AtlasLayerSelector,
+  ],
+  exports: [
+    AtlasDropdownSelector,
+    AtlasLayerSelector,
+  ]
+})
+
+export class AtlasCmpUiSelectorsModule{}
\ No newline at end of file
diff --git a/src/atlasViewer/atlasViewer.style.css b/src/atlasViewer/atlasViewer.style.css
index c5024d44227a8cb0e0594637e583f392418efcbb..1a6915506e6049e60f33fca36781b9fa6e29ba80 100644
--- a/src/atlasViewer/atlasViewer.style.css
+++ b/src/atlasViewer/atlasViewer.style.css
@@ -68,7 +68,6 @@ mat-sidenav {
   box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
 }
 
-landmark-ui,
 region-menu
 {
   display:inline-block;
diff --git a/src/atlasViewer/atlasViewer.urlUtil.ts b/src/atlasViewer/atlasViewer.urlUtil.ts
index 59640205e71446281e4329b776b7f1b3bfbb133b..2f09a1b1f060893ef825c8cf07236f7cd235e99e 100644
--- a/src/atlasViewer/atlasViewer.urlUtil.ts
+++ b/src/atlasViewer/atlasViewer.urlUtil.ts
@@ -1,10 +1,11 @@
 import { getGetRegionFromLabelIndexId } from "src/services/effect/effect";
 import { mixNgLayers } from "src/services/state/ngViewerState.store";
 import { PLUGINSTORE_CONSTANTS } from 'src/services/state/pluginState.store'
-import { generateLabelIndexId, getNgIdLabelIndexFromRegion, IavRootStoreInterface } from "../services/stateStore.service";
+import { getNgIdLabelIndexFromRegion, IavRootStoreInterface } from "../services/stateStore.service";
 import { decodeToNumber, encodeNumber, separator } from "./atlasViewer.constantService.service";
 import { getShader, PMAP_DEFAULT_CONFIG } from "src/util/constants";
 import { viewerStateHelperStoreName } from "src/services/state/viewerState.store.helper";
+import { serialiseParcellationRegion } from "common/util"
 export const PARSING_SEARCHPARAM_ERROR = {
   TEMPALTE_NOT_SET: 'TEMPALTE_NOT_SET',
   TEMPLATE_NOT_FOUND: 'TEMPLATE_NOT_FOUND',
@@ -169,7 +170,7 @@ const parseSearchParamForTemplateParcellationRegion = (searchparams: URLSearchPa
             }
           }).filter(v => !!v)
           for (const labelIndex of labelIndicies) {
-            selectRegionIds.push( generateLabelIndexId({ ngId, labelIndex }) )
+            selectRegionIds.push( serialiseParcellationRegion({ ngId, labelIndex }) )
           }
         }
         return selectRegionIds
diff --git a/src/atlasViewer/mouseOver.directive.ts b/src/atlasViewer/mouseOver.directive.ts
index 7938d4a36c1ef02ce7431565426a34af42af7b62..89ca6ec1db5883e16bf0965434ecf7ef670abf2d 100644
--- a/src/atlasViewer/mouseOver.directive.ts
+++ b/src/atlasViewer/mouseOver.directive.ts
@@ -6,7 +6,7 @@ import { distinctUntilChanged, filter, map, scan, shareReplay, startWith, withLa
 import { TransformOnhoverSegmentPipe } from "src/atlasViewer/onhoverSegment.pipe";
 import { LoggingService } from "src/logging";
 import { uiStateMouseOverSegmentsSelector, uiStateMouseoverUserLandmark } from "src/services/state/uiState/selectors";
-import { getNgIdLabelIndexFromId } from "src/services/stateStore.service";
+import { deserialiseParcRegionId } from "common/util"
 
 /**
  * Scan function which prepends newest positive (i.e. defined) value
@@ -98,7 +98,7 @@ export class MouseHoverDirective {
         ? arr.filter(({ segment }) => {
           // if segment is not a string (i.e., not labelIndexId) return true
           if (typeof segment !== 'string') { return true }
-          const { labelIndex } = getNgIdLabelIndexFromId({ labelIndexId: segment })
+          const { labelIndex } = deserialiseParcRegionId(segment)
           return parcellationSelected.auxillaryMeshIndices.indexOf(labelIndex) < 0
         })
         : arr),
diff --git a/src/glue.spec.ts b/src/glue.spec.ts
index aba6f15912e2050d8e2a25bc11d58216bd001934..02e5c00049375fd3c0100bfd0f2ca1f86d5ee944 100644
--- a/src/glue.spec.ts
+++ b/src/glue.spec.ts
@@ -14,7 +14,7 @@ import { EnumColorMapName } from "./util/colorMaps"
 import { ngViewerSelectorClearView } from "./services/state/ngViewerState/selectors"
 import { tap, ignoreElements } from "rxjs/operators"
 import { merge, of } from "rxjs"
-import { GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME } from "./ui/databrowserModule/pure"
+import { GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME } from "./atlasComponents/databrowserModule/pure"
 import { viewerStateSelectedTemplateSelector } from "./services/state/viewerState/selectors"
 import { generalActionError } from "./services/stateStore.helper"
 
diff --git a/src/glue.ts b/src/glue.ts
index 5d94c0c6a839b9b4c85042123044d6899cd501b3..f0d9430a1a4bf6bf90bad761b6ca7946aaf65fee 100644
--- a/src/glue.ts
+++ b/src/glue.ts
@@ -1,6 +1,6 @@
 import { uiActionSetPreviewingDatasetFiles, IDatasetPreviewData, uiStateShowBottomSheet, uiStatePreviewingDatasetFilesSelector } from "./services/state/uiState.store.helper"
 import { OnDestroy, Injectable, Optional, Inject, InjectionToken } from "@angular/core"
-import { PreviewComponentWrapper, DatasetPreview, determinePreviewFileType, EnumPreviewFileTypes, IKgDataEntry, getKgSchemaIdFromFullId, GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME } from "./ui/databrowserModule/pure"
+import { PreviewComponentWrapper, DatasetPreview, determinePreviewFileType, EnumPreviewFileTypes, IKgDataEntry, getKgSchemaIdFromFullId, GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME } from "./atlasComponents/databrowserModule/pure"
 import { Subscription, Observable, forkJoin, of, merge, combineLatest } from "rxjs"
 import { select, Store, ActionReducer, createAction, props, createSelector, Action } from "@ngrx/store"
 import { startWith, map, shareReplay, pairwise, debounceTime, distinctUntilChanged, tap, switchMap, withLatestFrom, mapTo, switchMapTo, filter, skip, catchError, bufferTime } from "rxjs/operators"
@@ -590,7 +590,6 @@ export class DatasetPreviewGlue implements IDatasetPreviewGlue, OnDestroy{
   }
 
   private openDatasetPreviewWidget(data: IDatasetPreviewData) {
-    console.log({ data })
     const { datasetId: kgId, filename } = data
 
     if (!!this.actionOnWidget) {
diff --git a/src/main.module.ts b/src/main.module.ts
index 11a705ee245213a857e933cd3c82dce5010beb9b..1c737ec1a1983998f2cabd599d1d00a9881dc233 100644
--- a/src/main.module.ts
+++ b/src/main.module.ts
@@ -25,8 +25,8 @@ import { LocalFileService } from "./services/localFile.service";
 import { NgViewerUseEffect } from "./services/state/ngViewerState.store";
 import { ViewerStateUseEffect } from "./services/state/viewerState.store";
 import { UIService } from "./services/uiService.service";
-import { DatabrowserModule, OVERRIDE_IAV_DATASET_PREVIEW_DATASET_FN, DataBrowserFeatureStore, GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME, DatabrowserService } from "src/ui/databrowserModule";
-import { ViewerStateControllerUseEffect } from "./ui/viewerStateController/viewerState.useEffect";
+import { DatabrowserModule, OVERRIDE_IAV_DATASET_PREVIEW_DATASET_FN, DataBrowserFeatureStore, GET_KGDS_PREVIEW_INFO_FROM_ID_FILENAME, DatabrowserService } from "src/atlasComponents/databrowserModule";
+import { ViewerStateControllerUseEffect } from "src/state";
 import { DockedContainerDirective } from "./util/directives/dockedContainer.directive";
 import { DragDropDirective } from "./util/directives/dragDrop.directive";
 import { FloatingContainerDirective } from "./util/directives/floatingContainer.directive";
@@ -46,7 +46,7 @@ import { PluginModule } from './atlasViewer/pluginUnit/plugin.module';
 import { LoggingModule } from './logging/logging.module';
 import { ShareModule } from './share';
 import { AuthService } from './auth'
-import { IAV_DATASET_PREVIEW_ACTIVE } from 'src/ui/databrowserModule'
+import { IAV_DATASET_PREVIEW_ACTIVE } from 'src/atlasComponents/databrowserModule'
 
 import 'hammerjs'
 import 'src/res/css/extra_styles.css'
@@ -57,6 +57,8 @@ import { viewerStateHelperReducer, viewerStateMetaReducers, ViewerStateHelperEff
 import { TOS_OBS_INJECTION_TOKEN } from './ui/kgtos/kgtos.component';
 import { UiEffects } from './services/state/uiState/ui.effects';
 import { MesssagingModule } from './messaging/module';
+import { ParcellationRegionModule } from './atlasComponents/parcellationRegion';
+import { AtlasCmpUiSelectorsModule } from './atlasComponents/uiSelectors';
 
 export function debug(reducer: ActionReducer<any>): ActionReducer<any> {
   return function(state, action) {
@@ -86,6 +88,8 @@ export function debug(reducer: ActionReducer<any>): ActionReducer<any> {
     MesssagingModule,
 
     SpotLightModule,
+    ParcellationRegionModule,
+    AtlasCmpUiSelectorsModule,
     
     EffectsModule.forRoot([
       UseEffects,
diff --git a/src/services/effect/effect.ts b/src/services/effect/effect.ts
index c206014533f352a8530b8b232b2b96141a05b8e8..b79758b4595cc5c7094de0d3e8983154c62ae7b4 100644
--- a/src/services/effect/effect.ts
+++ b/src/services/effect/effect.ts
@@ -5,8 +5,9 @@ import { merge, Observable, Subscription, combineLatest } from "rxjs";
 import { filter, map, shareReplay, switchMap, take, withLatestFrom, mapTo, distinctUntilChanged } from "rxjs/operators";
 import { LoggingService } from "src/logging";
 import { ADD_TO_REGIONS_SELECTION_WITH_IDS, DESELECT_REGIONS, NEWVIEWER, SELECT_PARCELLATION, SELECT_REGIONS, SELECT_REGIONS_WITH_ID, SELECT_LANDMARKS } from "../state/viewerState.store";
-import { generateLabelIndexId, getNgIdLabelIndexFromId, IavRootStoreInterface, recursiveFindRegionWithLabelIndexId } from '../stateStore.service';
+import { IavRootStoreInterface, recursiveFindRegionWithLabelIndexId } from '../stateStore.service';
 import { viewerStateSelectAtlas, viewerStateSetSelectedRegionsWithIds, viewerStateToggleLayer } from "../state/viewerState.store.helper";
+import { deserialiseParcRegionId, serialiseParcellationRegion } from "common/util"
 
 @Injectable({
   providedIn: 'root',
@@ -85,7 +86,7 @@ export class UseEffects implements OnDestroy {
         return {
           type: SELECT_REGIONS,
           selectRegions: alreadySelectedRegions
-            .filter(({ ngId, labelIndex }) => !deselectSet.has(generateLabelIndexId({ ngId, labelIndex }))),
+            .filter(({ ngId, labelIndex }) => !deselectSet.has(serialiseParcellationRegion({ ngId, labelIndex }))),
         }
       }),
     )
@@ -143,10 +144,10 @@ export class UseEffects implements OnDestroy {
   private convertRegionIdsToRegion = ([selectRegionIds, parcellation]) => {
     const { ngId: defaultNgId } = parcellation
     return (selectRegionIds as any[])
-      .map(labelIndexId => getNgIdLabelIndexFromId({ labelIndexId }))
+      .map(labelIndexId => deserialiseParcRegionId(labelIndexId))
       .map(({ ngId, labelIndex }) => {
         return {
-          labelIndexId: generateLabelIndexId({
+          labelIndexId: serialiseParcellationRegion({
             ngId: ngId || defaultNgId,
             labelIndex,
           }),
diff --git a/src/services/localFile.service.ts b/src/services/localFile.service.ts
index d4386edeca620ea7fc2ded16cd54623a265b6c97..045ac686b54f7b65e2985f7d75c2bce85ce705c6 100644
--- a/src/services/localFile.service.ts
+++ b/src/services/localFile.service.ts
@@ -1,6 +1,5 @@
 import { Injectable } from "@angular/core";
 import { Store } from "@ngrx/store";
-import { KgSingleDatasetService } from "src/ui/databrowserModule/kgSingleDatasetService.service";
 import { SNACKBAR_MESSAGE } from "./state/uiState.store";
 import { IavRootStoreInterface } from "./stateStore.service";
 import { DATASETS_ACTIONS_TYPES } from "./state/dataStore.store";
@@ -19,12 +18,11 @@ export class LocalFileService {
 
   constructor(
     private store: Store<IavRootStoreInterface>,
-    private singleDsService: KgSingleDatasetService,
   ) {
 
   }
 
-  private niiUrl
+  private niiUrl: string
 
   public handleFileDrop(files: File[]) {
     try {
diff --git a/src/services/state/viewerState.store.ts b/src/services/state/viewerState.store.ts
index 25adedb5c6eb7fecba4215550f1376b9379c4d72..543350c50da30bb7cf5c2f0d33a303c3d3322cd3 100644
--- a/src/services/state/viewerState.store.ts
+++ b/src/services/state/viewerState.store.ts
@@ -7,13 +7,12 @@ import { IUserLandmark } from 'src/atlasViewer/atlasViewer.apiService.service';
 import { INgLayerInterface } from 'src/atlasViewer/atlasViewer.component';
 import { getViewer } from 'src/util/fn';
 import { LoggingService } from 'src/logging';
-import { generateLabelIndexId, IavRootStoreInterface } from '../stateStore.service';
+import { IavRootStoreInterface } from '../stateStore.service';
 import { GENERAL_ACTION_TYPES } from '../stateStore.service'
 import { CLOSE_SIDE_PANEL } from './uiState.store';
 import { 
   viewerStateSetSelectedRegions,
   viewerStateSetConnectivityRegion,
-  viewerStateSelectAtlas,
   viewerStateSelectParcellation,
   viewerStateSelectRegionWithIdDeprecated,
   viewerStateCustomLandmarkSelector,
@@ -24,8 +23,9 @@ import {
   viewerStateMouseOverCustomLandmarkInPerspectiveView,
   viewerStateNewViewer
 } from './viewerState.store.helper';
-import { cvtNehubaConfigToNavigationObj } from 'src/ui/viewerStateController/viewerState.useEffect';
+import { cvtNehubaConfigToNavigationObj } from 'src/state';
 import { viewerStateChangeNavigation } from './viewerState/actions';
+import { serialiseParcellationRegion } from "common/util"
 
 export interface StateInterface {
   fetchedTemplates: any[]
@@ -378,8 +378,8 @@ export class ViewerStateUseEffect {
         startWith([]),
       )),
       map(([{ segments }, regionsSelected]) => {
-        const selectedSet = new Set(regionsSelected.map(generateLabelIndexId))
-        const toggleArr = segments.map(({ segment, layer }) => generateLabelIndexId({ ngId: layer.name, ...segment }))
+        const selectedSet = new Set(regionsSelected.map(serialiseParcellationRegion))
+        const toggleArr = segments.map(({ segment, layer }) => serialiseParcellationRegion({ ngId: layer.name, ...segment }))
 
         const deleteFlag = toggleArr.some(id => selectedSet.has(id))
 
diff --git a/src/services/stateStore.service.ts b/src/services/stateStore.service.ts
index 209c3a2a9fab036f695cda969de68b7514bdacaf..c07baa5cc23bbd5423e98e4c579b61b5527b30bd 100644
--- a/src/services/stateStore.service.ts
+++ b/src/services/stateStore.service.ts
@@ -1,9 +1,5 @@
 import { filter } from 'rxjs/operators';
-export {
-  serialiseParcellationRegion as generateLabelIndexId,
-  deserialiseParcRegionId as getNgIdLabelIndexFromId,
 
-} from 'common/util'
 export {
   recursiveFindRegionWithLabelIndexId
 } from 'src/util/fn'
@@ -167,7 +163,7 @@ export interface IavRootStoreInterface {
   userConfigState: UserConfigStateInterface
 }
 
-import { DATASTORE_DEFAULT_STATE } from 'src/ui/databrowserModule'
+import { DATASTORE_DEFAULT_STATE } from 'src/atlasComponents/databrowserModule'
 
 export const defaultRootState: any = {
   pluginState: pluginDefaultState,
diff --git a/src/spotlight/sl-service.service.ts b/src/spotlight/sl-service.service.ts
index c045ebfdbeb4ef5f2e5f1c682bf814cd7718dda1..241fe068cb335726119d8532d31d3a06ff6351f1 100644
--- a/src/spotlight/sl-service.service.ts
+++ b/src/spotlight/sl-service.service.ts
@@ -21,6 +21,9 @@ export class SlServiceService implements OnDestroy{
     this.cf = cfr.resolveComponentFactory(SpotlightBackdropComponent)
   }
 
+  /**
+   * TODO use angular cdk overlay
+   */
   public showBackdrop(tmp?: TemplateRef<any>){
     this.hideBackdrop()
 
diff --git a/src/ui/viewerStateController/viewerState.useEffect.spec.ts b/src/state/effects/viewerState.useEffect.spec.ts
similarity index 99%
rename from src/ui/viewerStateController/viewerState.useEffect.spec.ts
rename to src/state/effects/viewerState.useEffect.spec.ts
index b38a7db90370f82ebe1c53b4811cefb053e0555a..7db861be8f920defd2c6b1d775502f2faa5a735d 100644
--- a/src/ui/viewerStateController/viewerState.useEffect.spec.ts
+++ b/src/state/effects/viewerState.useEffect.spec.ts
@@ -7,7 +7,7 @@ import { defaultRootState, generalActionError } from 'src/services/stateStore.se
 import { Injectable } from '@angular/core'
 import { TemplateCoordinatesTransformation, ITemplateCoordXformResp } from 'src/services/templateCoordinatesTransformation.service'
 import { hot } from 'jasmine-marbles'
-import { AngularMaterialModule } from '../sharedModules/angularMaterial.module'
+import { AngularMaterialModule } from 'src/ui/sharedModules/angularMaterial.module'
 import { HttpClientModule } from '@angular/common/http'
 import { WidgetModule } from 'src/widget'
 import { PluginModule } from 'src/atlasViewer/pluginUnit/plugin.module'
diff --git a/src/ui/viewerStateController/viewerState.useEffect.ts b/src/state/effects/viewerState.useEffect.ts
similarity index 94%
rename from src/ui/viewerStateController/viewerState.useEffect.ts
rename to src/state/effects/viewerState.useEffect.ts
index 18eef3feafbaebc9d4bdf05b60447a6619ce870c..a56794c215c671f56b71abbecd05b55f3226d826 100644
--- a/src/ui/viewerStateController/viewerState.useEffect.ts
+++ b/src/state/effects/viewerState.useEffect.ts
@@ -3,8 +3,7 @@ import { Actions, Effect, ofType } from "@ngrx/effects";
 import { Action, select, Store } from "@ngrx/store";
 import { Observable, Subscription, of, merge } from "rxjs";
 import { distinctUntilChanged, filter, map, shareReplay, withLatestFrom, switchMap, mapTo, startWith } from "rxjs/operators";
-import { CHANGE_NAVIGATION, FETCHED_TEMPLATE, IavRootStoreInterface, SELECT_PARCELLATION, SELECT_REGIONS, generalActionError } from "src/services/stateStore.service";
-import { VIEWERSTATE_CONTROLLER_ACTION_TYPES } from "./viewerState.base";
+import { FETCHED_TEMPLATE, IavRootStoreInterface, SELECT_PARCELLATION, SELECT_REGIONS, generalActionError } from "src/services/stateStore.service";
 import { TemplateCoordinatesTransformation } from "src/services/templateCoordinatesTransformation.service";
 import { CLEAR_STANDALONE_VOLUMES } from "src/services/state/viewerState.store";
 import { viewerStateToggleRegionSelect, viewerStateHelperSelectParcellationWithId, viewerStateSelectTemplateWithId, viewerStateNavigateToRegion, viewerStateSelectedTemplateSelector, viewerStateFetchedTemplatesSelector, viewerStateNewViewer, viewerStateSelectedParcellationSelector, viewerStateNavigationStateSelector, viewerStateSelectTemplateWithName, viewerStateSelectedRegionsSelector, viewerStateSelectAtlas } from "src/services/state/viewerState.store.helper";
@@ -15,6 +14,7 @@ import { verifyPositionArg } from 'common/util'
 import { CONST } from 'common/constants'
 import { uiActionHideAllDatasets } from "src/services/state/uiState/actions";
 import { viewerStateFetchedAtlasesSelector } from "src/services/state/viewerState/selectors";
+import { viewerStateChangeNavigation } from "src/services/state/viewerState/actions";
 
 const defaultPerspectiveZoom = 1e6
 const defaultZoom = 1e6
@@ -385,22 +385,6 @@ export class ViewerStateControllerUseEffect implements OnDestroy {
         map(({ payload }) => payload['@id'])
       ),
 
-      /**
-       * deprecated method...
-       * finding id from name
-       */
-      this.actions$.pipe(
-        ofType(VIEWERSTATE_CONTROLLER_ACTION_TYPES.SELECT_PARCELLATION_WITH_NAME),
-        withLatestFrom(viewerState$.pipe(
-          select('templateSelected')
-        )),
-        map(([ action, templateSelected ]) => {
-          const parcellationName = (action as any).payload.name
-          const foundParcellation = templateSelected.parcellations.find(p => p.name === parcellationName)
-          return foundParcellation && foundParcellation['@id']
-        }),
-        filter(v => !!v)
-      )
     ).pipe(
       withLatestFrom(viewerState$.pipe(
         select('templateSelected'),
@@ -444,13 +428,12 @@ export class ViewerStateControllerUseEffect implements OnDestroy {
           })
         }
 
-        return {
-          type: CHANGE_NAVIGATION,
+        return viewerStateChangeNavigation({
           navigation: {
             position,
             animation: {},
-          },
-        }
+          }
+        })
       }),
     )
 
diff --git a/src/state/index.ts b/src/state/index.ts
index d5efade12f4641c39c4a808d81c7eb7e531ba31b..755a484148037e78de1a8536176c408ddc46b81b 100644
--- a/src/state/index.ts
+++ b/src/state/index.ts
@@ -1 +1,6 @@
-export { StateModule } from './state.module'
+export { StateModule } from "./state.module"
+export {
+  ViewerStateControllerUseEffect,
+  cvtNavigationObjToNehubaConfig,
+  cvtNehubaConfigToNavigationObj,
+} from "./effects/viewerState.useEffect"
\ No newline at end of file
diff --git a/src/ui/btnShadow.style.css b/src/ui/btnShadow.style.css
deleted file mode 100644
index 3d4bb9c2dd3ef38fcaa74e5deb5406132ffbde03..0000000000000000000000000000000000000000
--- a/src/ui/btnShadow.style.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.btnWrapper
-{
-  display:flex;
-  align-items: center;
-  justify-content: center;
-}
-
-
-.btnWrapper > .btn
-{
-  width: 2.5em;
-  height: 2.5em;
-
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.btnWrapper.btnWrapper-lg > .btn
-{
-  width: 5rem;
-  height: 5rem;
-}
\ No newline at end of file
diff --git a/src/ui/kgEntryViewer/kgentry.component.ts b/src/ui/kgEntryViewer/kgentry.component.ts
deleted file mode 100644
index fada06ab098aafc41acc8f27848455897c1258e0..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/kgentry.component.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Component, Input } from "@angular/core";
-import { IDataEntry } from "src/services/stateStore.service";
-
-@Component({
-  selector : 'kg-entry-viewer',
-  templateUrl : './kgentry.template.html',
-  styleUrls : [
-    './kgentry.style.css',
-  ],
-})
-
-export class KgEntryViewer {
-  @Input() public dataset: IDataEntry
-
-  public kgData: any = null
-  public kgError: any = null
-
-  get tableColClass1() {
-    return `col-xs-4 col-lg-4 tableEntry`
-  }
-
-  get tableColClass2() {
-    return `col-xs-8 col-lg-8 tableEntry`
-  }
-
-  public isArray(v) {
-    return v.constructor === Array
-  }
-}
diff --git a/src/ui/kgEntryViewer/kgentry.style.css b/src/ui/kgEntryViewer/kgentry.style.css
deleted file mode 100644
index 4ac3fc6f4bd8f118c0339fff562389ee4d18239c..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/kgentry.style.css
+++ /dev/null
@@ -1,34 +0,0 @@
-div[heading],
-div[body]
-{
-  padding: 0.5rem;
-}
-
-div[heading]
-{
-  background-color:rgba(128,128,128,0.1);
-}
-
-div[body]
-{
-  font-size: 90%;
-  max-height:20em;
-  overflow-y:auto;
-  overflow-x:hidden;
-}
-
-div[container]
-{
-  overflow:hidden;
-}
-
-a[link]
-{
-  display: inline-block;
-  margin-top: 1rem;
-}
-
-a[link]:hover
-{
-  text-decoration: none;
-}
\ No newline at end of file
diff --git a/src/ui/kgEntryViewer/kgentry.template.html b/src/ui/kgEntryViewer/kgentry.template.html
deleted file mode 100644
index cb309ebd9a5bc6fc307968557c3e7357ef8b0faf..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/kgentry.template.html
+++ /dev/null
@@ -1,84 +0,0 @@
-<div *ngIf="dataset" container>
-
-  <!-- description -->
-  <readmore-component>
-    {{ dataset.description }}
-  </readmore-component>
-
-  <!-- other data -->
-
-  <panel-component *ngIf = "false"  [collapseBody] = "true" [bodyCollapsable] = "true">
-    <div heading>
-      Contributor(s)
-    </div>
-    <div body>
-      <!-- TODO maybe object instead of array -->
-      <div *ngFor = "let contributor of dataset.contributors">
-        {{ contributor.value }}
-      </div>
-    </div>
-  </panel-component>
-
-  <panel-component [collapseBody] = "true" [bodyCollapsable] = "true">
-    <div heading>
-      Custodian(s)
-    </div>
-    <div body>
-      <!-- TODO Maybe array -->
-      <div *ngFor="let custodian of dataset.custodians">
-        {{ custodian }}
-      </div>
-    </div>
-  </panel-component>
-
-  <panel-component *ngIf = "dataset.publications" [collapseBody] = "true" [bodyCollapsable] = "true">
-    <div heading>
-      Related Publication(s)
-    </div>
-    <div body>
-      <div *ngFor="let publication of dataset.publications">
-        <a target="_blank" link [href]="'https://doi.org/' + publication.doi">
-          {{ publication.cite }}
-          <i class = "fas fa-new-window"></i>
-        </a>
-      </div>
-    </div>
-  </panel-component>
-
-  <panel-component *ngIf = "dataset.licenseInfo || dataset.license" [collapseBody] = "true" [bodyCollapsable] = "true">
-    <div heading>
-      License
-    </div>
-    <div body>
-      <div *ngFor="let l of dataset.license">
-        {{ l }}
-      </div>
-      <div *ngFor="let l of dataset.licenseInfo">
-        {{ l }}
-      </div>
-    </div>
-  </panel-component>
-
-  <panel-component *ngIf = "dataset.files" [collapseBody] = "true" [bodyCollapsable] = "true">
-    <div heading>
-      Files
-    </div>
-    <div body>
-      <div *ngFor="let file of dataset.files">
-        <a link target="_blank" [href]="file.absolutePath">
-          {{ file.name }}
-          <i class="fas fa-download-alt"></i>
-        </a>
-      </div>
-    </div>
-  </panel-component>
-
-  <a
-    *ngFor="let ref of dataset.kgReference"
-    [href]="'https://doi.org/' + ref"
-    target="_blank">
-    Open in Knowledge Graph
-    <i class = "fas fa-new-window"></i>
-  </a>
-
-</div>
\ No newline at end of file
diff --git a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.component.ts b/src/ui/kgEntryViewer/subjectViewer/subjectViewer.component.ts
deleted file mode 100644
index 6b0a80cd18cd8dfa92517a54125e5fde870d6a2d..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.component.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
-
-@Component({
-  selector : 'kg-entry-viewer-subject-viewer',
-  templateUrl : './subjectViewer.template.html',
-  styleUrls : ['./subjectViewer.style.css'],
-  changeDetection : ChangeDetectionStrategy.OnPush,
-})
-
-export class SubjectViewer {
-  @Input() public subjects: any = []
-
-  get isSingle(): boolean {
-    return this.subjects.constructor !== Array
-  }
-
-  get species(): string[] {
-    return this.isSingle
-      ? [this.subjects.children.species.value]
-      : this.subjects.reduce((acc: string[], curr: any) =>
-        acc.findIndex(species => species === curr.children.species.value) >= 0
-          ? acc
-          : acc.concat(curr.children.species.value)
-      , [])
-  }
-
-  get groupBySex() {
-    return this.isSingle
-      ? [{
-        name : this.subjects.children.sex.value,
-        count : 1,
-      }]
-      : this.subjects.reduce((acc: any[], curr) =>
-        acc.findIndex(item => item.name === curr.children.sex.value) >= 0
-          ? acc.map(item => item.name === curr.children.sex.value
-            ? Object.assign({}, item, { count: item.count + 1 })
-            : item)
-          : acc.concat({name: curr.children.sex.value, count: 1})
-      , [])
-  }
-}
diff --git a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.style.css b/src/ui/kgEntryViewer/subjectViewer/subjectViewer.style.css
deleted file mode 100644
index 974639e6c80263ea3c2277365e3bbc06e995db8e..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.style.css
+++ /dev/null
@@ -1,4 +0,0 @@
-div.row:nth-child(even)
-{
-  background-color:rgba(128,128,128,0.2);
-}
\ No newline at end of file
diff --git a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.template.html b/src/ui/kgEntryViewer/subjectViewer/subjectViewer.template.html
deleted file mode 100644
index e295f00d6711c2dd3902289a8ea6e695b471b6b6..0000000000000000000000000000000000000000
--- a/src/ui/kgEntryViewer/subjectViewer/subjectViewer.template.html
+++ /dev/null
@@ -1,32 +0,0 @@
-<div>
-
-  <div class = "row">
-    <div class = "col-xs-4 col-lg-4">
-      Species:
-    </div>
-    <div class = "col-xs-8 col-lg-8">
-      {{ species.join(',') }}
-    </div>
-  </div>
-
-  <div class = "row">
-    <div class = "col-xs-4 col-lg-4">
-      Number of Subjects:
-    </div>
-    <div class = "col-xs-8 col-lg-8">
-      {{ subjects.length }}
-    </div>
-  </div>
-
-  <div class = "row">
-    <div class = "col-xs-4 col-lg-4">
-      Sex:
-    </div>
-    <div class = "col-xs-8 col-lg-8">
-      <div *ngFor = "let sexGroup of groupBySex">
-        {{ sexGroup.name }} (n = {{ sexGroup.count }})
-      </div>
-    </div>
-  </div>
-
-</div>
\ No newline at end of file
diff --git a/src/ui/landmarkUI/landmarkUI.component.ts b/src/ui/landmarkUI/landmarkUI.component.ts
deleted file mode 100644
index 9b4635830d5668b7bf6981c7d87c988b0b88ea3e..0000000000000000000000000000000000000000
--- a/src/ui/landmarkUI/landmarkUI.component.ts
+++ /dev/null
@@ -1,71 +0,0 @@
-import { Component, Input, OnChanges, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef, AfterContentChecked } from "@angular/core";
-import { IDataEntry } from "src/services/stateStore.service"; 
-import { GetKgSchemaIdFromFullIdPipe } from 'src/ui/databrowserModule/util/getKgSchemaIdFromFullId.pipe'
-import { AtlasViewerConstantsServices } from "src/atlasViewer/atlasViewer.constantService.service";
-import { Observable } from "rxjs";
-import { DS_PREVIEW_URL } from 'src/util/constants'
-
-@Component({
-  selector: 'landmark-ui',
-  templateUrl: './landmarkUI.template.html',
-  styleUrls: [
-    './landmarkUI.style.css'
-  ],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-
-export class LandmarkUIComponent implements OnChanges, AfterContentChecked{
-  @Input() name: string
-  @Input() fullId: string
-  @Input() datasets: Partial<IDataEntry>[]
-
-  @Output() relayout: EventEmitter<any> = new EventEmitter()
-
-  private pipe = new GetKgSchemaIdFromFullIdPipe()
-
-  public DS_PREVIEW_URL = DS_PREVIEW_URL
-
-  public previewFilesMap: Map<string, any[]> = new Map()
-  public previewFiles: any[] = []
-
-  handleKgDsPrvUpdate(event: CustomEvent, datasetKgId: string){
-    const { detail } = event
-    const { datasetFiles } = detail
-
-    this.previewFilesMap.set(datasetKgId, datasetFiles)
-
-    this.previewFiles = []
-
-    for (const [datasetKgId, previewFiles] of Array.from(this.previewFilesMap)){
-      for (const singlePreviewFile of previewFiles){
-        this.previewFiles.push({
-          ...singlePreviewFile,
-          datasetKgId
-        })
-      }
-    }
-    this.cdr.markForCheck()
-  }
-
-  public filterCriteria: string
-  ngOnChanges(){
-    this.filterCriteria = null
-    if (!this.fullId) return
-    const [kgSchema, kgId] = this.pipe.transform(this.fullId)
-    this.filterCriteria = JSON.stringify([ `${kgSchema}/${kgId}` ])
-  }
-
-  // TODO need to optimise this. This calls way too frequently.
-  ngAfterContentChecked(){
-    this.relayout.emit()
-  }
-
-  public darktheme$: Observable<boolean>
-
-  constructor(
-    constantService: AtlasViewerConstantsServices,
-    private cdr: ChangeDetectorRef
-  ){
-    this.darktheme$ = constantService.darktheme$
-  }
-}
\ No newline at end of file
diff --git a/src/ui/landmarkUI/landmarkUI.style.css b/src/ui/landmarkUI/landmarkUI.style.css
deleted file mode 100644
index 757b1a7bcba50d2da823755e085849b453bff61a..0000000000000000000000000000000000000000
--- a/src/ui/landmarkUI/landmarkUI.style.css
+++ /dev/null
@@ -1,21 +0,0 @@
-kg-dataset-previewer
-{
-  height: 20em;
-  width: 30em;
-}
-.scroll-snap-container
-{
-  scroll-snap-type: x mandatory;
-  scroll-padding-left: 1em;
-  scroll-padding-right: 1em;
-}
-
-.scroll-snap-container > .scroll-snap-child
-{
-  scroll-snap-align: center;
-}
-
-.w-30em
-{
-  width:30em!important;
-}
\ No newline at end of file
diff --git a/src/ui/landmarkUI/landmarkUI.template.html b/src/ui/landmarkUI/landmarkUI.template.html
deleted file mode 100644
index 46085769ecdd1ea45a56ef7cc7f05a6bf690744f..0000000000000000000000000000000000000000
--- a/src/ui/landmarkUI/landmarkUI.template.html
+++ /dev/null
@@ -1,67 +0,0 @@
-<mat-card>
-  <mat-card-title>
-
-    {{ name }}
-  </mat-card-title>
-  <mat-card-subtitle>
-
-    <i class="fas fa-map-marker-alt"></i>
-    <span>
-      spatial landmark
-    </span>
-  </mat-card-subtitle>
-
-  <div class="scroll-snap-container w-100 d-flex flex-row w-30em overflow-auto" mat-card-image>
-    <div *ngFor="let dsPreview of previewFiles"
-      class="scroll-snap-child w-30em">
-      <kg-dataset-previewer
-        [darkmode]="darktheme$ | async"
-        [filename]="dsPreview.filename"
-        [kgId]="dsPreview.datasetKgId"
-        [backendUrl]="DS_PREVIEW_URL">
-      </kg-dataset-previewer>
-    </div>
-
-  </div>
-  <mat-card-content>
-
-    <!-- preview -->
-    <div>
-      <small class="text-muted">
-        Dataset preview
-      </small>
-
-      <ng-container *ngFor="let dataset of datasets; let index = index">
-        <kg-dataset-list
-          class="d-none"
-          [backendUrl]="DS_PREVIEW_URL"
-          [filterCriteriaProp]="filterCriteria"
-          *ngIf="dataset.fullId | getKgSchemaIdFromFullIdPipe as kgSchemaId"
-          (kgDsPrvUpdated)="handleKgDsPrvUpdate($event, kgSchemaId[1])"
-          [kgId]="kgSchemaId[1]">
-
-        </kg-dataset-list>
-      </ng-container>
-    </div>
-
-    <hr class="text-muted">
-    <!-- associated datasets -->
-    <div>
-      <small class="text-muted">
-        Associated datasets
-      </small>
-      <div>
-        <ng-container *ngFor="let dataset of datasets">
-
-          <single-dataset-list-view
-            *ngIf="dataset.fullId | getKgSchemaIdFromFullIdPipe as kgSchemaId"
-            [ripple]="true"
-            [kgSchema]="kgSchemaId[0]"
-            [kgId]="kgSchemaId[1]">
-
-          </single-dataset-list-view>
-        </ng-container>
-      </div>
-    </div>
-  </mat-card-content>
-</mat-card>
diff --git a/src/ui/nehubaContainer/2dLandmarks/landmark.base.ts b/src/ui/nehubaContainer/2dLandmarks/landmark.base.ts
index 52144fb7a41476a6387914067062fd6af99a3653..9d424edba5344b152eb561d4f8e3b92a0414925e 100644
--- a/src/ui/nehubaContainer/2dLandmarks/landmark.base.ts
+++ b/src/ui/nehubaContainer/2dLandmarks/landmark.base.ts
@@ -4,4 +4,6 @@ export class LandmarkUnitBase{
   @Input() public positionX: number = 0
   @Input() public positionY: number = 0
   @Input() public positionZ: number = 0
+
+  @Input() public color: number[] = [255, 255, 255]
 }
diff --git a/src/ui/signinBanner/signinBanner.components.ts b/src/ui/signinBanner/signinBanner.components.ts
index ef5c4e442357fcd684657bb9fb503888d11d5e30..8bd34108146a889fab88c6543f849521df0d5282 100644
--- a/src/ui/signinBanner/signinBanner.components.ts
+++ b/src/ui/signinBanner/signinBanner.components.ts
@@ -19,7 +19,6 @@ import { CONST } from 'common/constants'
   templateUrl: './signinBanner.template.html',
   styleUrls: [
     './signinBanner.style.css',
-    '../btnShadow.style.css',
   ],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
diff --git a/src/ui/templateParcellationCitations/templateParcellationCitations.component.ts b/src/ui/templateParcellationCitations/templateParcellationCitations.component.ts
deleted file mode 100644
index c97715d798fbf1345ee5832cd890d2ebcb0ef477..0000000000000000000000000000000000000000
--- a/src/ui/templateParcellationCitations/templateParcellationCitations.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component } from "@angular/core";
-import { select, Store } from "@ngrx/store";
-import { Observable } from "rxjs";
-import { map, switchMap } from "rxjs/operators";
-import { safeFilter, IavRootStoreInterface } from "../../services/stateStore.service";
-
-@Component({
-  selector : 'template-parcellation-citation-container',
-  templateUrl : './templateParcellationCitations.template.html',
-  styleUrls : [
-    './templateParcellationCitations.style.css',
-  ],
-})
-
-export class TemplateParcellationCitationsContainer {
-  public selectedTemplate$: Observable<any>
-  public selectedParcellation$: Observable<any>
-
-  constructor(private store: Store<IavRootStoreInterface>) {
-    this.selectedTemplate$ = this.store.pipe(
-      select('viewerState'),
-      safeFilter('templateSelected'),
-      map(state => state.templateSelected),
-    )
-
-    this.selectedParcellation$ = this.selectedTemplate$.pipe(
-      switchMap(() => this.store.pipe(
-        select('viewerState'),
-        safeFilter('parcellationSelected'),
-        map(state => state.parcellationSelected),
-      )),
-    )
-  }
-}
diff --git a/src/ui/templateParcellationCitations/templateParcellationCitations.style.css b/src/ui/templateParcellationCitations/templateParcellationCitations.style.css
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/ui/templateParcellationCitations/templateParcellationCitations.template.html b/src/ui/templateParcellationCitations/templateParcellationCitations.template.html
deleted file mode 100644
index 48b54d534f9efe9b53f055ccbae85f689afe67d9..0000000000000000000000000000000000000000
--- a/src/ui/templateParcellationCitations/templateParcellationCitations.template.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<citations-component 
-  *ngIf = "selectedTemplate$ | async"
-  [properties] = "(selectedTemplate$ | async).properties"
-  citationContainer>
-
-</citations-component>
-<citations-component
-  *ngIf = "selectedParcellation$ | async"
-  [properties] = "(selectedParcellation$ | async).properties"
-  citationContainer>
-</citations-component>
\ No newline at end of file
diff --git a/src/ui/ui.module.ts b/src/ui/ui.module.ts
index e58bd77ba1c134fad099b3c439e73b425f7cc1c4..04202ca122d30871f35900a0a66b2406b438b018 100644
--- a/src/ui/ui.module.ts
+++ b/src/ui/ui.module.ts
@@ -1,10 +1,9 @@
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from "@angular/core";
+import { NgModule } from "@angular/core";
 import { ComponentsModule } from "src/components/components.module";
 
 import { FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { LayoutModule } from "src/layouts/layout.module";
 import { NehubaContainer } from "./nehubaContainer/nehubaContainer.component";
-import { IMPORT_NEHUBA_INJECT_TOKEN } from "./nehubaContainer/nehubaViewer/nehubaViewer.component";
 import { GetTemplateImageSrcPipe, ImgSrcSetPipe, SplashScreen } from "./nehubaContainer/splashScreen/splashScreen.component";
 
 import { FilterRegionDataEntries } from "src/util/pipes/filterRegionDataEntries.pipe";
@@ -13,8 +12,6 @@ import { GroupDatasetByRegion } from "src/util/pipes/groupDataEntriesByRegion.pi
 import { GetLayerNameFromDatasets } from "../util/pipes/getLayerNamePipe.pipe";
 import { SortDataEntriesToRegion } from "../util/pipes/sortDataEntriesIntoRegion.pipe";
 import { CitationsContainer } from "./citation/citations.component";
-import { KgEntryViewer } from "./kgEntryViewer/kgentry.component";
-import { SubjectViewer } from "./kgEntryViewer/subjectViewer/subjectViewer.component";
 import { PluginBannerUI } from "./pluginBanner/pluginBanner.component";
 
 import { ScrollingModule } from "@angular/cdk/scrolling"
@@ -33,7 +30,7 @@ import { HorizontalOneThree } from "./config/layouts/h13/h13.component";
 import { SinglePanel } from "./config/layouts/single/single.component";
 import { VerticalOneThree } from "./config/layouts/v13/v13.component";
 import { CookieAgreement } from "./cookieAgreement/cookieAgreement.component";
-import { DatabrowserModule } from "./databrowserModule/databrowser.module";
+import { DatabrowserModule } from "../atlasComponents/databrowserModule/databrowser.module";
 import { HelpComponent } from "./help/help.component";
 import { KGToS } from "./kgtos/kgtos.component";
 import { LogoContainer } from "./logoContainer/logoContainer.component";
@@ -42,11 +39,6 @@ import { MobileControlNubStylePipe } from "./nehubaContainer/pipes/mobileControl
 import { StatusCardComponent } from "./nehubaContainer/statusCard/statusCard.component";
 import { SigninBanner } from "./signinBanner/signinBanner.components";
 
-import { TemplateParcellationCitationsContainer } from "./templateParcellationCitations/templateParcellationCitations.component";
-import { FilterNameBySearch } from "./viewerStateController/regionHierachy/filterNameBySearch.pipe";
-
-import { ViewerStateMini } from 'src/ui/viewerStateController/viewerStateCMini/viewerStateMini.component'
-
 import { HumanReadableFileSizePipe } from "src/util/pipes/humanReadableFileSize.pipe";
 import { KgSearchBtnColorPipe } from "src/util/pipes/kgSearchBtnColor.pipe";
 import { PluginBtnFabColorPipe } from "src/util/pipes/pluginBtnFabColor.pipe";
@@ -54,38 +46,28 @@ import { TemplateParcellationHasMoreInfo } from "src/util/pipes/templateParcella
 import { MaximmisePanelButton } from "./nehubaContainer/maximisePanelButton/maximisePanelButton.component";
 import { ReorderPanelIndexPipe } from "./nehubaContainer/reorderPanelIndex.pipe";
 import { TouchSideClass } from "./nehubaContainer/touchSideClass.directive";
-import { BinSavedRegionsSelectionPipe, SavedRegionsSelectionBtnDisabledPipe } from "./viewerStateController/viewerState.pipes";
 
 import { FixedMouseContextualContainerDirective } from "src/util/directives/FixedMouseContextualContainerDirective.directive";
-import { RegionHierarchy } from './viewerStateController/regionHierachy/regionHierarchy.component'
-import { RegionTextSearchAutocomplete } from "./viewerStateController/regionSearch/regionSearch.component";
 
-import { ConnectivityBrowserComponent } from "src/ui/connectivityBrowser/connectivityBrowser.component";
-import { RegionMenuComponent } from 'src/ui/parcellationRegion/regionMenu/regionMenu.component'
-import { RegionListSimpleViewComponent } from "./parcellationRegion/regionListSimpleView/regionListSimpleView.component";
-import { SimpleRegionComponent } from "./parcellationRegion/regionSimple/regionSimple.component";
-import { LandmarkUIComponent } from "./landmarkUI/landmarkUI.component";
-import { NehubaModule } from "./nehubaContainer/nehuba.module";
 import { ShareModule } from "src/share";
 import { StateModule } from "src/state";
 import { AuthModule } from "src/auth";
 import { FabSpeedDialModule } from "src/components/fabSpeedDial";
 import { ActionDialog } from "./actionDialog/actionDialog.component";
-import { NehubaViewerTouchDirective } from "./nehubaContainer/nehubaViewerInterface/nehubaViewerTouch.directive";
-import { importNehubaFactory } from "./nehubaContainer/util";
 import { APPEND_SCRIPT_TOKEN, appendScriptFactory } from "src/util/constants";
 import { DOCUMENT } from "@angular/common";
-import { AtlasDropdownSelector } from './atlasDropdown/atlasDropdown.component'
-import { AtlasLayerSelector } from "src/ui/atlasLayerSelector/atlasLayerSelector.component";
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
-import { RegionDirective } from "./parcellationRegion/region.directive";
-import { RenderViewOriginDatasetLabelPipe } from "./parcellationRegion/region.base";
 import { RegionAccordionTooltipTextPipe } from './util'
 import { HelpOnePager } from "./helpOnePager/helpOnePager.component";
-import { RegionalFeaturesModule } from "./regionalFeatures";
+import { RegionalFeaturesModule } from "../atlasComponents/regionalFeatures";
 import { Landmark2DModule } from "./nehubaContainer/2dLandmarks/module";
 import { PluginCspCtrlCmp } from "./config/pluginCsp/pluginCsp.component";
 import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise } from "./screenshot";
+import { ParcellationRegionModule } from "src/atlasComponents/parcellationRegion";
+import { AtlasCmpUiSelectorsModule } from "src/atlasComponents/uiSelectors";
+import { AtlasCmpParcellationModule } from "src/atlasComponents/parcellation";
+import { AtlasCmptConnModule } from "src/atlasComponents/connectivity";
+import { ViewerModule } from "src/viewerModule";
 
 @NgModule({
   imports : [
@@ -99,7 +81,7 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     UtilModule,
     ScrollingModule,
     AngularMaterialModule,
-    NehubaModule,
+    ViewerModule,
     ShareModule,
     StateModule,
     AuthModule,
@@ -107,6 +89,10 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     RegionalFeaturesModule,
     Landmark2DModule,
     ScreenshotModule,
+    ParcellationRegionModule,
+    AtlasCmpUiSelectorsModule,
+    AtlasCmpParcellationModule,
+    AtlasCmptConnModule,
   ],
   declarations : [
     NehubaContainer,
@@ -114,17 +100,11 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     SplashScreen,
     PluginBannerUI,
     CitationsContainer,
-    KgEntryViewer,
-    SubjectViewer,
     LogoContainer,
-    TemplateParcellationCitationsContainer,
     MobileOverlay,
     HelpComponent,
     ConfigComponent,
     SigninBanner,
-    AtlasDropdownSelector,
-    AtlasLayerSelector,
-    AtlasDropdownSelector,
     PluginCspCtrlCmp,
 
     StatusCardComponent,
@@ -135,15 +115,7 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     VerticalOneThree,
     SinglePanel,
     CurrentLayout,
-    ViewerStateMini,
-    RegionHierarchy,
     MaximmisePanelButton,
-    RegionTextSearchAutocomplete,
-    RegionMenuComponent,
-    ConnectivityBrowserComponent,
-    SimpleRegionComponent,
-    RegionListSimpleViewComponent,
-    LandmarkUIComponent,
     HelpOnePager,
 
     ActionDialog,
@@ -155,7 +127,6 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     GetLayerNameFromDatasets,
     SortDataEntriesToRegion,
     SpatialLandmarksToDataBrowserItemPipe,
-    FilterNameBySearch,
     AppendtooltipTextPipe,
     MobileControlNubStylePipe,
     GetTemplateImageSrcPipe,
@@ -163,28 +134,18 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     PluginBtnFabColorPipe,
     KgSearchBtnColorPipe,
     GetFileExtension,
-    BinSavedRegionsSelectionPipe,
-    SavedRegionsSelectionBtnDisabledPipe,
 
     TemplateParcellationHasMoreInfo,
     HumanReadableFileSizePipe,
     ReorderPanelIndexPipe,
-    RenderViewOriginDatasetLabelPipe,
     RegionAccordionTooltipTextPipe,
 
     /* directive */
     DownloadDirective,
     TouchSideClass,
     FixedMouseContextualContainerDirective,
-    NehubaViewerTouchDirective,
-    RegionDirective
   ],
   providers: [
-    {
-      provide: IMPORT_NEHUBA_INJECT_TOKEN,
-      useFactory: importNehubaFactory,
-      deps: [ APPEND_SCRIPT_TOKEN ]
-    },
     {
       provide: APPEND_SCRIPT_TOKEN,
       useFactory: appendScriptFactory,
@@ -253,35 +214,21 @@ import { ScreenshotModule, HANDLE_SCREENSHOT_PROMISE, TypeHandleScrnShotPromise
     ActionDialog,
   ],
   exports : [
-    SubjectViewer,
-    KgEntryViewer,
     CitationsContainer,
     PluginBannerUI,
     NehubaContainer,
     
     LogoContainer,
-    TemplateParcellationCitationsContainer,
     MobileOverlay,
     HelpComponent,
     ConfigComponent,
     SigninBanner,
-    AtlasLayerSelector,
-    RegionDirective,
     
     CookieAgreement,
     KGToS,
     StatusCardComponent,
-    ViewerStateMini,
-    RegionMenuComponent,
     FixedMouseContextualContainerDirective,
-    LandmarkUIComponent,
-    NehubaViewerTouchDirective,
-    AtlasDropdownSelector,
-    RenderViewOriginDatasetLabelPipe,
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA,
-  ],
+  ]
 })
 
 export class UIModule {
diff --git a/src/ui/viewerStateController/viewerState.base.ts b/src/ui/viewerStateController/viewerState.base.ts
deleted file mode 100644
index 70a67c226bec656ba46429e5d9cd203605a5fcd9..0000000000000000000000000000000000000000
--- a/src/ui/viewerStateController/viewerState.base.ts
+++ /dev/null
@@ -1,201 +0,0 @@
-import { OnInit, TemplateRef, ViewChild } from "@angular/core";
-import { select, Store } from "@ngrx/store";
-import { Observable, Subscription } from "rxjs";
-import { distinctUntilChanged, filter, shareReplay } from "rxjs/operators";
-import { DialogService } from "src/services/dialogService.service";
-import { RegionSelection } from "src/services/state/userConfigState.store";
-import { IavRootStoreInterface, SELECT_REGIONS, USER_CONFIG_ACTION_TYPES } from "src/services/stateStore.service";
-import { MatSelectChange } from "@angular/material/select";
-import { MatBottomSheet, MatBottomSheetRef } from "@angular/material/bottom-sheet";
-import { viewerStateSelectTemplateWithName } from "src/services/state/viewerState/actions";
-
-const ACTION_TYPES = {
-  SELECT_PARCELLATION_WITH_NAME: 'SELECT_PARCELLATION_WITH_NAME',
-
-}
-
-export class ViewerStateBase implements OnInit {
-
-  @ViewChild('savedRegionBottomSheetTemplate', {read: TemplateRef}) public savedRegionBottomSheetTemplate: TemplateRef<any>
-
-  public focused: boolean = false
-
-  private subscriptions: Subscription[] = []
-
-  public standaloneVolumes$: Observable<any[]>
-
-  public availableTemplates$: Observable<any[]>
-  public availableParcellations$: Observable<any[]>
-
-  public templateSelected$: Observable<any>
-  public parcellationSelected$: Observable<any>
-  public regionsSelected$: Observable<any>
-
-  public savedRegionsSelections$: Observable<any[]>
-
-  private savedRegionBottomSheetRef: MatBottomSheetRef
-
-  constructor(
-    private store$: Store<IavRootStoreInterface>,
-    private dialogService: DialogService,
-    private bottomSheet: MatBottomSheet,
-  ) {
-    const viewerState$ = this.store$.pipe(
-      select('viewerState'),
-      shareReplay(1),
-    )
-
-    this.savedRegionsSelections$ = this.store$.pipe(
-      select('userConfigState'),
-      select('savedRegionsSelection'),
-      shareReplay(1),
-    )
-
-    this.templateSelected$ = viewerState$.pipe(
-      select('templateSelected'),
-      distinctUntilChanged(),
-    )
-
-    this.parcellationSelected$ = viewerState$.pipe(
-      select('parcellationSelected'),
-      distinctUntilChanged(),
-      shareReplay(1),
-    )
-
-    this.regionsSelected$ = viewerState$.pipe(
-      select('regionsSelected'),
-      distinctUntilChanged(),
-      shareReplay(1),
-    )
-
-    this.standaloneVolumes$ = viewerState$.pipe(
-      select('standaloneVolumes'),
-      distinctUntilChanged(),
-      shareReplay(1)
-    )
-
-    this.availableTemplates$ = viewerState$.pipe(
-      select('fetchedTemplates'),
-      distinctUntilChanged()
-    )
-
-    this.availableParcellations$ = this.templateSelected$.pipe(
-      select('parcellations'),
-    )
-
-  }
-
-  public ngOnInit() {
-    this.subscriptions.push(
-      this.savedRegionsSelections$.pipe(
-        filter(srs => srs.length === 0),
-      ).subscribe(() => this.savedRegionBottomSheetRef && this.savedRegionBottomSheetRef.dismiss()),
-    )
-  }
-
-  public handleTemplateChange(event: MatSelectChange) {
-    this.store$.dispatch(
-      viewerStateSelectTemplateWithName({
-        payload: { name: event.value }
-      })
-    )
-  }
-
-  public handleParcellationChange(event: MatSelectChange) {
-    if (!event.value) { return }
-    this.store$.dispatch({
-      type: ACTION_TYPES.SELECT_PARCELLATION_WITH_NAME,
-      payload: {
-        name: event.value,
-      },
-    })
-  }
-
-  public loadSavedRegion(event: MouseEvent, savedRegionsSelection: RegionSelection) {
-    this.store$.dispatch({
-      type: USER_CONFIG_ACTION_TYPES.LOAD_REGIONS_SELECTION,
-      payload: {
-        savedRegionsSelection,
-      },
-    })
-  }
-
-  public editSavedRegion(event: MouseEvent, savedRegionsSelection: RegionSelection) {
-    event.preventDefault()
-    event.stopPropagation()
-    this.dialogService.getUserInput({
-      defaultValue: savedRegionsSelection.name,
-      placeholder: `Enter new name`,
-      title: 'Edit name',
-      iconClass: null,
-    }).then(name => {
-      if (!name) { throw new Error('user cancelled') }
-      this.store$.dispatch({
-        type: USER_CONFIG_ACTION_TYPES.UPDATE_REGIONS_SELECTION,
-        payload: {
-          ...savedRegionsSelection,
-          name,
-        },
-      })
-    }).catch(e => {
-      // TODO catch user cancel
-    })
-  }
-  public removeSavedRegion(event: MouseEvent, savedRegionsSelection: RegionSelection) {
-    event.preventDefault()
-    event.stopPropagation()
-    this.store$.dispatch({
-      type: USER_CONFIG_ACTION_TYPES.DELETE_REGIONS_SELECTION,
-      payload: {
-        ...savedRegionsSelection,
-      },
-    })
-  }
-
-  public trackByFn = ({ name }) => name
-
-  public loadSelection(_event: MouseEvent) {
-    this.focused = true
-
-    this.savedRegionBottomSheetRef = this.bottomSheet.open(this.savedRegionBottomSheetTemplate)
-    this.savedRegionBottomSheetRef.afterDismissed()
-      .subscribe(null, null, () => {
-        this.focused = false
-        this.savedRegionBottomSheetRef = null
-      })
-  }
-
-  public saveSelection(_event: MouseEvent) {
-    this.focused = true
-    this.dialogService.getUserInput({
-      defaultValue: `Saved Region`,
-      placeholder: `Name the selection`,
-      title: 'Save region selection',
-      iconClass: 'far fa-bookmark',
-    })
-      .then(name => {
-        if (!name) { throw new Error('User cancelled') }
-        this.store$.dispatch({
-          type: USER_CONFIG_ACTION_TYPES.SAVE_REGIONS_SELECTION,
-          payload: { name },
-        })
-      })
-      .catch(e => {
-        /**
-         * TODO USER CANCELLED, HANDLE
-         */
-      })
-      .finally(() => this.focused = false)
-  }
-
-  public deselectAllRegions(_event: MouseEvent) {
-    this.store$.dispatch({
-      type: SELECT_REGIONS,
-      selectRegions: [],
-    })
-  }
-
-}
-
-export const VIEWERSTATE_CONTROLLER_ACTION_TYPES = ACTION_TYPES
-
diff --git a/src/ui/viewerStateController/viewerState.pipes.ts b/src/ui/viewerStateController/viewerState.pipes.ts
deleted file mode 100644
index 400ed875be821b17776f5623d11a3e7ebbed2159..0000000000000000000000000000000000000000
--- a/src/ui/viewerStateController/viewerState.pipes.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Pipe, PipeTransform } from "@angular/core";
-import { RegionSelection } from "src/services/state/userConfigState.store";
-
-@Pipe({
-  name: 'binSavedRegionsSelectionPipe',
-})
-
-export class BinSavedRegionsSelectionPipe implements PipeTransform {
-  public transform(regionSelections: RegionSelection[]): Array<{parcellationSelected: any, templateSelected: any, regionSelections: RegionSelection[]}> {
-    const returnMap = new Map()
-    for (const regionSelection of regionSelections) {
-      const key = `${regionSelection.templateSelected.name}\n${regionSelection.parcellationSelected.name}`
-      const existing = returnMap.get(key)
-      if (existing) { existing.push(regionSelection) } else { returnMap.set(key, [regionSelection]) }
-    }
-    return Array.from(returnMap)
-      .map(([_unused, regionSelections]) => {
-        const {parcellationSelected = null, templateSelected = null} = regionSelections[0] || {}
-        return {
-          regionSelections,
-          parcellationSelected,
-          templateSelected,
-        }
-      })
-  }
-}
-
-@Pipe({
-  name: 'savedRegionsSelectionBtnDisabledPipe',
-})
-
-export class SavedRegionsSelectionBtnDisabledPipe implements PipeTransform {
-  public transform(regionSelection: RegionSelection, templateSelected: any, parcellationSelected: any): boolean {
-    return regionSelection.parcellationSelected.name !== parcellationSelected.name
-      || regionSelection.templateSelected.name !== templateSelected.name
-  }
-}
diff --git a/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.component.ts b/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.component.ts
deleted file mode 100644
index 66ff71b0c37b93d3ecba2c26980e90b1fa4f22f5..0000000000000000000000000000000000000000
--- a/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.component.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import { Component } from "@angular/core";
-import { Store } from "@ngrx/store";
-import { DialogService } from "src/services/dialogService.service";
-
-import { IavRootStoreInterface } from "src/services/stateStore.service";
-import { ViewerStateBase } from '../viewerState.base'
-import {MatBottomSheet} from "@angular/material/bottom-sheet";
-
-@Component({
-  selector: 'viewer-state-mini',
-  templateUrl: './viewerStateMini.template.html',
-  styleUrls: [
-    './viewerStateMini.style.css',
-  ],
-})
-
-export class ViewerStateMini extends ViewerStateBase {
-
-  constructor(
-    store$: Store<IavRootStoreInterface>,
-    dialogService: DialogService,
-    bottomSheet: MatBottomSheet,
-  ) {
-    super(store$, dialogService, bottomSheet)
-  }
-}
diff --git a/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.style.css b/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.style.css
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.template.html b/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.template.html
deleted file mode 100644
index 2604321cb2f7ec6f857ab83acaff064338a19284..0000000000000000000000000000000000000000
--- a/src/ui/viewerStateController/viewerStateCMini/viewerStateMini.template.html
+++ /dev/null
@@ -1,22 +0,0 @@
-<!-- selected template and parcellation -->
-<div *ngIf="templateSelected$ | async as templateSelected">
-  {{ templateSelected.name }}
-</div>
-<div *ngIf="parcellationSelected$ | async as parcellationSelected">
-  {{ (parcellationSelected.displayName || parcellationSelected.name) | tmpParcNamePipe }}
-</div>
-
-<!-- selected parcellation regions -->
-<ng-container *ngIf="regionsSelected$ | async as regionsSelected">
-  <ng-container *ngIf="regionsSelected.length > 0">
-    <div class="mt-2">
-      {{ regionsSelected.length }} region{{ regionsSelected.length > 1 ? 's' : '' }} selected
-    </div>
-  </ng-container>
-</ng-container>
-
-<ng-container *ngIf="standaloneVolumes$ | async as standaloneVolumes">
-  <div *ngFor="let vol of standaloneVolumes">
-    {{ vol }}
-  </div>
-</ng-container>
\ No newline at end of file
diff --git a/webpack.aot.js b/webpack/webpack.aot.js
similarity index 92%
rename from webpack.aot.js
rename to webpack/webpack.aot.js
index f11f39b77e09aed04a563bfc245221c1c4b14491..15b1f95e5e5e1b658e16caf3361cf30b2161bda5 100644
--- a/webpack.aot.js
+++ b/webpack/webpack.aot.js
@@ -16,7 +16,7 @@ module.exports = merge(staticAssets, {
   },
   output : {
     filename : '[name].js',
-    path : path.resolve(__dirname,'dist/aot')
+    path : path.resolve(__dirname,'../dist/aot')
   },
   module: {
     rules: [
@@ -83,8 +83,8 @@ module.exports = merge(staticAssets, {
       '.json'
     ],
     alias : {
-      "third_party" : path.resolve(__dirname,'third_party'),
-      "src" : path.resolve(__dirname,'src')
+      "third_party" : path.resolve(__dirname,'../third_party'),
+      "src" : path.resolve(__dirname,'../src')
     }
   }
 })
\ No newline at end of file
diff --git a/webpack.common.js b/webpack/webpack.common.js
similarity index 72%
rename from webpack.common.js
rename to webpack/webpack.common.js
index 52e987bddbf7f90d2b16f55ff9b4a16b0b221953..a84b8489c97ef4b52e9350d7bf04f1643f22ae55 100644
--- a/webpack.common.js
+++ b/webpack/webpack.common.js
@@ -21,7 +21,7 @@ module.exports = {
     ]
   },
   plugins : [
-    new webpack.ContextReplacementPlugin(/@angular(\\|\/)core(\\|\/)/,path.join(__dirname,'src'))
+    new webpack.ContextReplacementPlugin(/@angular(\\|\/)core(\\|\/)/,path.join(__dirname, '../src'))
   ],
   resolve : {
     extensions : [
@@ -30,10 +30,10 @@ module.exports = {
       '.json'
     ],
     alias : {
-      "third_party" : path.resolve(__dirname,'third_party'),
-      "src" : path.resolve(__dirname,'src'),
-      "common": path.resolve(__dirname, 'common'),
-      "spec": path.resolve(__dirname, 'spec')
+      "third_party" : path.resolve(__dirname, '../third_party'),
+      "src" : path.resolve(__dirname, '../src'),
+      "common": path.resolve(__dirname, '../common'),
+      "spec": path.resolve(__dirname, '../spec')
     }
   },
 }
\ No newline at end of file
diff --git a/webpack.dev-aot.js b/webpack/webpack.dev-aot.js
similarity index 92%
rename from webpack.dev-aot.js
rename to webpack/webpack.dev-aot.js
index 6ddd24edaa01173f6394865aa80b944a11bba63d..ca332572fe1a3347891d966cd05052ec5949987f 100644
--- a/webpack.dev-aot.js
+++ b/webpack/webpack.dev-aot.js
@@ -16,7 +16,7 @@ module.exports = merge(staticAssets, {
   },
   output : {
     filename : '[name].js',
-    path : path.resolve(__dirname,'dist/aot')
+    path : path.resolve(__dirname,'../dist/aot')
   },
   devtool:'source-map',
   module: {
@@ -77,8 +77,8 @@ module.exports = merge(staticAssets, {
       '.json'
     ],
     alias : {
-      "third_party" : path.resolve(__dirname,'third_party'),
-      "src" : path.resolve(__dirname,'src')
+      "third_party" : path.resolve(__dirname, '../third_party'),
+      "src" : path.resolve(__dirname, '../src')
     }
   }
 })
diff --git a/webpack.dev.js b/webpack/webpack.dev.js
similarity index 92%
rename from webpack.dev.js
rename to webpack/webpack.dev.js
index d32be20fe85174ca5ae969f2d1b99ca43d87558b..2a4fcf203ea57027ecfc6f8c5e0b3ccdb58453cd 100644
--- a/webpack.dev.js
+++ b/webpack/webpack.dev.js
@@ -12,7 +12,7 @@ module.exports = merge(common,ngAssets,staticAssets,{
   mode : 'development',
   output : {
     filename : '[name].js',
-    path : path.resolve(__dirname,'dist/dev')
+    path : path.resolve(__dirname,'../dist/dev')
   },
   devtool:'source-map',
 
diff --git a/webpack.export.aot.js b/webpack/webpack.export.aot.js
similarity index 94%
rename from webpack.export.aot.js
rename to webpack/webpack.export.aot.js
index fda5c27b38cc2f8a9208ea0db0b72110359510ab..2612d09449efa54b3a1e4f3bbbd16aceb4744c4b 100644
--- a/webpack.export.aot.js
+++ b/webpack/webpack.export.aot.js
@@ -10,7 +10,7 @@ module.exports = {
   entry : './src/main-aot.ts',
   output : {
     filename : 'main.js',
-    path : path.resolve(__dirname,'dist/export-aot')
+    path : path.resolve(__dirname,'../dist/export-aot')
   },
   module: {
     rules: [
diff --git a/webpack.export.js b/webpack/webpack.export.js
similarity index 93%
rename from webpack.export.js
rename to webpack/webpack.export.js
index d6cc210c905ec7c59a9a8dd123019e407e3a69c5..1276bc1b5a12de4d22e98f5f17ffed32c6a38c25 100644
--- a/webpack.export.js
+++ b/webpack/webpack.export.js
@@ -10,7 +10,7 @@ module.exports = merge(common,ngAssets,{
   mode : 'development',
   output : {
     filename : 'export.js',
-    path : path.resolve(__dirname,'dist/export')
+    path : path.resolve(__dirname,'../dist/export')
   },
   devtool:'source-map',
   plugins : [
diff --git a/webpack.export.min.js b/webpack/webpack.export.min.js
similarity index 92%
rename from webpack.export.min.js
rename to webpack/webpack.export.min.js
index eff53e1cc79c6f71a3a5eb7ce80ba546cdaa02c9..deefdbceeb145418c988df256b4fb85606dd4e7a 100644
--- a/webpack.export.min.js
+++ b/webpack/webpack.export.min.js
@@ -9,7 +9,7 @@ module.exports = merge(common,ngAssets,{
   entry : './src/atlasViewerExports/main.export.ts',
   output : {
     filename : 'export.js',
-    path : path.resolve(__dirname,'dist/export-min')
+    path : path.resolve(__dirname,'../dist/export-min')
   },
   plugins : [
     new ClosureCompilerPlugin({
diff --git a/webpack.ngassets.js b/webpack/webpack.ngassets.js
similarity index 100%
rename from webpack.ngassets.js
rename to webpack/webpack.ngassets.js
diff --git a/webpack.prod.js b/webpack/webpack.prod.js
similarity index 93%
rename from webpack.prod.js
rename to webpack/webpack.prod.js
index 1119c6948c84f0b87eeb626acd7a1b4ba779f97d..325cdd3de8dfd4631952fe887994ab13bd5000f5 100644
--- a/webpack.prod.js
+++ b/webpack/webpack.prod.js
@@ -11,7 +11,7 @@ module.exports = merge(common,ngAssets,staticAssets,{
   entry : './src/main.ts',
   output : {
     filename : 'main.js',
-    path : path.resolve(__dirname,'dist/prod')
+    path : path.resolve(__dirname,'../dist/prod')
   },
   plugins : [
     new ClosureCompilerPlugin({
diff --git a/webpack.staticassets.js b/webpack/webpack.staticassets.js
similarity index 100%
rename from webpack.staticassets.js
rename to webpack/webpack.staticassets.js
diff --git a/webpack.test.js b/webpack/webpack.test.js
similarity index 100%
rename from webpack.test.js
rename to webpack/webpack.test.js