Restore loading animation for study summary fetch on results page

cBioPortal · Dec 31, 2019 · 2597234 · 2597234
1 parent b2f9dab
commit 2597234
Showing 1 changed file with 44 additions and 41 deletions.
diff --git a/src/pages/resultsView/ResultsViewPage.tsx b/src/pages/resultsView/ResultsViewPage.tsx
@@ -525,50 +525,53 @@ export default class ResultsViewPage extends React.Component<
                             />
                         </div>
                     )}
-                    {this.resultsViewPageStore.studies.isComplete && (
-                        <Helmet>
-                            <title>
-                                {buildResultsViewPageTitle(
-                                    this.resultsViewPageStore.hugoGeneSymbols,
-                                    this.resultsViewPageStore.studies.result
-                                )}
-                            </title>
-                        </Helmet>
+                    {this.resultsViewPageStore.studies.isPending && (
+                        <LoadingIndicator isLoading={true} center={true} size={"big"}></LoadingIndicator>
                     )}
                     {this.resultsViewPageStore.studies.isComplete && (
-                        <div>
-                            <div className={'headBlock'}>
-                                <QuerySummary
-                                    routingStore={this.props.routing}
-                                    store={this.resultsViewPageStore}
-                                    onToggleQueryFormVisiblity={visible => {
-                                        this.showTabs = visible;
-                                    }}
-                                />
+                        <>
+                            <Helmet>
+                                <title>
+                                    {buildResultsViewPageTitle(
+                                        this.resultsViewPageStore.hugoGeneSymbols,
+                                        this.resultsViewPageStore.studies.result
+                                    )}
+                                </title>
+                            </Helmet>
+                            <div>
+                                <div className={'headBlock'}>
+                                    <QuerySummary
+                                        routingStore={this.props.routing}
+                                        store={this.resultsViewPageStore}
+                                        onToggleQueryFormVisiblity={visible => {
+                                            this.showTabs = visible;
+                                        }}
+                                    />
+                                </div>
+
+                                {// we don't show the result tabs if we don't have valid query
+                                this.showTabs &&
+                                    !this.resultsViewPageStore.genesInvalid &&
+                                    !this.resultsViewPageStore.isQueryInvalid && (
+                                        <MSKTabs
+                                            key={
+                                                this.urlWrapper.hash
+                                            }
+                                            activeTabId={
+                                                this.resultsViewPageStore.tabId
+                                            }
+                                            unmountOnHide={false}
+                                            onTabClick={(id: string) =>
+                                                this.handleTabChange(id)
+                                            }
+                                            className="mainTabs"
+                                            getTabHref={this.getTabHref}
+                                        >
+                                            {this.tabs}
+                                        </MSKTabs>
+                                    )}
                             </div>
-
-                            {// we don't show the result tabs if we don't have valid query
-                            this.showTabs &&
-                                !this.resultsViewPageStore.genesInvalid &&
-                                !this.resultsViewPageStore.isQueryInvalid && (
-                                    <MSKTabs
-                                        key={
-                                            this.urlWrapper.hash
-                                        }
-                                        activeTabId={
-                                            this.resultsViewPageStore.tabId
-                                        }
-                                        unmountOnHide={false}
-                                        onTabClick={(id: string) =>
-                                            this.handleTabChange(id)
-                                        }
-                                        className="mainTabs"
-                                        getTabHref={this.getTabHref}
-                                    >
-                                        {this.tabs}
-                                    </MSKTabs>
-                                )}
-                        </div>
+                        </>
                     )}
                 </>
             );