Merge remote-tracking branch 'remotes/origin/master' into add_concept…

…_sets_search # Conflicts: # js/pages/configuration/configuration.js
OHDSI · Oct 11, 2023 · 0045ca0 · 0045ca0
2 parents 771e8c2 + cb1a150
commit 0045ca0
Show file tree

Hide file tree

Showing 195 changed files with 4,158 additions and 963 deletions.
diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
@@ -30,10 +30,10 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-node-
 
-      - name: Use Node.js 12
-        uses: actions/setup-node@v1
+      - name: Use Node.js 18
+        uses: actions/setup-node@v3
         with:
-          node-version: 12
+          node-version: 18
 
       - name: Build code
         run: npm run build

diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
+*~
 .idea
 /web.config
 /node_modules/

diff --git a/Dockerfile b/Dockerfile
@@ -1,11 +1,11 @@
 # Build the source
-FROM node:14-alpine as builder
+FROM docker.io/library/node:18.14.1-alpine@sha256:045b1a1c90bdfd8fcaad0769922aa16c401e31867d8bf5833365b0874884bbae as builder
 
 WORKDIR /code
 
 # First install dependencies. This part will be cached as long as
-# the package(-lock).json files remain identical.
-COPY package*.json /code/
+# the package.json file remains identical.
+COPY package.json /code/
 RUN npm install
 
 # Build code
@@ -26,7 +26,7 @@ RUN find . -type f "(" \
       | xargs -0 -n 1 gzip -kf
 
 # Production Nginx image
-FROM nginxinc/nginx-unprivileged:1.23.0-alpine
+FROM docker.io/nginxinc/nginx-unprivileged:1.23.3-alpine@sha256:c748ba587e7436aaa8729b64d4e0412410a486f0c592f0eec100fb3804ff9afd
 
 LABEL org.opencontainers.image.title="OHDSI-Atlas"
 LABEL org.opencontainers.image.authors="Joris Borgdorff <[email protected]>, Lee Evans - www.ltscomputingllc.com"

diff --git a/index.html b/index.html
@@ -17,7 +17,7 @@
 	</head>
 
 	<body class="app">
-	<div id="b-alarm" style="display: none" class="browser-alarm">
+	<div id="b-alarm" style="display: none" class="browser-alarm" data-bind="visible: toggleBrowserWarning(bowser)">
 		<div class="browser-alarm__warning-text" data-bind="text: ko.i18n('commonErrors.browserWarning', 'Note that only Chrome browser newer than v.63 is officially supported')">
 			Note that only Chrome browser newer than v.63 is officially supported
 		</div>
@@ -49,14 +49,19 @@
 				<!-- /ko -->
 			</div>
 
-			<div id="wrapper_ohdsi">
+			<!-- ko if: !companyInfoTemplate && showCompanyInfo-->
+			<div class="wrapper_ohdsi">
 				<div><a href="https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0</a></div>
 				<div style="margin-bottom:10px;">open source software</div>
 
 				<div>provided by</div>
 				<div><a href="http://www.ohdsi.org"><img src="images/ohdsi_color.png"></a></div>
 				<div><a href="http://www.ohdsi.org">join the journey</a></div>
 			</div>
+			<!-- /ko -->
+			<!-- ko if: companyInfoTemplate && showCompanyInfo-->
+			<div class="wrapper_ohdsi" data-bind="html: companyInfoTemplate"></div>
+			<!-- /ko -->
 		</div>
 
 		<div id="wrapperMainWindow" style="display:none;" data-bind="visible:initializationComplete(), css: classes({ element: 'main-window'})">
@@ -115,7 +120,6 @@
 
 	<!-- bundled mode -->
 	<!-- <script data-main="js/assets/bundle/bundle" src="js/require.js"></script>-->
-	<script src="js/utils/BrowserDetection.js"></script>
 
 </body>
 

diff --git a/js/Application.js b/js/Application.js
@@ -16,7 +16,6 @@ define(
 		'utils/CommonUtils',
 		'utils/BemHelper',
 		'const',
-		'databindings',
 		'less!app.less',
 	],
 	(
@@ -61,6 +60,11 @@ define(
 					return sharedState.appInitializationStatus() != constants.applicationStatuses.initializing;
 				});
 
