main BodyClasses.js

0% Statements 0/21

0% Branches 0/5

0% Functions 0/6

0% Lines 0/19

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { useSelector } from 'react-redux'
 
import { isDarkMode, isMobileOrTablet } from 'common/utils/browser.utils'
 
import { detect } from 'detect-browser'
 
const { body } = document
 
const addBrowserClasses = () => {
  const normalise = (name) => name.toLowerCase().split(' ').join('-')
 
  const { name, version, os } = detect()
 
  body.classList.add(normalise(name))
  body.classList.add(normalise(`${name}-${version}`))
  body.classList.add(normalise(os))
}
 
const addDarkModeClasses = () => {
  body.classList.remove(`dark-mode`)
  body.classList.remove(`light-mode`)
  body.classList.add(`${isDarkMode() ? 'dark' : 'light'}-mode`)
}
 
const addMobileDesktopClasses = () => {
  body.classList.add(isMobileOrTablet() ? 'mobile-tablet' : 'desktop')
}
 
const BodyClasses = (props) => {
  const { darkMode = 'browser' } = useSelector((state) => state.settings)
 
  addDarkModeClasses({ darkMode })
  addMobileDesktopClasses()
  addBrowserClasses()
 
  return props.children
}
 
export default BodyClasses