chore: remove used var/fn

chore: add explicit typing
feat: UI indicating parc/space is supported in current selection
bugfix: parcellation view stories provide mock store
feat: parc tile: allow tmpl inj to be used for grped parcs
chore: add box sizing border box to tile component
bugfix: on select tmpl/parc, auto switch if curr parc/tmpl unsuitable
bugfix: resize directive GC

src/atlasComponents/sapi/stories.base.ts

@@ -46,7 +46,8 @@ export const atlasId = {
 
 export const spaceId = {
   human: {
-    mni152: 'minds/core/referencespace/v1.0.0/dafcffc5-4826-4bf1-8ff6-46b8a31ff8e2'
+    mni152: 'minds/core/referencespace/v1.0.0/dafcffc5-4826-4bf1-8ff6-46b8a31ff8e2',
+    bigbrain: 'minds/core/referencespace/v1.0.0/a1655b99-82f1-420f-a3c2-fe80fd4c8588'
   },
   rat: {
     waxholm: "minds/core/referencespace/v1.0.0/d5717c4a-0fa1-46e6-918c-b8003069ade8"
@@ -56,7 +57,9 @@ export const spaceId = {
 export const parcId = {
   human: {
     jba29: "minds/core/parcellationatlas/v1.0.0/94c1125b-b87e-45e4-901c-00daee7f2579-290",
-    longBundle: "juelich/iav/atlas/v1.0.0/5"
+    longBundle: "juelich/iav/atlas/v1.0.0/5",
+    difumo256: "minds/core/parcellationatlas/v1.0.0/141d510f-0342-4f94-ace7-c97d5f160235",
+    corticalLayers: "juelich/iav/atlas/v1.0.0/3"
   },
   rat: {
     v4: 'minds/core/parcellationatlas/v1.0.0/ebb923ba-b4d5-4b82-8088-fa9215c2e1fe-v4'

src/atlasComponents/sapiViews/core/atlas/module.ts

@@ -3,6 +3,7 @@ import { NgModule } from "@angular/core";
 import { SpinnerModule } from "src/components/spinner";
 import { AngularMaterialModule } from "src/sharedModules";
 import { QuickTourModule } from "src/ui/quickTour";
+import { SapiViewsUtilModule } from "../../util";
 import { SapiViewsCoreParcellationModule } from "../parcellation";
 import { SapiViewsCoreSpaceModule } from "../space";
 import { SapiViewsCoreAtlasAtlasDropdownSelector } from "./dropdownAtlasSelector/dropdownAtlasSelector.component";
@@ -16,6 +17,7 @@ import { SapiViewsCoreAtlasAtlasTmplParcSelector } from "./tmplParcSelector/tmpl
     SapiViewsCoreParcellationModule,
     QuickTourModule,
     SpinnerModule,
+    SapiViewsUtilModule,
   ],
   declarations: [
     SapiViewsCoreAtlasAtlasDropdownSelector,

src/atlasComponents/sapiViews/core/atlas/tmplParcSelector/tmplParcSelector.component.ts

 import { animate, state, style, transition, trigger } from "@angular/animations";
 import { ChangeDetectionStrategy, Component, ElementRef, HostBinding, QueryList, ViewChild, ViewChildren } from "@angular/core";
-import { select, Store } from "@ngrx/store";
+import { Store } from "@ngrx/store";
 import { combineLatest, forkJoin, merge, Observable, Subject, Subscription } from "rxjs";
 import { distinctUntilChanged, map, mapTo, shareReplay, switchMap, tap } from "rxjs/operators";
 import { SAPI } from "src/atlasComponents/sapi";
@@ -170,11 +170,7 @@ export class SapiViewsCoreAtlasAtlasTmplParcSelector {
   }
 
 
-  trackbyAtId(t) {
+  trackTmpl(t:SapiSpaceModel) {
     return t['@id']
   }
-
-  trackKeyVal(obj: { key: string, value: any }) {
-    return obj.key
-  }
 }
\ No newline at end of file

src/atlasComponents/sapiViews/core/atlas/tmplParcSelector/tmplParcSelector.stories.ts

@@ -4,7 +4,7 @@ import { provideMockStore } from "@ngrx/store/testing"
 import { action } from "@storybook/addon-actions"
 import { Meta, moduleMetadata, Story } from "@storybook/angular"
 import { SAPI } from "src/atlasComponents/sapi"
-import { spaceId, provideDarkTheme, getHumanAtlas, getMni152, getJba29 } from "src/atlasComponents/sapi/stories.base"
+import { spaceId, provideDarkTheme, getHumanAtlas, getMni152, getJba29, getSpace, atlasId, getParc, parcId } from "src/atlasComponents/sapi/stories.base"
 import { AngularMaterialModule } from "src/sharedModules"
 import { atlasSelection } from "src/state"
 import { SapiViewsCoreAtlasModule } from "../module"
@@ -67,29 +67,49 @@ Template.loaders = [
 
 ]
 
-const asyncLoader = async () => {
-  const atlas = await getHumanAtlas()
-  const template = await getMni152()
-  const parcellation = await getJba29()
-  return {
-    atlas,
-    template,
-    parcellation,
-  }
+export const MNI152JBA29 = Template.bind({})
+MNI152JBA29.args = {
+  
 }
+MNI152JBA29.loaders = [
+  async () => {
+    const atlas = await getHumanAtlas()
+    const template = await getMni152()
+    const parcellation = await getJba29()
+    return {
+      atlas,
+      template,
+      parcellation,
+    }
+  }
+]
 
-export const Default = Template.bind({})
-Default.args = {
-  selected: spaceId.human.mni152
+export const BigBrainJBA29 = Template.bind({})
+BigBrainJBA29.args = {
+  
 }
-Default.loaders = [
-
+BigBrainJBA29.loaders = [
   async () => {
-    const {
+    const atlas = await getHumanAtlas()
+    const template = await getSpace(atlasId.human, spaceId.human.bigbrain)
+    const parcellation = await getJba29()
+    return {
       atlas,
       template,
       parcellation,
-    } = await asyncLoader()
+    }
+  }
+]
+
+export const BigBrainCorticalLayers = Template.bind({})
+BigBrainCorticalLayers.args = {
+  
+}
+BigBrainCorticalLayers.loaders = [
+  async () => {
+    const atlas = await getHumanAtlas()
+    const template = await getSpace(atlasId.human, spaceId.human.bigbrain)
+    const parcellation = await getParc(atlasId.human, parcId.human.corticalLayers)
     return {
       atlas,
       template,
@@ -97,3 +117,20 @@ Default.loaders = [
     }
   }
 ]
+
+export const MNI152LongBundle = Template.bind({})
+MNI152LongBundle.args = {
+  
+}
+MNI152LongBundle.loaders = [
+  async () => {
+    const atlas = await getHumanAtlas()
+    const template = await getMni152()
+    const parcellation = await getParc(atlasId.human, parcId.human.longBundle)
+    return {
+      atlas,
+      template,
+      parcellation,
+    }
+  }
+]
\ No newline at end of file

src/atlasComponents/sapiViews/core/atlas/tmplParcSelector/tmplParcSelector.template.html

@@ -18,10 +18,13 @@
       rowHeight="2:3"
       gutterSize="16">
 
-      <mat-grid-tile *ngFor="let template of availableTemplates$ | async; trackBy: trackbyAtId"
+      <mat-grid-tile *ngFor="let template of availableTemplates$ | async; trackBy: trackTmpl"
         [attr.aria-checked]="(selectedTemplate$ | async)?.['@id']  === template['@id']">
         
         <sxplr-sapiviews-core-space-tile
+          [ngClass]="{
+            'sxplr-extra-muted': !(template | spaceSupportedInCurrentParcellation | async)
+          }"
           [sxplr-sapiviews-core-space-tile-space]="template"
           [sxplr-sapiviews-core-space-tile-selected]="(selectedTemplate$ | async)?.['@id'] === template['@id']"
           (click)="selectTemplate(template)">
@@ -40,16 +43,29 @@
         rowHeight="2:3"
         gutterSize="16">
 
-        <mat-grid-tile *ngFor="let parc of availableParcellations$ | async | filterUnsupportedParc | filterGroupedParcs">
+        <!-- using single parc template, since it's reused in non individual parcellation and tmpl for grp parcellation -->
+        <ng-template #singleParcTmpl let-parc>
           <sxplr-sapiviews-core-parcellation-tile
+            [ngClass]="{
+              'sxplr-extra-muted': !(parc | parcellationSupportedInCurrentSpace | async)
+            }"
+            [sxplr-sapiviews-core-parcellation-tile-selected]="(selectedParcellation$ | async)?.['@id'] === parc['@id']"
             [sxplr-sapiviews-core-parcellation-tile-parcellation]="parc"
             (sxplr-sapiviews-core-parcellation-tile-onclick-parc)="selectParcellation($event)">
 
           </sxplr-sapiviews-core-parcellation-tile>
+        </ng-template>
+
+        <mat-grid-tile *ngFor="let parc of availableParcellations$ | async | filterUnsupportedParc | filterGroupedParcs">
+          <ng-template
+            [ngTemplateOutlet]="singleParcTmpl"
+            [ngTemplateOutletContext]="{ $implicit: parc }">
+          </ng-template>
         </mat-grid-tile>
 
         <mat-grid-tile *ngFor="let group of availableParcellations$ | async | filterUnsupportedParc | filterGroupedParcs : true | filterUnsupportedParc">
           <sxplr-sapiviews-core-parcellation-tile
+            [sxplr-sapiviews-core-parcellation-tile-groupmenu-parc-tmpl]="singleParcTmpl"
             [sxplr-sapiviews-core-parcellation-tile-parcellation]="group"
             (sxplr-sapiviews-core-parcellation-tile-onclick-parc)="selectParcellation($event)">
 

src/atlasComponents/sapiViews/core/parcellation/chip/parcellation.chip.stories.ts

 import { CommonModule } from "@angular/common"
 import { HttpClientModule } from "@angular/common/http"
+import { provideMockStore } from "@ngrx/store/testing"
 import { Meta, moduleMetadata, Story } from "@storybook/angular"
 import { SAPI, SapiParcellationModel } from "src/atlasComponents/sapi"
 import { atlasId, getAtlas, provideDarkTheme, getParc } from "src/atlasComponents/sapi/stories.base"
@@ -19,6 +20,7 @@ export default {
         AngularMaterialModule,
       ],
       providers: [
+        provideMockStore(),
         SAPI,
         ...provideDarkTheme,
       ],

src/atlasComponents/sapiViews/core/parcellation/smartChip/parcellation.smartChip.stories.ts

@@ -7,6 +7,7 @@ import { SAPI, SapiParcellationModel } from "src/atlasComponents/sapi"
 import { atlasId, getAtlas, provideDarkTheme, getParc, getAtlases } from "src/atlasComponents/sapi/stories.base"
 import { AngularMaterialModule } from "src/sharedModules"
 import { SapiViewsCoreParcellationModule } from "../module"
+import { provideMockStore } from "@ngrx/store/testing"
 
 @Component({
   selector: `parc-smart-chip-wrapper`,
@@ -54,6 +55,7 @@ export default {
         AngularMaterialModule,
       ],
       providers: [
+        provideMockStore(),
         SAPI,
         ...provideDarkTheme,
       ],

src/atlasComponents/sapiViews/core/parcellation/tile/parcellation.tile.component.ts

-import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from "@angular/core";
+import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, TemplateRef } from "@angular/core";
 import { SapiParcellationModel } from "src/atlasComponents/sapi";
 import { GroupedParcellation } from "../groupedParcellation";
 
@@ -16,8 +16,18 @@ const lightthemeId = [
 })
 
 export class SapiViewsCoreParcellationParcellationTile implements OnChanges{
+  @Input('sxplr-sapiviews-core-parcellation-tile-groupmenu-parc-tmpl')
+  singleParcTmpl: TemplateRef<any>
+
+  private _parcellation: SapiParcellationModel | GroupedParcellation
   @Input('sxplr-sapiviews-core-parcellation-tile-parcellation')
-  parcellation: SapiParcellationModel | GroupedParcellation
+  set parcellation(val: SapiParcellationModel | GroupedParcellation) {
+    this._parcellation = val
+    this.ngOnChanges()
+  }
+  get parcellation(){
+    return this._parcellation
+  }
 
   @Input('sxplr-sapiviews-core-parcellation-tile-selected')
   selected: boolean = false

src/atlasComponents/sapiViews/core/parcellation/tile/parcellation.tile.stories.ts

 import { CommonModule } from "@angular/common"
 import { HttpClientModule } from "@angular/common/http"
 import { Component, Input, Output, EventEmitter } from "@angular/core"
+import { provideMockStore } from "@ngrx/store/testing"
 import { Meta, moduleMetadata, Story } from "@storybook/angular"
 import { SAPI, SapiParcellationModel } from "src/atlasComponents/sapi"
 import { atlasId, parcId, getAtlas, provideDarkTheme, getParc } from "src/atlasComponents/sapi/stories.base"
@@ -10,6 +11,10 @@ import { SapiViewsCoreParcellationModule } from "../module"
 @Component({
   selector: `parc-tile-wrapper`,
   template: `
+  <ng-template #grpParcTmpl let-parc>
+    {{ parc.name }}
+  </ng-template>
+
   <mat-accordion>
     <mat-expansion-panel *ngFor="let item of parcs | keyvalue">
 
@@ -47,6 +52,24 @@ import { SapiViewsCoreParcellationModule } from "../module"
         </ng-container>
       </ng-template>
     </mat-expansion-panel>
+
+    <mat-expansion-panel>
+      <mat-expansion-panel-header>
+        > grouped tmpl
+      </mat-expansion-panel-header>
+
+      <ng-template matExpansionPanelContent>
+        <ng-container *ngFor="let item of parcs | keyvalue">
+          <sxplr-sapiviews-core-parcellation-tile
+            *ngFor="let parc of (item.value | filterGroupedParcs : true)"
+            [sxplr-sapiviews-core-parcellation-tile-groupmenu-parc-tmpl]="grpParcTmpl"
+            [sxplr-sapiviews-core-parcellation-tile-parcellation]="parc"
+            class="sxplr-m-2"
+            (sxplr-sapiviews-core-parcellation-tile-onclick-parc)="parcClicked.emit($event)">
+          </sxplr-sapiviews-core-parcellation-tile>
+        </ng-container>
+      </ng-template>
+    </mat-expansion-panel>
   </mat-accordion>
   `,
   styles: [
@@ -76,6 +99,7 @@ export default {
         AngularMaterialModule,
       ],
       providers: [
+        provideMockStore(),
         SAPI,
         ...provideDarkTheme,
       ],

src/atlasComponents/sapiViews/core/parcellation/tile/parcellation.tile.template.html

 <mat-menu hasBackDrop="false" #matMenu="matMenu">
 
   <ng-template matMenuContent let-subParcellations="subParcellations">
-    <div class="sxplr-ml-2 sxplr-mr-2">
+
+    <div class="sxplr-custom-cmp sxplr-ml-2 sxplr-mr-2">
       <mat-grid-list
         cols="1"
         [rowHeight]="rowHeight"
@@ -10,15 +11,28 @@
         <mat-grid-tile
           *ngFor="let parc of subParcellations">
 
-          <tile-cmp *ngIf="parc"
-            class="sxplr-custom-cmp text"
-            [tile-text]="parc.name"
-            [tile-image-src]="parc | previewParcellationUrl"
-            [tile-selected]="selected"
-            [tile-image-darktheme]="darktheme"
-            (click)="clickOnParcellation(parc)">
-    
-          </tile-cmp>
+
+          <!-- if parent component injected template, use injected template -->
+          <ng-template
+            [ngIf]="singleParcTmpl"
+            [ngIfElse]="fallbackGrpParcTmpl"
+            [ngTemplateOutlet]="singleParcTmpl"
+            [ngTemplateOutletContext]="{
+              $implicit: parc
+            }">
+          </ng-template>
+
+          <ng-template #fallbackGrpParcTmpl>
+            <tile-cmp *ngIf="parc"
+              class="sxplr-custom-cmp text"
+              [tile-text]="parc.name"
+              [tile-image-src]="parc | previewParcellationUrl"
+              [tile-selected]="selected"
+              [tile-image-darktheme]="darktheme"
+              (click)="clickOnParcellation(parc)">
+      
+            </tile-cmp>
+          </ng-template>
     
         </mat-grid-tile>
       </mat-grid-list>

src/atlasComponents/sapiViews/core/parcellation/tile/singleTile.stories.ts

 import { CommonModule } from "@angular/common"
 import { HttpClientModule } from "@angular/common/http"
-import { Component, Input, Output, EventEmitter } from "@angular/core"
+import { provideMockStore } from "@ngrx/store/testing"
 import { Meta, moduleMetadata, Story } from "@storybook/angular"
 import { SAPI, SapiParcellationModel } from "src/atlasComponents/sapi"
-import { atlasId, parcId, getAtlas, provideDarkTheme, getParc, getHumanAtlas } from "src/atlasComponents/sapi/stories.base"
+import { parcId, provideDarkTheme, getParc, getHumanAtlas } from "src/atlasComponents/sapi/stories.base"
 import { AngularMaterialModule } from "src/sharedModules"
 import { FilterGroupedParcellationPipe } from "../filterGroupedParcellations.pipe"
 import { GroupedParcellation } from "../groupedParcellation"
@@ -21,13 +21,14 @@ export default {
         AngularMaterialModule,
       ],
       providers: [
+        provideMockStore(),
         SAPI,
         ...provideDarkTheme,
       ],
       declarations: [
         
-      ]
-    })
+      ],
+    }),
   ],
 } as Meta
 
@@ -45,7 +46,10 @@ const Template: Story<SapiViewsCoreParcellationParcellationTile> = (args: SapiVi
       gutterSize,
       rowHeight,
       parcellation: groups[1]
-    }
+    },
+    styles: [
+      `sxplr-sapiviews-core-parcellation-tile { display: inline-block; max-width: 8rem; }`
+    ]
   })
 }
 Template.loaders = [

src/atlasComponents/sapiViews/util/module.ts

@@ -2,7 +2,10 @@ import { NgModule } from "@angular/core";
 import { AddUnitAndJoin } from "./addUnitAndJoin.pipe";
 import { IncludesPipe } from "./includes.pipe";
 import { NumbersPipe } from "./numbers.pipe";
+import { ParcellationSupportedInCurrentSpace } from "./parcellationSupportedInCurrentSpace.pipe";
+import { ParcellationSupportedInSpacePipe } from "./parcellationSupportedInSpace.pipe";
 import { ParseDoiPipe } from "./parseDoi.pipe";
+import { SpaceSupportedInCurrentParcellationPipe } from "./spaceSupportedInCurrentParcellation.pipe";
 
 @NgModule({
   declarations: [
@@ -10,12 +13,18 @@ import { ParseDoiPipe } from "./parseDoi.pipe";
     NumbersPipe,
     AddUnitAndJoin,
     IncludesPipe,
+    ParcellationSupportedInSpacePipe,
+    ParcellationSupportedInCurrentSpace,
+    SpaceSupportedInCurrentParcellationPipe,
   ],
   exports: [
     ParseDoiPipe,
     NumbersPipe,
     AddUnitAndJoin,
     IncludesPipe,
+    ParcellationSupportedInSpacePipe,
+    ParcellationSupportedInCurrentSpace,
+    SpaceSupportedInCurrentParcellationPipe,
   ]
 })
 

src/atlasComponents/sapiViews/util/parcellationSupportedInCurrentSpace.pipe.ts

+import { Pipe, PipeTransform } from "@angular/core";
+import { select, Store } from "@ngrx/store";
+import { Observable } from "rxjs";
+import { switchMap } from "rxjs/operators";
+import { SAPI } from "src/atlasComponents/sapi/sapi.service";
+import { SapiParcellationModel } from "src/atlasComponents/sapi/type";
+import { atlasSelection } from "src/state";
+import { ParcellationSupportedInSpacePipe } from "./parcellationSupportedInSpace.pipe"
+
+@Pipe({
+  name: 'parcellationSupportedInCurrentSpace',
+  /**
+   * the pipe is not exactly pure, since it makes http call
+   * but for the sake of angular change detection, this is suitable
+   * since the result should only change on input change
+   */
+  pure: true
+})
+
+export class ParcellationSupportedInCurrentSpace implements PipeTransform{
+
+  private transformPipe = new ParcellationSupportedInSpacePipe(this.sapi)
+
+  private selectedTemplate$ = this.store.pipe(
+    select(atlasSelection.selectors.selectedTemplate)
+  )
+  constructor(
+    private store: Store,
+    private sapi: SAPI,
+  ){}
+
+  public transform(parcellation: SapiParcellationModel): Observable<boolean> {
+    return this.selectedTemplate$.pipe(
+      switchMap(tmpl => this.transformPipe.transform(parcellation, tmpl))
+    )
+  }
+}

src/atlasComponents/sapiViews/util/parcellationSupportedInSpace.pipe.ts

+import { Pipe, PipeTransform } from "@angular/core";
+import { Observable } from "rxjs";
+import { map } from "rxjs/operators";
+import { SAPIParcellation } from "src/atlasComponents/sapi/core";
+import { SAPI } from "src/atlasComponents/sapi/sapi.service";
+import { SapiParcellationModel, SapiSpaceModel } from "src/atlasComponents/sapi/type";
+
+export const knownExceptions = {
+  supported: {
+    /**
+     * jba29
+     */
+    'minds/core/parcellationatlas/v1.0.0/94c1125b-b87e-45e4-901c-00daee7f2579-290': [
+      /**
+       * big brain
+       */
+      'minds/core/referencespace/v1.0.0/a1655b99-82f1-420f-a3c2-fe80fd4c8588'
+    ]
+  }
+}
+
+@Pipe({
+  name: 'parcellationSuppportedInSpace',
+  pure: false,
+})
+
+export class ParcellationSupportedInSpacePipe implements PipeTransform{
+
+  constructor(private sapi: SAPI){}
+
+  public transform(parc: SapiParcellationModel|string, tmpl: SapiSpaceModel|string): Observable<boolean> {
+    const parcId = typeof parc === "string"
+      ? parc
+      : parc["@id"]
+    const tmplId = typeof tmpl === "string"
+      ? tmpl
+      : tmpl["@id"]
+    return this.sapi.registry.get<SAPIParcellation>(parcId).getVolumes().pipe(
+      map(volumes => volumes.some(v => v.data.space["@id"] === tmplId))
+    )
+  }
+}

src/atlasComponents/sapiViews/util/spaceSupportedInCurrentParcellation.pipe.ts

+import { Pipe, PipeTransform } from "@angular/core";
+import { select, Store } from "@ngrx/store";
+import { Observable } from "rxjs";
+import { switchMap } from "rxjs/operators";
+import { SAPI } from "src/atlasComponents/sapi/sapi.service";
+import { SapiSpaceModel } from "src/atlasComponents/sapi/type";
+import { atlasSelection } from "src/state";
+import { ParcellationSupportedInSpacePipe } from "./parcellationSupportedInSpace.pipe"
+
+@Pipe({
+  name: "spaceSupportedInCurrentParcellation",
+  /**
+   * the pipe is not exactly pure, since it makes http call
+   * but for the sake of angular change detection, this is suitable
+   * since the result should only change on input change
+   */
+  pure: true
+})
+
+export class SpaceSupportedInCurrentParcellationPipe implements PipeTransform{
+  private supportedPipe = new ParcellationSupportedInSpacePipe(this.sapi)
+  private selectedParcellation$ = this.store.pipe(
+    select(atlasSelection.selectors.selectedParcellation)
+  )
+  constructor(
+    private store: Store,
+    private sapi: SAPI
+  ){
+
+  }
+  public transform(space: SapiSpaceModel): Observable<boolean> {
+    return this.selectedParcellation$.pipe(
+      switchMap(parc => 
+        this.supportedPipe.transform(parc, space)
+      )
+    )
+  }
+}

src/components/tile/tile.style.css

@@ -9,6 +9,7 @@
 
 .tile-selected {
   border: 2px solid #FED363;
+  box-sizing: border-box;
 }
 
 :host,

src/overwrite.scss

@@ -191,6 +191,14 @@ $justify-content-vars: end, center, space-between;
   opacity: 0.75;
 }
 
