Added release referrer.

Author: MillenniumFalconMechanic

spa/src/app/files/_ngrx/release/clear-release-referrer.action.ts

@@ -0,0 +1,16 @@
+/**
+ * Human Cell Atlas
+ * https://www.humancellatlas.org/
+ *
+ * Action triggered when release referrer indicator should be cleared.
+ */
+
+// Core dependencies
+import { Action } from "@ngrx/store";
+
+export class ClearReleaseReferrerAction implements Action {
+    public static ACTION_TYPE = "RELEASES.CLEAR_RELEASE_REFERRER";
+    public readonly type = ClearReleaseReferrerAction.ACTION_TYPE;
+    constructor() {}
+}
+

spa/src/app/files/_ngrx/release/release.reducer.ts

@@ -9,19 +9,27 @@
 import { Action } from "@ngrx/store";
 
 // App dependencies
-import { ReleaseState } from "./release.state";
+import { ClearReleaseReferrerAction } from "./clear-release-referrer.action";
 import { FetchReleasesRequestAction } from "./fetch-releases-request.action";
 import { FetchReleasesSuccessAction } from "./fetch-releases-success.action";
+import { ReleaseState } from "./release.state";
+import { SetReleaseReferrerAction } from "./set-release-referrer.action";
 
 export function reducer(state: ReleaseState = ReleaseState.getDefaultState(), action: Action): ReleaseState {
 
     switch (action.type) {
 
+        case ClearReleaseReferrerAction.ACTION_TYPE:
+            return state.clearReleaseReferrer();
+
         case FetchReleasesRequestAction.ACTION_TYPE:
             return state.fetchReleasesByNameRequest();
 
         case FetchReleasesSuccessAction.ACTION_TYPE:
             return state.fetchReleasesSuccess(action as FetchReleasesSuccessAction);
+            
+        case SetReleaseReferrerAction.ACTION_TYPE:
+            return state.setReleaseReferrer();
 
         default:
             return state;

spa/src/app/files/_ngrx/release/release.selectors.ts

@@ -27,3 +27,9 @@ export const selectReleasesByName =
  */
 export const selectReleaseByName =
     createSelector(selectReleases, (state, props) => state.releasesByName.get(props.name));
+
+/**
+ * Return the release referrer.
+ */
+export const selectReleaseReferrer =
+    createSelector(selectReleases, (state) => state.releaseReferrer);

spa/src/app/files/_ngrx/release/release.state.ts

@@ -11,12 +11,14 @@ import { FetchReleasesSuccessAction } from "./fetch-releases-success.action";
 import { Releases } from "./releases.model";
 
 const DEFAULT_RELEASE_STATE = {
-    releasesByName: new Map()
+    releasesByName: new Map(),
+    releaseReferrer: false
 };
 
 export class ReleaseState implements Releases {
 
     releasesByName: Map<string, Release>;
+    releaseReferrer: boolean;
 
     /**
      * @param {Releases} state
@@ -25,6 +27,18 @@ export class ReleaseState implements Releases {
         Object.assign(this, state);
     }
 
+
+    /**
+     * Set release referrer to false.
+     */
+    public clearReleaseReferrer(): ReleaseState {
+
+        return new ReleaseState({
+            releasesByName: this.releasesByName,
+            releaseReferrer: false
+        });
+    }
+
     /**
      * @returns {ReleaseState}
      */
@@ -42,8 +56,22 @@ export class ReleaseState implements Releases {
             accum.set(release.name, release);
             return accum;
         }, new Map());
-        
-        return new ReleaseState({releasesByName});
+
+        return new ReleaseState({
+            releasesByName,
+            releaseReferrer: this.releaseReferrer
+        });
+    }
+
+    /**
+     * Set release referrer to true.
+     */
+    public setReleaseReferrer(): ReleaseState {
+
+        return new ReleaseState({
+            releasesByName: this.releasesByName,
+            releaseReferrer: true
+        });
     }
 
     /**

spa/src/app/files/_ngrx/release/releases.model.ts

@@ -10,4 +10,5 @@ import { Release } from "../../releases/2020-march/release.model";
 
 export interface Releases {
     releasesByName: Map<string, Release>;
+    releaseReferrer: boolean;
 }

spa/src/app/files/_ngrx/release/set-release-referrer.action.ts

@@ -0,0 +1,20 @@
+/**
+ * Human Cell Atlas
+ * https://www.humancellatlas.org/
+ *
+ * Action triggered when project-specific pages should return to the release page, and not the natural app page.
+ * Specifically:
+ *
+ * 1. Project detail back button returns to release page and not to projects tab
+ * 2. Release files modal close button returns to release page and not to project detail release tab
+ */
+
+// Core dependencies
+import { Action } from "@ngrx/store";
+
+export class SetReleaseReferrerAction implements Action {
+    public static ACTION_TYPE = "RELEASES.SET_RELEASE_REFERRER";
+    public readonly type = SetReleaseReferrerAction.ACTION_TYPE;
+    constructor() {}
+}
+

spa/src/app/files/project-detail/project-detail.component.ts

@@ -12,18 +12,20 @@ import { ActivatedRoute, Router } from "@angular/router";
 import { select, Store } from "@ngrx/store";
 import { AppState } from "../../_ngrx/app.state";
 import { combineLatest, Observable } from "rxjs/index";
-import { filter, map } from "rxjs/operators";
+import { filter, map, take } from "rxjs/operators";
 
 // App dependencies
-import { SearchTerm } from "../search/search-term.model";
-import { EntityName } from "../shared/entity-name.model";
-import EntitySpec from "../shared/entity-spec";
 import { selectSelectedProject } from "../_ngrx/file.selectors";
+import { ClearReleaseReferrerAction } from "../_ngrx/release/clear-release-referrer.action";
+import { selectReleaseReferrer } from "../_ngrx/release/release.selectors";
 import { selectSelectedProjectSearchTerms } from "../_ngrx/search/search.selectors";
 import { SelectProjectIdAction } from "../_ngrx/search/select-project-id.action";
 import { ClearSelectedProjectAction } from "../_ngrx/table/clear-selected-project.action";
 import { FetchProjectRequestAction } from "../_ngrx/table/table.actions";
 import { ProjectDetailState } from "./project-detail.state";
+import { SearchTerm } from "../search/search-term.model";
+import { EntityName } from "../shared/entity-name.model";
+import EntitySpec from "../shared/entity-spec";
 
 @Component({
     selector: "project-detail",
@@ -33,7 +35,8 @@ import { ProjectDetailState } from "./project-detail.state";
 export class ProjectDetailComponent {
 
     // Template variables
-    public state$: Observable<ProjectDetailState>;
+    private backUrl: string;
+    private state$: Observable<ProjectDetailState>;
 
     /**
      *
@@ -52,10 +55,10 @@ export class ProjectDetailComponent {
      */
     public getLegendClass(selected: boolean): { [className: string]: boolean } {
 
-            return {
-                "box": true,
-                "selected": selected
-            };
+        return {
+            "box": true,
+            "selected": selected
+        };
     }
 
     /**
@@ -65,7 +68,7 @@ export class ProjectDetailComponent {
      */
     public getProjectDetailTabs(): EntitySpec[] {
 
-        return [{key: EntityName.PROJECTS, displayName: "Back"}];
+        return [{key: this.backUrl, displayName: "Back"}];
     }
 
     /**
@@ -107,18 +110,38 @@ export class ProjectDetailComponent {
     }
 
     /**
-     * Clear out the selected project when the user navigates away from project detail page.
+     * Determine the back URL; either the release page if the user has come from there, otherwise the projects tab.
+     */
+    private setBackUrl() {
+
+        this.store
+            .pipe(
+                select(selectReleaseReferrer),
+                take(1)
+            )
+            .subscribe((releaseReferrer) => {
+                this.backUrl = releaseReferrer ? "releases/2020-mar" : EntityName.PROJECTS
+            });
+    }
+
+    /**
+     * Clear out the selected project when the user navigates away from project detail page. Also clear the flag
+     * indicating this project detail component should return the release page (if necessary).
      */
     public ngOnDestroy() {
 
         this.store.dispatch(new ClearSelectedProjectAction());
+        this.store.dispatch(new ClearReleaseReferrerAction());
     }
 
     /**
      * Update state with selected project.
      */
     public ngOnInit() {
 
+        // Determine where the back button should navigate to
+        this.setBackUrl();
+
         // Add selected project to state - grab the project ID from the URL.
         const projectId = this.activatedRoute.snapshot.paramMap.get("id");
         this.store.dispatch(new FetchProjectRequestAction(projectId));

spa/src/app/files/releases/release-banner/release-banner.component.html

@@ -1,6 +1,6 @@
 <announcement class="release-banner">
     <span class="fontsize-s">
         <span>March 2020 Release lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur enim tellus, molestie in molestie ac. </span>
-        <a href="/releases/2020-mar">View the March 2020 Release ></a>
+        <a routerLink="/releases/2020-mar">View the March 2020 Release ></a>
     </span>
 </announcement>

spa/src/app/files/releases/release-table/release-table.component.html

@@ -7,7 +7,7 @@ <h2 class="fontsize-xl">{{organView.organ}}</h2>
                     <span>Project Title</span>
                 </mat-header-cell>
                 <mat-cell *matCellDef="let element" class="project-title fontsize-s">
-                    <a href="projects/{{element.entryId}}/releases/2020-mar">{{element.datasetId}}</a>
+                    <a routerLink="/projects/{{element.entryId}}/releases/2020-mar" (click)="setReleaseReferrer()">{{element.datasetId}}</a>
                 </mat-cell>
             </ng-container>
             <ng-container matColumnDef="developmentalStage">

spa/src/app/files/releases/release-table/release-table.component.ts

@@ -9,6 +9,9 @@
 import { Component, Input } from "@angular/core";
 
 // App dependencies
+import { Store } from "@ngrx/store";
+import { AppState } from "../../../_ngrx/app.state";
+import { SetReleaseReferrerAction } from "../../_ngrx/release/set-release-referrer.action";
 import { ReleaseOrganView } from "../release-organ-view.model";
 
 @Component({
@@ -22,7 +25,12 @@ export class ReleaseTableComponent {
     @Input() releaseOrganViews: ReleaseOrganView[];
 
     // Locals
-    public columnsToDisplay = ["projectTitle", "developmentalStage", "technology", "releaseFiles", "annotatedExpressionMatrix", "visualize"];
+    private columnsToDisplay = ["projectTitle", "developmentalStage", "technology", "releaseFiles", "annotatedExpressionMatrix", "visualize"];
+
+    /**
+     * @param {Store<AppState>} store
+     */
+    constructor(private store: Store<AppState>) {}
 
     /**
      * Returns the technology, based off libraryConstructionApproach. Any libraryConstructionApproach ending with
@@ -47,4 +55,16 @@ export class ReleaseTableComponent {
 
         return techShortName;
     }
+
+    /**
+     * Update state to indicate that any project-specific release components need to return to this release page (for
+     * example:
+     * 
+     * 1. project detail back button returns here (and not to projects tab)
+     * 2. release files modal close button returns here (and not to project detail release tab)
+     */
+    public setReleaseReferrer() {
+
+        this.store.dispatch(new SetReleaseReferrerAction());
+    }
 }