Merge pull request #209 from bcgsc/release/v6.10.2

Release/v6.10.2

Author: kttkjl

app/components/Image/index.tsx

@@ -24,8 +24,8 @@ const Image = ({
     format,
     key,
   } = {} as ImageType,
-  height = undefined,
-  width = undefined,
+  height: heightProp = undefined,
+  width: widthProp = undefined,
   showTitle = false,
   showCaption = false,
   isZoomable = true,
@@ -39,6 +39,15 @@ const Image = ({
     }
   }, [isZoomable]);
 
+  let height = heightProp;
+  let width = widthProp;
+  if (heightProp && Number.isInteger(heightProp)) {
+    height = `${heightProp}px`;
+  }
+  if (widthProp && Number.isInteger(widthProp)) {
+    width = `${widthProp}px`;
+  }
+
   if (data) {
     return (
       <>
@@ -58,8 +67,8 @@ const Image = ({
               src={`data:image/${format};base64,${data}`}
               alt={title}
               key={key}
-              height={Number.isInteger(height) ? `${height}px` : height}
-              width={Number.isInteger(width) ? `${height}px` : width}
+              height={height}
+              width={width}
               style={imgStyle}
             />
           </Button>

app/components/PrintTable/index.scss

@@ -19,6 +19,7 @@
   &__row {
     font-size: 10pt;
     border-bottom: 1px solid $palette__text--hint;
+    page-break-inside: avoid;
 
     & td {
       padding: 10px 4px;

app/views/ReportView/components/ExpressionCorrelation/index.tsx

@@ -35,6 +35,8 @@ const EXPRESSION_KEYS = [
   { key: 'expression.spearman.gtex', title: 'GTEX' },
 ];
 
+const DEFAULT_IMG_WIDTH = 800;
+
 type ExpressionCorrelationProps = WithLoadingInjectedProps;
 
 const ExpressionCorrelation = ({
@@ -89,6 +91,7 @@ const ExpressionCorrelation = ({
           <PlotByKey
             accessor={group.key}
             plots={plots}
+            width={DEFAULT_IMG_WIDTH}
           />
         </div>
       ))}
@@ -118,8 +121,7 @@ const ExpressionCorrelation = ({
             <div className="expression-correlation__expression-charts">
               {sampleExpressionCharts(plots.find((plot) => plot.key === 'expression.chart')
                 ? LEGACY_EXPRESSION_KEYS
-                : EXPRESSION_KEYS)
-              }
+                : EXPRESSION_KEYS)}
             </div>
           </div>
           {/* This section should only appear if there's data */}
@@ -134,6 +136,7 @@ const ExpressionCorrelation = ({
                   <PlotByKey
                     plots={plots}
                     accessor="scpPlot"
+                    width={DEFAULT_IMG_WIDTH}
                   />
                 </div>
               </div>
@@ -154,6 +157,7 @@ const ExpressionCorrelation = ({
                       image={plot}
                       showTitle
                       showCaption
+                      width={DEFAULT_IMG_WIDTH}
                     />
                   ))}
                 </div>

package-lock.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "ipr-client",
-  "version": "6.10.1",
+  "version": "6.10.2",
   "keywords": [],
   "license": "GPL-3.0",
   "sideEffects": false,