+.#{$nsp}-very-muted {
+  opacity: 0.5;
+}
+
+.#{$nsp}-extra-muted {
+  opacity: 0.25;
+}
+
 $position-vars: relative, absolute;
 @each $position-var in $position-vars {
   .#{$nsp}-position-#{$position-var} {

src/state/atlasSelection/actions.ts

 import { createAction, props } from "@ngrx/store";
 import { SapiAtlasModel, SapiParcellationModel, SapiRegionModel, SapiSpaceModel } from "src/atlasComponents/sapi";
-import { BreadCrumb, nameSpace, ViewerMode } from "./const"
+import { BreadCrumb, nameSpace, ViewerMode, AtlasSelectionState } from "./const"
 
 export const selectAtlas = createAction(
   `${nameSpace} selectAtlas`,
@@ -23,6 +23,28 @@ export const selectParcellation = createAction(
   }>()
 )
 
+/**
+ * setATP is called as a final step to (potentially) set:
+ * - selectedAtlas
+ * - selectedTemplate
+ * - selectedParcellation
+ * 
+ * It is up to the dispatcher to ensure that the selection makes sense.
+ * If any field is unset, it will take the default value from the store.
+ * It is **specifically** not setup to do **anymore** than atlas, template and parcellation
+ * 
+ * We may setup post hook for navigation adjustments/etc.
+ * Probably easier is simply subscribe to store and react to selectedTemplate selector
+ */
+export const setATP = createAction(
+  `${nameSpace} setATP`,
+  props<{
+    atlas?: SapiAtlasModel,
+    template?: SapiSpaceModel,
+    parcellation?: SapiParcellationModel,
+  }>()
+)
+
 export const setSelectedParcellationAllRegions = createAction(
   `${nameSpace} setSelectedParcellationAllRegions`,
   props<{

src/state/atlasSelection/const.ts

+import { SapiAtlasModel, SapiParcellationModel, SapiRegionModel, SapiSpaceModel } from "src/atlasComponents/sapi"
+
 export const nameSpace = `[state.atlasSelection]`
 export type ViewerMode = 'annotating' | 'key frame'
 export type BreadCrumb = {
   id: string
   name: string
 }
+
+export type AtlasSelectionState = {
+  selectedAtlas: SapiAtlasModel
+  selectedTemplate: SapiSpaceModel
+  selectedParcellation: SapiParcellationModel
+  selectedParcellationAllRegions: SapiRegionModel[]
+
+  selectedRegions: SapiRegionModel[]
+  standAloneVolumes: string[]
+
+  /**
+   * the navigation may mean something very different
+   * depending on if the user is using threesurfer/nehuba view
+   */
+  navigation: {
+    position: number[]
+    orientation: number[]
+    zoom: number
+    perspectiveOrientation: number[]
+    perspectiveZoom: number
+  }
+
+  viewerMode: ViewerMode
+  breadcrumbs: BreadCrumb[]
+}

src/state/atlasSelection/effects.ts

 import { Injectable } from "@angular/core";
 import { Actions, createEffect, ofType } from "@ngrx/effects";
-import { forkJoin, merge, of } from "rxjs";
-import { filter, map, mapTo, switchMap, switchMapTo, withLatestFrom } from "rxjs/operators";
-import { SAPI, SAPIRegion, SapiRegionModel } from "src/atlasComponents/sapi";
+import { concat, forkJoin, merge, of } from "rxjs";
+import { filter, map, mapTo, switchMap, switchMapTo, take, tap, withLatestFrom } from "rxjs/operators";
+import { SAPI, SapiParcellationModel, SAPIRegion, SapiRegionModel, SapiSpaceModel } from "src/atlasComponents/sapi";
 import * as mainActions from "../actions"
 import { select, Store } from "@ngrx/store";
 import { selectors, actions } from '.'
@@ -10,10 +10,103 @@ import { fromRootStore } from "./util";
 import { ParcellationIsBaseLayer } from "src/atlasComponents/sapiViews/core/parcellation/parcellationIsBaseLayer.pipe";
 import { OrderParcellationByVersionPipe } from "src/atlasComponents/sapiViews/core/parcellation/parcellationVersion.pipe";
 import { atlasAppearance, atlasSelection } from "..";
+import { ParcellationSupportedInSpacePipe } from "src/atlasComponents/sapiViews/util/parcellationSupportedInSpace.pipe";
 
 @Injectable()
 export class Effect {
 
+  parcSupportedInSpacePipe = new ParcellationSupportedInSpacePipe(this.sapiSvc)
+
+  onTemplateParcSelection = createEffect(() => merge<{ template: SapiSpaceModel, parcellation: SapiParcellationModel }>(
+    this.action.pipe(
+      ofType(actions.selectTemplate),
+      map(({ template }) => {
+        return {
+          template, 
+          parcellation: null
+        }
+      })
+    ),
+    this.action.pipe(
+      ofType(actions.selectParcellation),
+      map(({ parcellation }) => {
+        return {
+          template: null,
+          parcellation
+        }
+      })
+    )
+  ).pipe(
+    withLatestFrom(this.store),
+    switchMap(([ { template, parcellation }, store ]) => {
+      const currTmpl = selectors.selectedTemplate(store)
+      const currParc = selectors.selectedParcellation(store)
+      const currAtlas = selectors.selectedAtlas(store)
+      return this.parcSupportedInSpacePipe.transform(
+        parcellation || currParc,
+        template || currTmpl
+      ).pipe(
+        switchMap(flag => {
+          /**
+           * if desired parc is supported in tmpl, emit them
+           */
+          if (flag) {
+            return of({
+              template: template || currTmpl,
+              parcellation: parcellation || currParc,
+            })
+          }
+          /**
+           * if template is defined, find the first parcellation that is supported
+           */
+          if (!!template) {
+            return concat(
+              ...currAtlas.parcellations.map(
+                p => this.parcSupportedInSpacePipe.transform(p["@id"], template).pipe(
+                  filter(flag => flag),
+                  switchMap(() => this.sapiSvc.getParcDetail(currAtlas["@id"], p['@id'])),
+                )
+              )
+            ).pipe(
+              map(parcellation => {
+                return {
+                  template,
+                  parcellation
+                }
+              })
+            )
+          }
+          if (!!parcellation) {
+            return concat(
+              ...currAtlas.spaces.map(
+                sp => this.parcSupportedInSpacePipe.transform(parcellation["@id"], sp["@id"]).pipe(
+                  filter(flag => flag),
+                  switchMap(() => this.sapiSvc.getSpaceDetail(currAtlas["@id"], sp['@id'])),
+                )
+              )
+            ).pipe(
+              take(1),
+              map(template => {
+                return {
+                  template,
+                  parcellation
+                }
+              })
+            )
+          }
+          throw new Error(`neither template nor parcellation has been defined!`)
+        }),
+        map(({ parcellation, template }) =>
+          actions.setATP({
+            parcellation,
+            template
+          })
+        )
+      )
+    }),
+
+  ))
+
   onAtlasSelectionSelectTmplParc = createEffect(() => this.action.pipe(
     ofType(actions.selectAtlas),
     filter(action => !!action.atlas),
@@ -37,16 +130,13 @@ export class Effect {
           this.sapiSvc.getSpaceDetail(atlas["@id"], spaceId["@id"])
         )
       ).pipe(
-        switchMap(spaces => {
+        map(spaces => {
           const selectedSpace = spaces.find(s => /152/.test(s.fullName)) || spaces[0]
-          return of(
-            actions.selectTemplate({
-              template: selectedSpace
-            }),
-            actions.selectParcellation({
-              parcellation
-            })
-          )
+          return actions.setATP({
+            atlas,
+            template: selectedSpace,
+            parcellation
+          })
         })
       )
     }),