diff --git a/app/components/chart/deviceSelection.js b/app/components/chart/deviceSelection.js
index 8850806592..e0fbecf411 100644
--- a/app/components/chart/deviceSelection.js
+++ b/app/components/chart/deviceSelection.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { cloneDeep, pull, map, union, get, includes } from 'lodash';
 import Accordion from '../elements/Accordion';
 import Checkbox from '../elements/Checkbox';
-import { Box, Flex } from 'theme-ui';
+import { Box, Flex, Text } from 'theme-ui';
 
 import { colors, fontSizes } from '../../themes/baseTheme';
 import utils from '../../core/utils';
@@ -52,11 +52,15 @@ export const DeviceSelection = (props) => {
           <Checkbox
             checked={!includes(excludedDevices, id)}
             onChange={toggleDevice}
-            label={label || id}
             name={`${id}-toggle`}
             value={id}
             key={id}
             themeProps={{ sx: { color: colors.stat.text } }}
+            label={
+              <Text sx={{ textWrap: 'wrap', overflowWrap: 'break-word' }}>
+                {label || id}
+              </Text>
+            }
           />
         </Box>
       ))}