{"version":3,"file":"static/js/clock.efbba0c3.chunk.js","mappings":"mOAwBA,MAAMA,EAAoB,CACxBC,QAAS,CACPC,gBAAiB,EACjBC,eAAe,EACfC,kBAAkB,EAClBC,UAAU,IAIDC,EAAQ,WAA2D,IAA1DC,EAAkBC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAGR,EACzC,MAAOW,EAAUC,IAAeC,EAAAA,EAAAA,UAAS,KAClCC,EAASC,IAAcF,EAAAA,EAAAA,UAAS,KAChCG,EAAoBC,IAAyBJ,EAAAA,EAAAA,UAAS,GACvDK,GAAaC,EAAAA,EAAAA,IAAYC,EAAAA,IACzBC,GAAOF,EAAAA,EAAAA,IAAYG,EAAAA,KA2CzBC,EAAAA,EAAAA,YAAU,KACR,MAAMC,EAAQC,aAAY,KACxB,MAAMC,EAAU,IAAIC,KA3CLC,EAACC,EAAaC,EAAaC,KACxCF,EAAMG,EAAAA,GACRH,KAEAA,EAAM,EAEFC,EAAME,EAAAA,GACRF,KAEAA,EAAM,EAEFC,EAAOE,EAAAA,GACTF,IAEAA,EAAO,IAKb,IAAIjB,EAAU,GACVoB,EAAqBH,EACzB,MAAMI,EAAIL,EAAMM,EAAAA,GAAiC,IAAIN,IAAQA,EACvDO,EAAIR,EAAMO,EAAAA,GAAiC,IAAIP,IAAQA,EAExDtB,EAAMN,QAAQC,kBACb6B,EAAOO,EAAAA,IACTJ,EAAIH,EAAOO,EAAAA,GACXxB,EAAU,MAEVA,EAAU,MAIVoB,EAAIE,EAAAA,KACNF,EAAI,IAAIA,KAGVtB,EAAY,GAAGsB,KAAKC,KAAKE,KACzBtB,EAAW,GAAGD,IAAU,EAMtBc,CACEF,EAAQa,aACRb,EAAQc,aACRd,EAAQe,YAEVxB,GAAsByB,GAAQA,EAAO,GAAE,GACtCC,EAAAA,GAAgBC,eAEnB,MAAO,IAAMC,aAAarB,EAAM,GAC/B,KAEHD,EAAAA,EAAAA,YAAU,KACJhB,EAAMN,QAAQE,eAAiBe,GAAcG,EAAKyB,iBACpD7B,EAAsB8B,MAAQC,OAAS3B,EAAKyB,gBAC9C,GACC,CAAC5B,EAAYG,IAEhB,MAaM4B,EAbcC,KAClB,MAAMC,EAAOD,EAAKE,cACZC,EAAQC,OAAOJ,EAAKK,WAAa,GAAGC,SAAS,EAAG,KAChDC,EAAMH,OAAOJ,EAAKQ,WAAWF,SAAS,EAAG,KAE/C,OAAKjD,EAAMN,QAAQG,iBACV,GAAG+C,KAAQE,KAASI,IAEpB,GAAGA,KAAOJ,KAASF,GAC5B,EAIoBQ,CADT,IAAIhC,MAEXiC,EAAYrD,EAAMN,QAAQE,eAAiBe,IAC/C2C,EAAAA,EAAAA,MAAA,QAAAC,SAAA,CAAM,KAEJC,EAAAA,EAAAA,KAAA,QAAMC,UAAU,qBAAoBF,UACjCG,EAAAA,EAAAA,GAAgBjD,KACZ,OAKX,OACE+C,EAAAA,EAAAA,KAAA,OAAKC,UAAU,iBAAgBF,UAC7BD,EAAAA,EAAAA,MAAA,QAAAC,SAAA,EACEC,EAAAA,EAAAA,KAAA,QAAMG,MAAO,CAAEC,SAAU,OAAQC,QAAS,eAAgBN,SACvDnD,KAEHoD,EAAAA,EAAAA,KAAA,QAAMG,MAAO,CAAEG,aAAc,OAAQP,SAAEhD,IACtC8C,GACCrD,EAAMN,QAAQI,UAAYM,GAC1BkD,EAAAA,EAAAA,MAAAS,EAAAA,SAAA,CAAAR,SAAA,EACEC,EAAAA,EAAAA,KAACQ,EAAAA,EAAO,CACNC,KAAK,WACLC,SAAU,EACVT,UAAU,6BAEZD,EAAAA,EAAAA,KAAA,QACEG,MAAO,CAAEQ,MAAO,OAAQN,QAAS,eACjC,cAAY,oBAAmBN,SAE9Bb,OAGH,SAIZ,C","sources":["elements/Clock/index.tsx"],"sourcesContent":["import { ReactElement, useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux';\nimport dayjs from 'dayjs';\nimport {\n  COMPARATIVE_NUMBER_IN_HOURS_10,\n  COMPARATIVE_NUMBER_IN_HOURS_12,\n  COMPARATIVE_NUMBER_IN_HOURS_24,\n  COMPARATIVE_NUMBER_IN_HOURS_59,\n  timeoutDuration\n} from 'utils/constants/dateInfo/time-numbers';\nimport { fancyTimeFormat } from 'utils/string-manipulation/format-time-from-second';\nimport { Divider } from 'newcomponents/UI/Divider';\nimport { getIsLoggedIn, getUser } from 'store/selectors/user-data';\nimport './index.less';\n\ntype TClockProps = {\n  configs: {\n    twentyFourHours: number;\n    loginDuration: boolean;\n    specifiedFormats: boolean;\n    showDate: boolean;\n  };\n};\n\nconst clockDefaultProps = {\n  configs: {\n    twentyFourHours: 0,\n    loginDuration: true,\n    specifiedFormats: false,\n    showDate: false\n  }\n};\n\nexport const Clock = (props: TClockProps = clockDefaultProps): ReactElement => {\n  const [realTime, setRealTime] = useState('');\n  const [dayType, setDayType] = useState('');\n  const [loginDurationClock, setLoginDurationClock] = useState(0);\n  const isLoggedIn = useSelector(getIsLoggedIn);\n  const user = useSelector(getUser);\n\n  const setupClock = (sec: number, min: number, hour: number) => {\n    if (sec < COMPARATIVE_NUMBER_IN_HOURS_59) {\n      sec++;\n    } else {\n      sec = 0;\n\n      if (min < COMPARATIVE_NUMBER_IN_HOURS_59) {\n        min++;\n      } else {\n        min = 0;\n\n        if (hour < COMPARATIVE_NUMBER_IN_HOURS_24) {\n          hour++;\n        } else {\n          hour = 0;\n        }\n      }\n    }\n\n    let dayType = '';\n    let h: string | number = hour;\n    const m = min < COMPARATIVE_NUMBER_IN_HOURS_10 ? `0${min}` : min;\n    const s = sec < COMPARATIVE_NUMBER_IN_HOURS_10 ? `0${sec}` : sec;\n\n    if (!props.configs.twentyFourHours) {\n      if (hour > COMPARATIVE_NUMBER_IN_HOURS_12) {\n        h = hour - COMPARATIVE_NUMBER_IN_HOURS_12;\n        dayType = 'PM';\n      } else {\n        dayType = 'AM';\n      }\n    }\n\n    if (h < COMPARATIVE_NUMBER_IN_HOURS_10) {\n      h = `0${h}`;\n    }\n\n    setRealTime(`${h}:${m}:${s}`);\n    setDayType(`${dayType}`);\n  };\n\n  useEffect(() => {\n    const timer = setInterval(() => {\n      const newDate = new Date();\n      setupClock(\n        newDate.getSeconds(),\n        newDate.getMinutes(),\n        newDate.getHours()\n      );\n      setLoginDurationClock(prev => prev + 1);\n    }, timeoutDuration.DURATION_1000);\n\n    return () => clearTimeout(timer);\n  }, []);\n\n  useEffect(() => {\n    if (props.configs.loginDuration && isLoggedIn && user.last_login_date) {\n      setLoginDurationClock(dayjs().unix() - user.last_login_date);\n    }\n  }, [isLoggedIn, user]);\n\n  const formatDate = (date: Date) => {\n    const year = date.getFullYear();\n    const month = String(date.getMonth() + 1).padStart(2, '0');\n    const day = String(date.getDate()).padStart(2, '0');\n\n    if (+props.configs.specifiedFormats) {\n      return `${year}/${month}/${day}`;\n    } else {\n      return `${day}/${month}/${year}`;\n    }\n  };\n\n  const date = new Date();\n  const formattedDate = formatDate(date);\n  const fancyTime = props.configs.loginDuration && isLoggedIn && (\n    <span>\n      (\n      <span className=\"loginDurationClock\">\n        {fancyTimeFormat(loginDurationClock)}\n      </span>\n      )\n    </span>\n  );\n\n  return (\n    <div className=\"clock__element\">\n      <span>\n        <span style={{ minWidth: '64px', display: 'inline-flex' }}>\n          {realTime}\n        </span>\n        <span style={{ paddingRight: '2px' }}>{dayType}</span>\n        {fancyTime}\n        {+props.configs.showDate && realTime ? (\n          <>\n            <Divider\n              type=\"vertical\"\n              distance={8}\n              className=\"clock__element--divider\"\n            />\n            <span\n              style={{ width: '80px', display: 'inline-flex' }}\n              data-testid=\"clock-widget-date\"\n            >\n              {formattedDate}\n            </span>\n          </>\n        ) : null}\n      </span>\n    </div>\n  );\n};\n"],"names":["clockDefaultProps","configs","twentyFourHours","loginDuration","specifiedFormats","showDate","Clock","props","arguments","length","undefined","realTime","setRealTime","useState","dayType","setDayType","loginDurationClock","setLoginDurationClock","isLoggedIn","useSelector","getIsLoggedIn","user","getUser","useEffect","timer","setInterval","newDate","Date","setupClock","sec","min","hour","COMPARATIVE_NUMBER_IN_HOURS_59","COMPARATIVE_NUMBER_IN_HOURS_24","h","m","COMPARATIVE_NUMBER_IN_HOURS_10","s","COMPARATIVE_NUMBER_IN_HOURS_12","getSeconds","getMinutes","getHours","prev","timeoutDuration","DURATION_1000","clearTimeout","last_login_date","dayjs","unix","formattedDate","date","year","getFullYear","month","String","getMonth","padStart","day","getDate","formatDate","fancyTime","_jsxs","children","_jsx","className","fancyTimeFormat","style","minWidth","display","paddingRight","_Fragment","Divider","type","distance","width"],"sourceRoot":""}