Show connectivity info

src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.spec.ts

@@ -108,7 +108,6 @@ describe('ConnectivityComponent', () => {
         beforeEach(async () => {
             fixture = TestBed.createComponent(ConnectivityBrowserComponent)
             component = fixture.componentInstance
-            component.types = types
 
             const atlas = 'atlases/juelich/iav/atlas/v1.0.0/1'
             const parcellation = 'minds/core/parcellationatlas/v1.0.0/94c1125b-b87e-45e4-901c-00daee7f2579-290'
@@ -116,8 +115,7 @@ describe('ConnectivityComponent', () => {
 
             component.atlas = { '@id': atlas } as SapiAtlasModel
             component.parcellation = { '@id': parcellation } as SapiParcellationModel
-
-            component.selectType('StreamlineCounts')
+            component.types = types
 
             const url = `${endp}/atlases/${encodeURIComponent(atlas)}/parcellations/${encodeURIComponent(parcellation)}/features?type=${component.selectedTypeId}&size=${100}&page=${1}`
 

src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.component.ts

@@ -18,6 +18,7 @@ import { HttpClient } from "@angular/common/http";
 @Component({
   selector: 'sxplr-sapiviews-features-connectivity-browser',
   templateUrl: './connectivityBrowser.template.html',
+  styleUrls: ['./connectivityBrowser.style.scss']
 })
 export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
 
@@ -64,7 +65,6 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
     public selectedSubjectIndex: number
     public selectedSubjectsDatasets: string[]
     public selectedSubjectDatasetIndex: number
-    public infoExpanded: boolean
     public fetchedItems: SapiParcellationFeatureModel[] = []
     public cohorts: string[]
     public selectedView: 'subject' | 'average' | null
@@ -275,20 +275,23 @@ export class ConnectivityBrowserComponent implements AfterViewInit, OnDestroy {
     }) : ds
 
     fetchConnectivity(datasetId=null) {
-      this.sapi.getParcellation(this.atlas["@id"], this.parcellation["@id"]).getFeatureInstance(datasetId || this.selectedDataset['@id'])
-        .pipe(catchError(() => {
-          this.fetching = false
-          return of(null)
-        }))
-        .subscribe(ds=> {
-          this.selectedDataset = this.fixDatasetFormat(ds)
-          this.setMatrixData(ds)
-          this.fetching = false
-        })
+      const parcellation = this.sapi.getParcellation(this.atlas["@id"], this.parcellation["@id"])
+      if (parcellation) {
+        parcellation.getFeatureInstance(datasetId || this.selectedDataset['@id'])
+          .pipe(catchError(() => {
+            this.fetching = false
+            return of(null)
+          }))
+          .subscribe(ds => {
+            this.selectedDataset = this.fixDatasetFormat(ds)
+            this.setMatrixData(ds)
+            this.fetching = false
+          })
+      }
     }
 
     // ToDo need to be fixed on configuration side
-    fixHemisphereNaming(area) {
+    fixHemisphereNaming(area: string) {
       if (area.includes(' - left hemisphere')) {
         return area.replace('- left hemisphere', 'left')
       } else if (area.includes(' - right hemisphere')) {

src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.style.scss

+::ng-deep label {
+    margin-bottom: 0 !important;
+}
\ No newline at end of file

src/atlasComponents/sapiViews/features/connectivity/connectivityBrowser/connectivityBrowser.template.html

@@ -93,21 +93,17 @@
                       [disabled]="logDisabled || noConnectivityForRegion">Log 10</mat-checkbox>
         <button mat-button [matMenuTriggerFor]="exportMenu"
                 [disabled]="!connectedAreas.value">
-            <i class="fas fa-download mb-2 mr-2"></i>
-            <label>Export</label>
+            <i class="fas fa-download mr-2"></i>
+            <span>Export</span>
         </button>
-        <button mat-button (click)="infoExpanded = !infoExpanded">
-            <i class="fas fa-info mb-2 mr-2"></i>
-            <i class="fas mb-2 ml-2" [ngClass]="infoExpanded? 'fa-chevron-up' : 'fa-chevron-down'"></i>
+        <button *ngIf="selectedDataset" iav-stop="mousedown click" class="icons" mat-icon-button sxplr-dialog [sxplr-dialog-size]="null"
+            [sxplr-dialog-data]="{
+                  title: selectedDataset?.name,
+                  descMd: selectedDataset?.description + '' + selectedDataset?.authors.join(),
+                  actions: selectedDataset | connectivityDoiPipe
+                }">
+            <i class="fas fa-info"></i>
         </button>
-        <a *ngIf="selectedDataset" [href]="'https://search.kg.ebrains.eu/instances/' + selectedDataset['dataset_id']" target="_blank">
-            <button mat-icon-button><i class="fas fa-external-link-alt mb-2"></i></button>
-        </a>    
-    </div>
-
-    <div *ngIf="infoExpanded">
-        <p>{{selectedDataset.description}}</p>
-        <p>{{selectedDataset.authors.join()}}</p>
     </div>
 
     <hbp-connectivity-matrix-row

src/atlasComponents/sapiViews/features/connectivity/connectivityDoi.pipe.ts

+import { Pipe, PipeTransform } from "@angular/core"
+import { SapiParcellationFeatureModel } from "src/atlasComponents/sapi/type"
+
+@Pipe({
+    name: 'connectivityDoiPipe',
+    pure: true
+  })
+  
+  export class ConnectivityDoiPipe implements PipeTransform {
+    public transform(dataset: SapiParcellationFeatureModel): string[] {
+      const url = `https://search.kg.ebrains.eu/instances/${dataset['dataset_id']}`
+      return [url]
+    }
+  }
+  
\ No newline at end of file

src/atlasComponents/sapiViews/features/connectivity/module.ts

@@ -5,16 +5,20 @@ import {ConnectivityBrowserComponent} from "src/atlasComponents/sapiViews/featur
 import {HasConnectivity} from "src/atlasComponents/sapiViews/features/connectivity/hasConnectivity.directive";
 import {AngularMaterialModule} from "src/sharedModules";
 import {FormsModule} from "@angular/forms";
+import { DialogModule } from "src/ui/dialogInfo";
+import { ConnectivityDoiPipe } from "./connectivityDoi.pipe";
 
 @NgModule({
   imports: [
     CommonModule,
     FormsModule,
-    AngularMaterialModule
+    AngularMaterialModule,
+    DialogModule
   ],
   declarations: [
     ConnectivityBrowserComponent,
-    HasConnectivity
+    HasConnectivity,
+    ConnectivityDoiPipe
   ],
   exports: [
     ConnectivityBrowserComponent,