Release 1.45.0 to master

.gitignore

@@ -15,3 +15,5 @@ package-lock.json
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+
+.codegpt

.travis.yml

@@ -1,12 +1,9 @@
-sudo: false
-
-language: node_js
-
+os: linux
 dist: jammy
+language: node_js
 
 node_js:
   - "20.8.0"
-  - "stable"
 
 cache:
   yarn: true
@@ -31,7 +28,3 @@ services:
 script:
   - npm test
   - ./artifact.sh
-
-matrix:
-  allow_failures:
-    - node_js: "stable"

data/print/fixtures.js

@@ -52,7 +52,6 @@ export const basicsData = {
   timePrefs,
   bgPrefs,
   metaData,
-  query: { excludeDaysWithoutBolus: true },
   data: {
     current: {
       endpoints: {

data/types.js

@@ -340,6 +340,8 @@ export class Upload extends Common {
     this.deviceManufacturers = opts.deviceManufacturers;
     this.deviceSerialNumber = opts.deviceSerialNumber;
     this.dataSetType = opts.dataSetType;
+    this.origin = opts.origin;
+    this.client = opts.client;
 
     this.time = this.makeTime();
     this.timezone = opts.timezone;

package.json

@@ -4,7 +4,7 @@
     "node": "20.8.0"
   },
   "packageManager": "[email protected]",
-  "version": "1.44.0",
+  "version": "1.45.0-rc.6",
   "description": "Tidepool data visualization for diabetes device data.",
   "keywords": [
     "data visualization"
@@ -88,8 +88,8 @@
     "text-table": "0.2.0",
     "translate-svg-path": "0.0.1",
     "util": "0.12.5",
-    "victory": "31.3.0",
-    "victory-core": "31.2.0",
+    "victory": "37.3.5",
+    "victory-core": "37.3.5",
     "voilab-pdf-table": "0.5.1"
   },
   "devDependencies": {
@@ -166,7 +166,7 @@
     "babel-core": "6.x || ^7.0.0-bridge.0",
     "classnames": "2.x",
     "react": "16.x",
-    "react-addons-update": "16.x",
+    "react-addons-update": "15.6.x",
     "react-dom": "16.x",
     "react-redux": "8.x",
     "redux": "4.x"

src/components/common/stat/BgBar.js

@@ -32,7 +32,7 @@ export const BgBar = props => {
   const widths = {
     low: scale.y(bgBounds.targetLowerBound) * widthCorrection,
     target: scale.y(bgBounds.targetUpperBound - bgBounds.targetLowerBound) * widthCorrection,
-    high: scale.y(domain.x[1] - bgBounds.targetUpperBound) * widthCorrection,
+    high: scale.y(domain.y[1] - bgBounds.targetUpperBound) * widthCorrection,
   };
 
   const barRadius = barWidth / 2;

src/components/common/stat/BgBarLabel.js

@@ -26,7 +26,8 @@ export const BgBarLabel = props => {
         textAnchor="end"
         verticalAnchor="middle"
         dy={-(barWidth / 2 - 1)}
-        x={scale.y(domain.x[1])}
+        x={scale.y(domain.y[1])}
+        dx={0}
       />
     </g>
   );

src/components/common/stat/HoverBar.js

@@ -18,7 +18,7 @@ export const HoverBar = props => {
       y: _.noop,
     },
     width,
-    y,
+    x
   } = props;
 
   const barGridWidth = barWidth / 6;
@@ -34,12 +34,13 @@ export const HoverBar = props => {
           y={scale.x(index + 1) - (barWidth / 2) - (barSpacing / 2)}
           rx={barGridRadius}
           ry={barGridRadius}
-          width={scale.y(domain.x[1])}
+          width={scale.y(domain.y[1])}
           height={barWidth + barSpacing}
           style={{
             stroke: 'transparent',
             fill: 'transparent',
           }}
+          {...props.events}
         />
       </g>
       <g className="barBg" pointerEvents="none">
@@ -49,7 +50,7 @@ export const HoverBar = props => {
           y={scale.x(index + 1) - (barGridWidth / 2)}
           rx={barGridRadius}
           ry={barGridRadius}
-          width={scale.y(domain.x[1]) - chartLabelWidth}
+          width={scale.y(domain.y[1]) - chartLabelWidth}
           height={barGridWidth}
           style={{
             stroke: 'transparent',
@@ -61,7 +62,7 @@ export const HoverBar = props => {
         <Bar
           {...props}
           width={scale.y(domain.x[1]) - chartLabelWidth}
-          y={y * widthCorrection}
+          x={x * widthCorrection}
         />
       </g>
     </g>

src/components/common/stat/HoverBarLabel.js

@@ -20,6 +20,12 @@ export const HoverBarLabel = props => {
     style = {},
     text,
     tooltipText,
+    // Victory animate sometimes passes undefined to the y prop which errors out the label rendering
+    // but eventually settles on the correct value for the final render, but we default to 15 (the lowest
+    // common observed value) to avoid the error
+    // There's a lot of strange behavior with animate and it's being completely rewritten
+    // see: https://github.com/FormidableLabs/victory/issues/2104
+    y = 15,
   } = props;
 
   const tooltipFontSize = _.min([barWidth / 2, 12]);
@@ -63,7 +69,8 @@ export const HoverBarLabel = props => {
         style={labelStyle}
         textAnchor="end"
         verticalAnchor="middle"
-        x={scale.y(domain.x[1])}
+        x={scale.y(domain.y[1])}
+        y={y}
         dx={-(labelUnitsTextSize.width * 1.9)}
       />
       <VictoryLabel
@@ -73,23 +80,26 @@ export const HoverBarLabel = props => {
         style={labelUnitsStyle}
         textAnchor="end"
         verticalAnchor="middle"
-        x={scale.y(domain.x[1])}
+        x={scale.y(domain.y[1])}
+        y={y}
         dx={0}
       />
       {tooltipTextSize.width > 0 && (
         <VictoryTooltip
           {...props}
           cornerRadius={tooltipRadius}
           datum={tooltipDatum}
-          x={scale.y(domain.x[1]) - style.paddingLeft - tooltipTextSize.width - (tooltipRadius * 2)}
+          x={scale.y(domain.y[1]) - style.paddingLeft - tooltipTextSize.width - (tooltipRadius * 2)}
+          y={y}
+          dx={0}
           flyoutStyle={{
             display: disabled ? 'none' : 'inherit',
             stroke: colors.axis,
             strokeWidth: 2,
             fill: colors.white,
           }}
-          width={tooltipTextSize.width + (tooltipRadius * 2)}
-          height={tooltipHeight}
+          flyoutWidth={tooltipTextSize.width + (tooltipRadius * 2)}
+          flyoutHeight={tooltipHeight}
           pointerLength={0}
           pointerWidth={0}
           renderInPortal={false}

src/components/common/stat/Stat.js

@@ -19,9 +19,9 @@ import BgBar from './BgBar';
 import BgBarLabel from './BgBarLabel';
 import StatTooltip from '../tooltips/StatTooltip';
 import StatLegend from './StatLegend';
-import CollapseIconOpen from './assets/expand-more-24-px.svg';
-import CollapseIconClose from './assets/chevron-right-24-px.svg';
-import InfoIcon from './assets/info-outline-24-px.svg';
+import CollapseIconOpen from './assets/expand-more-24-px.png';
+import CollapseIconClose from './assets/chevron-right-24-px.png';
+import InfoIcon from './assets/info-outline-24-px.png';
 import InputGroup from '../controls/InputGroup';
 
 /* global document */
@@ -465,8 +465,8 @@ class Stat extends PureComponent {
         height = chartProps.height || barWidth * 6;
 
         domain = {
-          x: [0, bgUnits === MGDL_UNITS ? MGDL_CLAMP_TOP : MMOLL_CLAMP_TOP],
-          y: [0, 1],
+          x: [0, 1],
+          y: [0, bgUnits === MGDL_UNITS ? MGDL_CLAMP_TOP : MMOLL_CLAMP_TOP],
         };
 
         padding = {
@@ -502,7 +502,7 @@ class Stat extends PureComponent {
               barWidth={barWidth}
               bgPrefs={props.bgPrefs}
               domain={domain}
-              text={(datum = {}) => {
+              text={({ datum = {} }) => {
                 const datumRef = _.get(chartData, datum.index, datum);
                 const { value } = formatDatum(
                   _.get(datumRef, 'deviation', datumRef),
@@ -511,7 +511,7 @@ class Stat extends PureComponent {
                 );
                 return `${value}`;
               }}
-              tooltipText={(datum = {}) => {
+              tooltipText={({ datum = {} }) => {
                 const { value, suffix } = formatDatum(
                   _.get(chartData, datum.index, datum),
                   props.dataFormat.tooltip,
@@ -525,11 +525,11 @@ class Stat extends PureComponent {
           renderer: VictoryBar,
           style: {
             data: {
-              fill: datum => this.getDatumColor(datum),
+              fill: ({ datum }) => this.getDatumColor(datum),
               width: () => barWidth,
             },
             labels: {
-              fill: datum => this.getDatumColor(_.assign({}, datum, formatDatum(
+              fill: ({ datum }) => this.getDatumColor(_.assign({}, datum, formatDatum(
                 datum,
                 props.dataFormat.label,
                 props
@@ -557,8 +557,8 @@ class Stat extends PureComponent {
         }
 
         domain = {
-          x: [0, 1],
-          y: [0, chartData.length],
+          x: [0, chartData.length],
+          y: [0, 1],
         };
 
         padding = {
@@ -647,11 +647,11 @@ class Stat extends PureComponent {
           renderer: VictoryBar,
           style: {
             data: {
-              fill: datum => (datum._y === 0 ? 'transparent' : this.getDatumColor(datum)),
+              fill: ({ datum }) => (datum._y === 0 ? 'transparent' : this.getDatumColor(datum)),
               width: () => barWidth,
             },
             labels: {
-              fill: datum => this.getDatumColor(_.assign({}, datum, formatDatum(
+              fill: ({ datum }) => this.getDatumColor(_.assign({}, datum, formatDatum(
                 datum,
                 props.dataFormat.label,
                 props

src/components/daily/bolustooltip/BolusTooltip.js

@@ -237,8 +237,8 @@ class BolusTooltip extends PureComponent {
 
     if (this.isLoop) {
       const { activeSchedule, carbRatios, insulinSensitivities } = _.get(wizard, 'dosingDecision.pumpSettings', {});
-      carbRatio = _.findLast(_.sortBy(carbRatios?.[activeSchedule] || [], 'start'), ({ start }) => start < this.msPer24)?.amount || null;
-      isf = _.findLast(_.sortBy(insulinSensitivities?.[activeSchedule] || [], 'start'), ({ start }) => start < this.msPer24)?.amount || null;
+      carbRatio = _.findLast(_.sortBy(carbRatios?.[activeSchedule] || [], 'start'), ({ start }) => start < this.msPer24)?.amount || carbRatio;
+      isf = _.findLast(_.sortBy(insulinSensitivities?.[activeSchedule] || [], 'start'), ({ start }) => start < this.msPer24)?.amount || isf;
     }
 
     const delivered = bolusUtils.getDelivered(wizard);
@@ -284,7 +284,7 @@ class BolusTooltip extends PureComponent {
     );
     const bgLine = !!bg && (
       <div className={styles.bg}>
-        <div className={styles.label}>{t('BG')} ({this.bgUnits})</div>
+        <div className={styles.label}>{t('Glucose')} ({this.bgUnits})</div>
         <div className={styles.value}>{this.formatBgValue(bg)}</div>
         <div className={this.unitStyles} />
       </div>

src/components/daily/cbgtooltip/CBGTooltip.js

@@ -18,6 +18,7 @@
 import PropTypes from 'prop-types';
 import React, { PureComponent } from 'react';
 import _ from 'lodash';
+import i18next from 'i18next';
 import {
   classifyBgValue,
   reshapeBgClassesToBgBounds,
@@ -30,13 +31,20 @@ import Tooltip from '../../common/tooltips/Tooltip';
 import colors from '../../../styles/colors.css';
 import styles from './CBGTooltip.css';
 
+const t = i18next.t.bind(i18next);
+
 class CBGTooltip extends PureComponent {
+  constructor(props) {
+    super(props);
+    this.bgUnits = this.props.bgPrefs?.bgUnits || '';
+  }
+
   renderCBG() {
     const cbg = this.props.cbg;
     const outOfRangeMessage = getOutOfRangeAnnotationMessage(cbg);
     const rows = [
       <div key={'bg'} className={styles.bg}>
-        <div className={styles.label}>BG</div>
+        <div className={styles.label}>{t('Glucose')} ({this.bgUnits})</div>
         <div className={styles.value}>
           {`${formatBgValue(cbg.value, this.props.bgPrefs, getOutOfRangeThreshold(cbg))}`}
         </div>

src/components/settings/NonTandem.js

@@ -295,7 +295,7 @@ const NonTandem = (props) => {
 NonTandem.propTypes = {
   bgUnits: PropTypes.oneOf([MMOLL_UNITS, MGDL_UNITS]).isRequired,
   copySettingsClicked: PropTypes.func.isRequired,
-  deviceKey: PropTypes.oneOf(['animas', 'carelink', 'insulet', 'medtronic', 'microtech', 'diy loop', 'tidepool loop']).isRequired,
+  deviceKey: PropTypes.oneOf(['animas', 'carelink', 'insulet', 'medtronic', 'microtech', 'diy loop', 'tidepool loop', 'twiist']).isRequired,
   openedSections: PropTypes.object.isRequired,
   pumpSettings: PropTypes.shape({
     activeSchedule: PropTypes.string.isRequired,

src/components/settings/common/Header.js

@@ -30,7 +30,7 @@ class Header extends PureComponent {
         <ul className={`${styles.header} ${styles.headerExpanded}`}>
           <li className={styles.headerOuter}>
             <span className={styles.headerInner}>
-              {t('Therapy Settings - Active at Upload on')} {this.props.deviceMeta.uploaded}
+              {t('Active at Upload on')} {this.props.deviceMeta.uploaded}
             </span>
           </li>
         </ul>

src/components/settings/common/PumpSettingsContainer.js

@@ -12,7 +12,7 @@ export class PumpSettingsContainer extends PureComponent {
     bgUnits: PropTypes.oneOf([MGDL_UNITS, MMOLL_UNITS]).isRequired,
     copySettingsClicked: PropTypes.func.isRequired,
     manufacturerKey: PropTypes.oneOf(
-      ['animas', 'carelink', 'insulet', 'medtronic', 'tandem', 'microtech', 'diy loop', 'tidepool loop']
+      ['animas', 'carelink', 'insulet', 'medtronic', 'tandem', 'microtech', 'diy loop', 'tidepool loop', 'twiist']
     ).isRequired,
     // see more specific schema in NonTandem and Tandem components!
     pumpSettings: PropTypes.shape({
@@ -52,7 +52,7 @@ export class PumpSettingsContainer extends PureComponent {
       timePrefs,
       toggleSettingsSection,
     } = this.props;
-    const supportedNonTandemPumps = ['animas', 'carelink', 'insulet', 'medtronic', 'microtech', 'diy loop', 'tidepool loop'];
+    const supportedNonTandemPumps = ['animas', 'carelink', 'insulet', 'medtronic', 'microtech', 'diy loop', 'tidepool loop', 'twiist'];
     const toggleFn = _.partial(toggleSettingsSection, manufacturerKey);
 
     if (manufacturerKey === 'tandem') {