PWV-73 Determine missing timepoint studies

- Display timepoint availability based on its studies' availability
- Display study availability in study level when timepoint is loaded

Packages/ohif-studies/imports/client/components/browser/item.html

@@ -10,8 +10,12 @@
                         <div class="study-modality-text" style="{{modalityStyle studyData.modalities}}">{{studyData.modalities}}</div>
                     </div>
                     <div class="study-text">
-                        <div class="study-date">{{formatDA studyData.studyDate 'D-MMM-YYYY'}}</div>
-                        <div class="study-description">{{studyData.studyDescription}}</div>
+                        {{#if isLoaded}}
+                            <div class="study-date">{{formatDA studyData.studyDate 'D-MMM-YYYY'}}</div>
+                            <div class="study-description">{{studyData.studyDescription}}</div>
+                        {{else}}
+                            <div class="study-availability">{{#if studyData.available}}Click to load{{else}}N/A{{/if}}</div>
+                        {{/if}}
                     </div>
                 </div>
             {{/let}}

Packages/ohif-studies/imports/client/components/browser/item.js

@@ -10,7 +10,7 @@ Template.studyBrowserItem.onCreated(() => {
     const { studyInformation } = instance.data;
     const { studyInstanceUid } = studyInformation;
 
-    instance.loaded = false;
+    instance.loaded = new ReactiveVar(false);
     instance.loading = new ReactiveVar(false);
 
     instance.studyData = new ReactiveVar(studyInformation);
@@ -44,7 +44,7 @@ Template.studyBrowserItem.onCreated(() => {
                 modalities: firstInstance.getRawValue('x00080060') || '',
             });
 
-            instance.loaded = true;
+            instance.loaded.set(true);
             instance.loading.set(false);
         }
     });
@@ -55,6 +55,12 @@ Template.studyBrowserItem.events({
         if (instance.loading.get()) return;
 
         const { studyInformation } = instance.data;
+
+        //  Skip if study is not available
+        if (!studyInformation.available) {
+            return;
+        }
+
         const element = event.currentTarget.parentElement;
         const $element = $(element);
         const triggerClick = () => {
@@ -65,12 +71,12 @@ Template.studyBrowserItem.events({
             $element.trigger(newEvent, studyInformation);
         };
 
-        if (instance.loaded) {
+        if (instance.loaded.get()) {
             triggerClick();
         } else {
             instance.loading.set(true);
             OHIF.studies.loadStudy(studyInformation.studyInstanceUid).then(() => {
-                instance.loaded = true;
+                instance.loaded.set(true);
                 instance.loading.set(false);
                 $element.trigger('ohif.studies.study.load', studyInformation);
                 Tracker.afterFlush(triggerClick);
@@ -80,6 +86,10 @@ Template.studyBrowserItem.events({
 });
 
 Template.studyBrowserItem.helpers({
+    isLoaded() {
+        return Template.instance().loaded.get();
+    },
+
     isLoading() {
         return Template.instance().loading.get();
     },

Packages/ohif-studies/imports/client/components/browser/list.styl

@@ -104,6 +104,9 @@ $spacerY = 12px
     .study-description
       margin-top: 8px
       theme('color', '$textPrimaryColor')
+    .study-availability
+      margin-top: 24px
+      theme('color', '$textPrimaryColor')
 
   .study-modality
     theme('color', '$textSecondaryColor')