Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WEB-3274] Add data source management to device settings page #1501

Merged
merged 26 commits into from
Jan 27, 2025
Merged

[WEB-3274] Add data source management to device settings page #1501

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
657f1a7
Replace Libre logo
clintonium-119 Jan 10, 2025
64c9c6b
Add Card component and storybook for Data Connections and Uploader
clintonium-119 Jan 10, 2025
6319c65
Update card banner images
clintonium-119 Jan 13, 2025
75cc1c5
Add Data Connection and Uploader cards and modals to no-data view
clintonium-119 Jan 13, 2025
2799516
Update mobile responsiveness of patient navbar header to be consisten…
clintonium-119 Jan 13, 2025
1089fd9
Add refresh button to no-data page and clean up styling
clintonium-119 Jan 13, 2025
1bd2d26
Small tweak for card borders at mobile breakpoints
clintonium-119 Jan 13, 2025
7f48e7c
Move patient data view container styling to theme.containers and impr…
clintonium-119 Jan 15, 2025
f681004
Add horizontal Card variant
clintonium-119 Jan 15, 2025
f4ccd48
Merge branch 'develop' into WEB-3274-device-settings-data-sources
clintonium-119 Jan 15, 2025
5a446dd
Add data connections to Therapy Settings view
clintonium-119 Jan 15, 2025
db2710c
Small mobile responsiveness tweaks to settings view
clintonium-119 Jan 16, 2025
9a761dd
Slightly reduce clinic and patient workspace header heights to better…
clintonium-119 Jan 16, 2025
4b7a889
Bump tideline and viz
clintonium-119 Jan 17, 2025
1a8ea5a
Fix broken tests
clintonium-119 Jan 17, 2025
82af58a
Revert to using Header component for no-data view
clintonium-119 Jan 20, 2025
7203d57
Update tests
clintonium-119 Jan 21, 2025
b1f60f2
Small whitespace cleanup
clintonium-119 Jan 21, 2025
ef7c5a4
Fix broken test
clintonium-119 Jan 21, 2025
efbdaa5
Bump viz
clintonium-119 Jan 21, 2025
533747c
v1.84.0-web-3274-device-settings-data-sources.1
clintonium-119 Jan 21, 2025
e7d4480
Merge branch 'WEB-3272-patient-data-linking-after-creation' into WEB-…
clintonium-119 Jan 23, 2025
67b39a0
Merge branch 'develop' into WEB-3274-device-settings-data-sources
clintonium-119 Jan 23, 2025
1f6bda7
Bump viz
clintonium-119 Jan 27, 2025
cc26306
Address PR feedback
clintonium-119 Jan 27, 2025
7109791
Merge branch 'develop' into WEB-3274-device-settings-data-sources
clintonium-119 Jan 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
118 changes: 60 additions & 58 deletions app/components/chart/basics.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import _ from 'lodash';
import bows from 'bows';
import sundial from 'sundial';
import { withTranslation, Trans } from 'react-i18next';
import { Flex } from 'theme-ui';
import { Box, Flex } from 'theme-ui';