+				this.toggleBrowserWarning = function(bowser) {
+					const browserInfo = bowser.getParser(navigator.userAgent).getBrowser();
+					const isBrowserSupported = browserInfo.name.toLowerCase() === 'chrome' && parseInt(browserInfo.version) > 63;
+					return !config.disableBrowserCheck && !isBrowserSupported;
+				}
 
 				this.appInitializationStatus = sharedState.appInitializationStatus;
 				this.noSourcesAvailable = ko.pureComputed(() => {
@@ -89,7 +93,9 @@ define(
 					}
 
 					return pageTitle;
-				})
+				});
+				this.companyInfoTemplate = config.companyInfoCustomHtmlTemplate;
+				this.showCompanyInfo = config.showCompanyInfo;
 			}
 
 			/**
@@ -116,7 +122,11 @@ define(
 
 					if (config.userAuthenticationEnabled) {
 						try {
-							await authApi.loadUserInfo();
+							// Routes to welcome are part of auth flow, loadUserInfo in this case is unnecessary and fails. 
+							// More importantly it can trigger an infinite loop when skipLoginEnabled is enabled.
+							if (!window.location.href.includes("/welcome/")) {
+								await authApi.loadUserInfo();
+							}
 						} catch (e) {
 							reject(e.message);
 						}
@@ -207,4 +217,4 @@ define(
 			}
 		}
 	}
-)
+)
diff --git a/js/components/Chart.js b/js/components/Chart.js
@@ -31,7 +31,7 @@ define([
       this.container = container;
       this.chartName = params.chartName ? params.chartName : '';
       this.reportName = ko.unwrap(params.reportName);
-      this.filename = ko.computed (() => {
+      this.fileName = ko.computed (() => {
          const fileName = this.reportName ? `${ko.unwrap(params.reportName)}_${this.chartName}`.replace(/ /g, '') : 'untitled';
          return fileName.length > 90 ? fileName.slice(0,90) : fileName;
       });
@@ -49,11 +49,11 @@ define([
 
 		export() {
 			const svg = this.container.element.querySelector('svg');
-			ChartUtils.downloadSvgAsPng(svg, this.filename() || "untitled.png");
+			ChartUtils.downloadSvgAsPng(svg, this.fileName() || "untitled.png");
 		}
 		exportSvg() {
             const svg = this.container.element.querySelector('svg');
-            ChartUtils.downloadSvg(svg, this.filename() + ".svg" || "untitled.svg");
+            ChartUtils.downloadSvg(svg, this.fileName() + ".svg" || "untitled.svg");
         }
 		dispose() {
 			this.renderer && this.renderer.dispose();

diff --git a/js/components/analysisExecution/analysis-execution-list.html b/js/components/analysisExecution/analysis-execution-list.html
@@ -2,18 +2,20 @@
   <loading data-bind="css: classes('loading-panel'), visible: loading" params="status: ko.i18n('common.loadingWithDots', 'Loading...')"></loading>
   <div data-bind="visible: !loading()">
     <h2 data-bind="css: classes('title'), text: ko.i18n('components.analysisExecution.title', 'Executions')"></h2>
+    <label data-bind="css: classes('only-results-checkbox')"><input type="checkbox" data-bind="checked: showOnlySourcesWithResults"> Show only sources with results</label>
     <div data-bind="css: classes('content')">
-      <!-- ko foreach: executionGroups -->
-        <div data-bind="template: {
-          name: 'execution-group',
-          data: Object.assign({}, $data, {
-            classes: $parent.classes,
-            execColumns: $parent.execColumns,
-            isExpanded: $parent.expandedSection() === $index(),
-            toggleSection: () => $parent.toggleSection($index()),
-          })
-        }"></div>
-      <!-- /ko -->
+      <table data-bind="
+          css: classes('execution-groups-table'),
+          dataTable: {
+            data: filteredExecutionGroups,
+            options: {
+              columns: sourcesColumn,
+              order: [[ 0, 'asc' ]],
+              pageLength: tableOptions.pageLength,
+              language: ko.i18n('datatable.language')
+            }
+          }
+        "></table>
     </div>
   </div>
 </div>

diff --git a/js/components/analysisExecution/analysis-execution-list.js b/js/components/analysisExecution/analysis-execution-list.js
@@ -60,7 +60,6 @@ define([
       this.pollId = null;
       this.PollService = PollService;
       this.selectedSourceId = selectedSourceId;
-      this.selectedSourceId.subscribe(() => this.expandSelectedSource());
       this.tableOptions = tableOptions || CommonUtils.getTableOptions('S');
       this.loading = ko.observable(false);
       this.downloading = ko.observableArray();
@@ -75,17 +74,37 @@ define([
         this.executionStatuses.RUNNING,
         this.executionStatuses.STARTED,
       ];
-      this.expandedSection = ko.observable();
 
       this.isExitMessageShown = ko.observable(false);
       this.exitMessage = ko.observable();
 
       this.executionResultMode = executionResultMode;
       this.executionGroups = ko.observableArray([]);
+      this.showOnlySourcesWithResults = ko.observable(false);
+      this.filteredExecutionGroups = ko.pureComputed(() => {
+        return this.showOnlySourcesWithResults()
+            ? this.executionGroups().filter(eg => eg.submissions().length > 0)
+            : this.executionGroups();
+      });
       this.executionResultModes = consts.executionResultModes;
       this.isExecutionDesignShown = ko.observable(false);
       this.executionDesign = ko.observable(null);
 
+      this.sourcesColumn = [{
+          render: (s, p, d) => {
+            return `<span>${d.sourceName}</span><span data-bind="template: {
+                        name: 'execution-group',
+                        data: {
+                            ...$data,
+                            classes: $parent.classes,
+                            execColumns: $parent.execColumns,
+                            isExpanded: $parent.selectedSourceId() == $data.sourceId,
+                            toggleSection: () => $parent.toggleSection($data.sourceId)
+                        }    
+                    }"></span>`;
+          }
+      }];
+
       this.stopping = ko.observable({});
       this.isSourceStopping = (source) => this.stopping()[source.sourceKey];
 
@@ -133,7 +152,7 @@ define([
     startPolling() {
       this.pollId = this.PollService.add({
         callback: silently => this.loadData({ silently }),
-        interval: 10000,
+        interval: config.pollInterval,
         isSilentAfterFirstCall: true,
       });
     }
@@ -172,24 +191,15 @@ define([
 
           group.submissions(executionList.filter(({ sourceKey: exSourceKey }) => exSourceKey === sourceKey));
           this.setExecutionGroupStatus(group);
-        })
-        this.expandSelectedSource();
+        });
+        this.executionGroups.valueHasMutated();
       } catch (err) {
         console.error(err);
       } finally {
         this.loading(false);
       }
     }
 
-    expandSelectedSource() {
-      let idx = null;
-      if (this.selectedSourceId()) {
-        const sourceId = parseInt(this.selectedSourceId());
-        idx = this.executionGroups().findIndex(g => g.sourceId === sourceId);
-      }
-      this.expandedSection(idx);
-    }
-
     async showExecutionDesign(executionId) {
       try {
         this.executionDesign(null);
@@ -217,16 +227,13 @@ define([
       }
     }
 
-    toggleSection(idx) {
-      if (this.expandedSection() === idx) {
-        this.expandedSection(null);
+    toggleSection(sourceId) {
+      if (parseInt(this.selectedSourceId()) === sourceId) {
         this.selectedSourceId(null);
         CommonUtils.routeTo(`${this.resultsPathPrefix}${this.analysisId()}/executions`);
       } else {
-        this.expandedSection(idx);
-        const executionGroup = this.executionGroups()[idx];
-        this.selectedSourceId(executionGroup.sourceId);
-        CommonUtils.routeTo(`${this.resultsPathPrefix}${this.analysisId()}/executions/${executionGroup.sourceId}`);
+        this.selectedSourceId(sourceId);
+        CommonUtils.routeTo(`${this.resultsPathPrefix}${this.analysisId()}/executions/${sourceId}`);
       }
     }
 

diff --git a/js/components/analysisExecution/analysis-execution-list.less b/js/components/analysisExecution/analysis-execution-list.less
@@ -6,11 +6,31 @@
   }
 
   &__content {
-    margin-top: 1.5rem;
+    margin-top: 1rem;
+  }
+
+  &__only-results-checkbox {
+    margin-top: 5px;
+  }
+
+  &__execution-groups-table {
+    &.dataTable.no-footer {
+      border: none !important;
+      thead {
+        display: none;
+      }
+      td {
+        padding: 0;
+
+        & > span:first-child {
+          display: none;
+        }
+      }
+    }
   }
 
   &__group {
-    margin-top: 1rem;
+    margin: .4rem 0;
 
     &--expanded {
       .analysis-execution-list {

diff --git a/js/components/charts/chartVenn.html b/js/components/charts/chartVenn.html
@@ -0,0 +1,7 @@
+<div class="venn-chart">
+    <div class="container">
+        <button title="PNG" class="export-button" data-bind="click: $component.export">PNG</button>
+        <button title="SVG" class="exportSvg-button" data-bind="click: $component.exportSvg">SVG</button>
+        <div id="venn"></div>
+    </div>
+</div>
diff --git a/js/components/charts/horizontalBoxplot.js b/js/components/charts/horizontalBoxplot.js
@@ -0,0 +1,24 @@
+define([
+    'knockout',
+    'components/Chart',
+    'components/Component',
+    'atlascharts',
+    'text!components/charts/chart.html',
+    'utils/CommonUtils'
+], function (
+    ko,
+    Chart,
+    Component,
+    atlascharts,
+    view,
+    commonUtils
+) {
+    class HorizontalBoxPlot extends Chart {
+        constructor(params, element) {
+            super(params, element);
+            this.renderer = new atlascharts.horizontalBoxplot();
+        }
+    }
+
+    return commonUtils.build('horizontal-boxplot', HorizontalBoxPlot, view);
+});