// tideline dependencies & plugins
import tidelineBlip from 'tideline/plugins/blip';
Expand Down Expand Up @@ -82,73 +82,75 @@ class Basics extends Component {

return (
<div id="tidelineMain" className="basics">
<Header
chartType={this.chartType}
patient={this.props.patient}
atMostRecent={true}
inTransition={this.state.inTransition}
title={this.state.title}
onClickBasics={this.handleClickBasics}
onClickChartDates={this.props.onClickChartDates}
onClickOneDay={this.handleClickOneDay}
onClickTrends={this.handleClickTrends}
onClickRefresh={this.props.onClickRefresh}
onClickSettings={this.props.onSwitchToSettings}
onClickBgLog={this.handleClickBgLog}
onClickPrint={this.handleClickPrint}
ref="header" />
<div className="container-box-outer patient-data-content-outer">
<div className="container-box-inner patient-data-content-inner">
<div className="patient-data-content">
<Box variant="containers.patientData">
<Header
chartType={this.chartType}
patient={this.props.patient}
atMostRecent={true}
inTransition={this.state.inTransition}
title={this.state.title}
onClickBasics={this.handleClickBasics}
onClickChartDates={this.props.onClickChartDates}
onClickOneDay={this.handleClickOneDay}
onClickTrends={this.handleClickTrends}
onClickRefresh={this.props.onClickRefresh}
onClickSettings={this.props.onSwitchToSettings}
onClickBgLog={this.handleClickBgLog}
onClickPrint={this.handleClickPrint}
ref="header"
/>

<Box variant="containers.patientDataInner">
<Box className="patient-data-content" variant="containers.patientDataContent">
<Loader show={!!this.refs.chart && this.props.loading} overlay={true} />
{renderedContent}

{!this.isMissingBasics() && (
<Flex mt={4} mb={5} pl="10px">
<Button className="btn-refresh" variant="secondary" onClick={this.props.onClickRefresh}>
{this.props.t('Refresh')}
</Button>
</Flex>
<Button
className="btn-refresh"
variant="secondaryCondensed"
onClick={this.props.onClickRefresh}
mt={3}
>
{t('Refresh')}
</Button>
)}
</div>
</div>
<div className="container-box-inner patient-data-sidebar">
<div className="patient-data-sidebar-inner">
<div>
<Flex mb={2} sx={{ justifyContent: 'space-between', alignItems: 'center' }}>
<ClipboardButton
buttonTitle={t('For email or notes')}
onSuccess={this.handleCopyBasicsClicked}
getText={basicsText.bind(this, this.props.patient, this.props.data, this.props.stats, this.props.aggregations)}
/>
<BgSourceToggle
bgSources={_.get(this.props, 'data.metaData.bgSources', {})}
chartPrefs={this.props.chartPrefs}
chartType={this.chartType}
onClickBgSourceToggle={this.toggleBgDataSource}
/>
</Flex>
<Stats
bgPrefs={_.get(this.props, 'data.bgPrefs', {})}
chartPrefs={this.props.chartPrefs}
chartType={this.chartType}
stats={statsToRender}
trackMetric={this.props.trackMetric}
</Box>

<Box className="patient-data-sidebar" variant="containers.patientDataSidebar">
<Flex mb={2} sx={{ justifyContent: 'space-between', alignItems: 'center' }}>
<ClipboardButton
buttonTitle={t('For email or notes')}
onSuccess={this.handleCopyBasicsClicked}
getText={basicsText.bind(this, this.props.patient, this.props.data, this.props.stats, this.props.aggregations)}
/>
<DeviceSelection
<BgSourceToggle
bgSources={_.get(this.props, 'data.metaData.bgSources', {})}
chartPrefs={this.props.chartPrefs}
chartType={this.chartType}
devices={_.get(this.props, 'data.metaData.devices', [])}
removeGeneratedPDFS={this.props.removeGeneratedPDFS}
trackMetric={this.props.trackMetric}
updateChartPrefs={this.props.updateChartPrefs}
onClickBgSourceToggle={this.toggleBgDataSource}
/>
</div>
</div>
</div>
</div>
</Flex>
<Stats
bgPrefs={_.get(this.props, 'data.bgPrefs', {})}
chartPrefs={this.props.chartPrefs}
chartType={this.chartType}
stats={statsToRender}
trackMetric={this.props.trackMetric}
/>
<DeviceSelection
chartPrefs={this.props.chartPrefs}
chartType={this.chartType}
devices={_.get(this.props, 'data.metaData.devices', [])}
removeGeneratedPDFS={this.props.removeGeneratedPDFS}
trackMetric={this.props.trackMetric}
updateChartPrefs={this.props.updateChartPrefs}
/>
</Box>
</Box>
</Box>
</div>
);
);
};

renderChart = () => {
Expand Down
31 changes: 17 additions & 14 deletions app/components/chart/bgLog.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -260,24 +260,28 @@ class BgLog extends Component {

return (
<div id="tidelineMain" className="bgLog">
{this.isMissingSMBG() ? this.renderMissingSMBGHeader() : this.renderHeader()}
<div className="container-box-outer patient-data-content-outer">
<div className="container-box-inner patient-data-content-inner">
<div className="patient-data-content">
<Box variant="containers.patientData">
{this.isMissingSMBG() ? this.renderMissingSMBGHeader() : this.renderHeader()}

<Box variant="containers.patientDataInner">
<Box className="patient-data-content" variant="containers.patientDataContent">
<Loader show={!!this.refs.chart && this.props.loading} overlay={true} />
{renderedContent}

<Flex
mt={4}
mb={5}
pl="50px"
pr="30px"
sx={{
alignItems: 'center',
justifyContent: 'space-between',
}}
>
<Button className="btn-refresh" variant="secondary" onClick={this.props.onClickRefresh}>
<Button
className="btn-refresh"
variant="secondaryCondensed"
onClick={this.props.onClickRefresh}
>
{t('Refresh')}
</Button>

Expand All @@ -297,10 +301,9 @@ class BgLog extends Component {
/>
</Flex>
</Flex>
</div>
</div>
<div className="container-box-inner patient-data-sidebar">
<div className="patient-data-sidebar-inner">
</Box>

<Box className="patient-data-sidebar" variant="containers.patientDataSidebar">
<Box mb={2}>
<ClipboardButton
buttonTitle={t('For email or notes')}
Expand All @@ -323,10 +326,10 @@ class BgLog extends Component {
trackMetric={this.props.trackMetric}
updateChartPrefs={this.props.updateChartPrefs}
/>
</div>
</div>
</div>
<WindowSizeListener onResize={this.handleWindowResize} />
</Box>
</Box>
<WindowSizeListener onResize={this.handleWindowResize} />
</Box>
</div>
);
};
Expand Down
Loading