\n {graph.hasUptime && (
\n
\n
{graph.name} Uptime
\n
{graph.uptime}%
\n
\n
\n {graph.hasResponseTime &&
}\n
)\n }\n\n {graph.hasResponseTime && (
\n
\n
{graph.name} Response time
\n
{graph.responseTime}ms
\n
\n
\n
)\n }\n
\n );\n }\n\n render() {\n const { selectedTimeline } = this.props;\n\n return(\n !!this.state.color.length && this.getStats(selectedTimeline)\n );\n }\n}\n\nexport default WhiteBoxStats;\n","import React, { Component } from 'react';\n\nclass TimelineSelector extends Component {\n constructor(props) {\n super(props);\n\n const items = props.items;\n items.reverse();\n\n this.state = {\n items\n }\n }\n render() {\n const { selected, onClick, hasSnapshots } = this.props;\n\n return(\n
\n {this.state.items.map(item => {\n if (!hasSnapshots && item.value > 1) {\n return null;\n }\n return(\n onClick(item.value)}\n >\n {item.name}\n )\n }\n )}\n
\n )\n }\n}\n\nexport default TimelineSelector;\n","import React from 'react';\nimport { Link, withRouter } from 'react-router-dom';\n\nimport {\n getHourAndMinute,\n getEstimatedDuration,\n getMaintenanceStatus,\n getTimeAgo,\n formatText,\n getDateRange,\n isWithin24Hours,\n isUpcoming } from '../utils/index.js';\n\nimport './styles.scss';\nimport outageImg from './assets/red-check.svg';\nimport incidentImg from './assets/incident.svg';\nimport maintenanceImg from './assets/maintenance.svg';\n\nconst GetSpan = ({ children }) => {\n return (\n
{children}\n )\n};\n\nconst capitalize = (s) => {\n if (typeof s !== 'string') return '';\n return s.charAt(0).toUpperCase() + s.slice(1);\n}\n\nclass Incidents extends React.Component {\n constructor(props) {\n super(props);\n\n const { pathname } = window.location;\n this.state = {\n isPreview: pathname.includes('/public/')\n }\n }\n\n getBackLink = () => {\n const { isPreview } = this.state;\n const { isIncidentPage, statusPageId } = this.props;\n\n let backlink = '/';\n\n if (isPreview) {\n backlink = isIncidentPage ? `/public/${statusPageId}/history` : `/public/${statusPageId}`;\n } else {\n backlink = isIncidentPage ? `/history` : '/';\n }\n\n return backlink;\n }\n\n goToIncidentPage(incidentId) {\n if (this.props.isIncidentPage) {\n return;\n }\n\n const { pathname } = this.props.location;\n\n if (pathname.includes('/history')) {\n this.props.history.push(`${pathname}/${incidentId}`)\n }\n }\n\n capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n }\n\n getIcon(type) {\n if (type === 'maintenance') {\n return maintenanceImg;\n } else if (type === 'incident') {\n return incidentImg;\n } else if (type === 'outage') {\n return outageImg;\n }\n }\n\n render() {\n let { incidents } = this.props;\n const { isHomePage, isIncidentPage, statusPageId, statuspage } = this.props;\n const { isPreview } = this.state;\n if (isHomePage) {\n incidents = incidents.filter((incident) => {\n if (incident.type !== 'maintenance') {\n return isWithin24Hours(new Date(incident.date));\n } else {\n const endDate = new Date(incident.endDate);\n return isWithin24Hours(endDate) || isUpcoming(endDate);\n }\n });\n }\n\n const Tag = isIncidentPage ? GetSpan : Link;\n\n return(\n
\n {isHomePage === false && !isIncidentPage &&
History}\n {isHomePage === false && isIncidentPage === true &&
Updates}\n {isHomePage === true && (incidents.length > 0) &&
Recent updates}\n {incidents.length <= 0 && isHomePage &&
No update reported today.}\n {!isHomePage &&\n
\n ← Back\n \n }\n \n\n \n\n {incidents.length <= 0 && !isHomePage && No incidents reported.
}\n {incidents.map((incident, index) => (\n \n \n
{getDateRange(incident)}
\n
\n {!!incident.type &&
})
}\n {!!incident.type &&
{this.capitalize(incident.type)}}\n
{incident.title}\n {(incident.type === 'maintenance') &&
{getEstimatedDuration(incident)}
}\n
\n {incident.updates.map((update, index) => (\n
\n
{getHourAndMinute(update.UTCTime)}
{incident.type === 'maintenance' ? getMaintenanceStatus(incident.date, incident.endDate, index) : capitalize(update.type)}
Posted {getTimeAgo(update.UTCTime)}\n {!!update.text &&
}\n
\n ))}\n
\n
\n );\n }\n}\n\nexport default withRouter(Incidents);\n","import React, { Component } from 'react';\nimport './styles.scss';\nimport Notification from '../Notification';\nimport { getBaseUrl } from '../utils';\n\nconst baseUrl = getBaseUrl();\n\nclass ProtectedPage extends Component {\n constructor(props) {\n super(props);\n this.state = {\n password: '',\n wrongPassword: false,\n image: '',\n showNotification: false,\n isLoading: false\n }\n }\n\n componentDidMount() {\n this.setFavicon();\n this.setTabName();\n }\n\n setFavicon() {\n const { favicon } = this.props.data;\n\n if (!!favicon) {\n document.querySelector(\"link[rel='shortcut icon']\").href = favicon;\n }\n }\n\n setTabName() {\n document.title = (this.props.data.name || 'System') + ' Status';\n }\n\n onChangePassword = (e) => {\n this.setState({ password: e.target.value });\n }\n\n submit = (e) => {\n e.preventDefault();\n this.setState({ isLoading: true });\n fetch(`${baseUrl}/api/v1/public/statuspage/authenticate`, {\n method: 'POST',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n },\n credentials: 'include',\n body: JSON.stringify({\n password: this.state.password,\n hostname: window.location.hostname\n })\n }).then(response => response.json())\n .then(response => {\n this.setState({ isLoading: false });\n if (response.message === 'Wrong password') {\n this.setState({ showNotification: true });\n } else {\n window.location.reload();\n }\n });\n }\n \n closeNotification = () => {\n this.setState({ showNotification: false });\n }\n\n render() {\n const { password, isLoading } = this.state;\n const { image, name } = this.props.data;\n\n return(\n
\n
\n {this.state.showNotification &&\n
\n }\n
\n );\n }\n}\n\nexport default ProtectedPage;\n","import React, { Component } from 'react';\n\nclass PoweredBy extends Component {\n getHostname() {\n const { hostname } = window.location;\n return hostname;\n }\n\n render() {\n const hostname = this.getHostname();\n\n return (\n
\n
Powered by Hyperping\n \n )\n }\n}\n\nexport default PoweredBy;","import React, { Component } from 'react';\nimport Header from './Header';\nimport WhiteBoxHeader from './WhiteBoxHeader';\nimport WhiteBoxStats from './WhiteBoxStats';\nimport TimelineSelector from './TimelineSelector';\nimport Notification from './Notification';\nimport Incidents from './Incidents';\nimport ProtectedPage from './ProtectedPage';\nimport './App.scss';\nimport { getBaseUrl } from './utils';\nimport { withRouter } from 'react-router-dom';\nimport PoweredBy from './PoweredBy';\n\nconst baseUrl = getBaseUrl();\n \nclass App extends Component {\n constructor(props) {\n super(props);\n\n let showNotification = false;\n let notificationMessage = '';\n if (!!this.props.location.search) {\n const { search } = this.props.location;\n showNotification = search.includes('confirm=true') || search.includes('unsubscribe=true');\n \n if (search.includes('confirm=true')) {\n notificationMessage = 'You successfully confirmed your subscription to this status page';\n } else if (search.includes('unsubscribe=true')) {\n notificationMessage = 'You successfully unsubscribed to this status page';\n }\n }\n\n this.state = {\n statusPageId: null,\n environment: '',\n loading: false,\n services: [],\n statuspage: props.history.location.statuspage,\n timelineItems: [\n { value: 1, name: '24 hours'},\n { value: 8, name: '1 week'},\n { value: 31, name: '1 month'},\n { value: 91, name: '3 months'},\n { value: 365, name: '12 months'},\n ],\n selectedTimeline: 1,\n baseUrl,\n color: '',\n showNotification,\n notificationMessage,\n protected: false,\n protectedPageData: {},\n incidents: []\n };\n }\n\n componentDidMount() {\n const { pathname, hostname } = window.location;\n const statusPageId = pathname.split('/public/')[1];\n\n if (pathname.includes('/public/')) {\n this.setState({\n environment: 'preview',\n statusPageId\n }, () => this.fetchStatusPage());\n } else {\n this.setState({\n environment: 'live',\n statusPageId: hostname\n }, () => this.fetchStatusPage());\n }\n }\n\n isNumber(n) {\n return /^-?[\\d.]+(?:e-?\\d+)?$/.test(n);\n } \n\n hasFavicon() {\n return !!this.state.statuspage.favicon && this.state.statuspage.favicon.length\n }\n\n setFavicon() {\n let favicon = ''\n\n if (this.hasFavicon()) {\n favicon = this.state.statuspage.favicon \n } else {\n const service = this.state.services.find((serv) => !!serv.favicon && serv.favicon.length)\n if (!!service && !!service.favicon) {\n favicon = service.favicon\n }\n }\n\n if (!!favicon && favicon.length) {\n document.querySelector(\"link[rel='shortcut icon']\").href = favicon;\n }\n }\n\n setTabName() {\n document.title = (this.state.statuspage.name || 'System') + ' Status';\n }\n\n fetchSnapshots(services) {\n const ids = services.map(service => {\n if (service.isResponseTimeSelected || service.isUptimeSelected) {\n return service.id;\n }\n });\n\n ids.forEach((id) => {\n fetch(`${this.state.baseUrl}/api/v1/public/snapshots/${id}?limit=365`)\n .then((response) => response.json())\n .then((response) => response.data)\n .then((snapshots) => {\n const services = this.state.services.map((serv) => {\n if (serv.id === id) {\n serv.snapshots = snapshots;\n }\n return serv;\n });\n\n this.setState({ services });\n })\n });\n }\n\n fetchPreview() {\n const { statuspage } = this.state;\n if (!!statuspage) {\n this.setState({\n loading: false,\n services: [...statuspage.services],\n statuspage: statuspage,\n incidents: statuspage.incidents || []\n });\n this.fetchSnapshots(statuspage.services);\n this.setFavicon();\n this.setTabName();\n return;\n }\n\n // let tokenSession = localStorage.getItem('ngStorage-tokenSession')\n // if (!!tokenSession) {\n // tokenSession = tokenSession.replace(/\"/, '').replace(/\"/, '');\n // }\n // const userId = localStorage.getItem('ngStorage-userId');\n\n fetch(`${this.state.baseUrl}/api/v1/public/services/${this.state.statusPageId}`, {\n method: 'GET',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n },\n credentials: 'include'\n })\n .then((response) => response.json())\n .then((response) => {\n if (response.message === 'Unauthorized') {\n this.setState({ protected: true, protectedPageData: response.data });\n }\n return response;\n })\n .then((response) => response.data)\n .then((statuspage) => {\n this.setState({\n loading: false,\n services: [...statuspage.services],\n statuspage: statuspage,\n incidents: statuspage.incidents || []\n });\n\n this.fetchSnapshots(statuspage.services);\n this.setFavicon();\n this.setTabName();\n }).catch((err) => {\n });\n }\n\n fetchStatusPage() {\n this.setState({ loading: true });\n this.fetchPreview();\n }\n\n handleTimelineSelector = (value) => {\n const selectedTimeline = parseInt(value, 10);\n this.setState({ selectedTimeline });\n }\n\n hasSnapshotsLoaded() {\n const services = this.state.services;\n const servicesWithGraphs = services.filter(service => service.isResponseTimeSelected || service.isUptimeSelected);\n const hasSnapshots = servicesWithGraphs.every(service => !!service.snapshots);\n if (!hasSnapshots) {\n return false;\n }\n const hasLoaded = servicesWithGraphs.every(service => !!service.snapshots.length);\n return hasLoaded;\n }\n\n closeNotification = () => {\n this.setState({ showNotification: false });\n }\n\n hasAtLeastOneMetric = () => {\n if (!!this.state.services && this.state.services.length) {\n const hasAtLeastOne = this.state.services.find((service) => (service.isResponseTimeSelected || service.isUptimeSelected));\n return !!hasAtLeastOne;\n }\n\n return false;\n }\n\n render() {\n if (this.state.protected) {\n return (\n
\n )\n }\n\n return (\n
\n {this.state.showNotification &&
}\n
\n\n {!!this.state.services.length &&\n \n }\n\n {!!this.state.services.length && this.hasAtLeastOneMetric() &&\n this.handleTimelineSelector(event)}\n selected={this.state.selectedTimeline}\n hasSnapshots={this.hasSnapshotsLoaded()}\n />\n }\n\n {!!this.state.services.length && !!this.state.statuspage &&\n \n }\n\n {!!this.state.statuspage && this.state.statuspage.features && this.state.statuspage.features.incidents &&\n \n }\n\n {!!this.state.services.length &&\n \n }\n \n );\n }\n}\n\nexport default withRouter(App);\n","import React from 'react';\nimport IncidentsComponent from './Incidents/index.jsx';\nimport { getBaseUrl } from './utils';\nimport ProtectedPage from './ProtectedPage';\nimport { withRouter } from 'react-router-dom';\nimport Header from './Header';\nimport PoweredBy from './PoweredBy';\nimport './App.scss';\n\nconst baseUrl = getBaseUrl();\n\nclass Incidents extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n incidents: [],\n statuspage: props.history.location.statuspage,\n protected: false,\n protectedPageData: {}\n }\n }\n\n componentDidMount() {\n if (!!this.props.match && !!this.props.match.params && !!this.props.match.params.id) {\n const { id } = this.props.match.params;\n this.setState({ statusPageId: id }, () => {\n this.fetchStatuspage();\n });\n } else {\n const { hostname } = window.location;\n\n this.setState({ statusPageId: hostname }, () => {\n this.fetchStatuspage();\n });\n }\n }\n\n fetchStatuspage = () => {\n if (!!this.state.statuspage) {\n this.setTabName();\n this.setFavicon();\n return null;\n }\n // let tokenSession = localStorage.getItem('ngStorage-tokenSession');\n // if (!!tokenSession) {\n // tokenSession = tokenSession.replace(/\"/, '').replace(/\"/, '');\n // }\n // const userId = localStorage.getItem('ngStorage-userId');\n\n fetch(`${baseUrl}/api/v1/public/services/${this.state.statusPageId}`, {\n method: 'GET',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n },\n credentials: 'include'\n })\n .then((response) => response.json())\n .then((response) => {\n if (response.message === 'Unauthorized') {\n this.setState({ protected: true, protectedPageData: response.data });\n }\n return response;\n })\n .then((response) => response.data)\n .then((statuspage) => {\n this.setState({ statuspage }, () => {\n this.setTabName();\n this.setFavicon();\n });\n }).catch((err) => {\n console.log(err);\n });\n }\n\n setTabName() {\n document.title = (this.state.statuspage.name || 'System') + ' Incidents';\n }\n\n hasFavicon() {\n return !!this.state.statuspage.favicon && this.state.statuspage.favicon.length\n }\n\n setFavicon() {\n let favicon = '';\n\n if (this.hasFavicon()) {\n favicon = this.state.statuspage.favicon;\n document.querySelector(\"link[rel='shortcut icon']\").href = favicon;\n }\n }\n\n render() {\n if (this.state.protected) {\n return (\n
\n )\n }\n\n const { statuspage } = this.state;\n if (!statuspage) {\n return null;\n }\n const incidents = statuspage.incidents;\n return(\n
\n {
}\n\n {!!incidents &&
}\n
\n
\n );\n }\n}\n\nexport default withRouter(Incidents);\n","import React from 'react';\nimport IncidentsComponent from './Incidents/index.jsx';\nimport Header from './Header';\nimport './App.scss';\nimport ProtectedPage from './ProtectedPage';\nimport { getBaseUrl } from './utils';\nimport { withRouter } from 'react-router-dom';\nimport PoweredBy from './PoweredBy';\n\nconst baseUrl = getBaseUrl();\n\nclass Incident extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n incident: props.history.location.incident,\n statuspage: props.history.location.statuspage,\n incidentId: null,\n protected: false,\n protectedPageData: {}\n }\n }\n\n componentDidMount() {\n const { incidentId } = this.props.match.params;\n\n if (!!this.props.match && !!this.props.match.params && !!this.props.match.params.id) {\n const { id } = this.props.match.params;\n\n this.setState({ statusPageId: id, incidentId }, () => {\n this.fetchIncident();\n });\n } else {\n const { hostname } = window.location;\n\n this.setState({ statusPageId: hostname, incidentId }, () => {\n this.fetchIncident();\n });\n }\n }\n\n fetchStatuspage = () => {\n if (!!this.state.statuspage) {\n this.setTabName();\n this.setFavicon();\n return null;\n }\n\n fetch(`${baseUrl}/api/v1/public/services/${this.state.statusPageId}`, {\n method: 'GET',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n },\n credentials: 'include'\n })\n .then((response) => response.json())\n .then((response) => {\n if (response.message === 'Unauthorized') {\n this.setState({ protected: true, protectedPageData: response.data });\n }\n return response;\n })\n .then((response) => response.data)\n .then((statuspage) => {\n this.setState({ statuspage }, () => {\n this.setTabName();\n this.setFavicon();\n });\n });\n }\n\n\n fetchIncident() {\n if (!!this.state.incident) {\n return;\n }\n const { incidentId } = this.state;\n const { hostname } = window.location;\n\n fetch(`${baseUrl}/api/v1/incident/${hostname}/${incidentId}`, {\n method: 'GET',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n },\n credentials: 'include'\n })\n .then(response => response.json())\n .then((response) => {\n this.setState({ incident: response.data });\n });\n\n if (!this.state.statuspage) {\n this.fetchStatuspage();\n } else {\n this.setTabName();\n }\n }\n\n setTabName() {\n document.title = this.state.statuspage.name + ' Incidents';\n }\n\n hasFavicon() {\n return !!this.state.statuspage.favicon && this.state.statuspage.favicon.length\n }\n\n setFavicon() {\n let favicon = ''\n\n if (this.hasFavicon()) {\n favicon = this.state.statuspage.favicon \n document.querySelector(\"link[rel='shortcut icon']\").href = favicon;\n }\n }\n\n render() {\n if (this.state.protected) {\n return (\n
\n )\n }\n\n const { incident, statuspage } = this.state;\n if (!statuspage) {\n return null;\n }\n\n return (\n
\n {
}\n\n {!!incident\n &&
\n }\n
\n
\n );\n }\n}\n\nexport default withRouter(Incident);\n","import React from 'react';\nimport { Redirect } from 'react-router-dom';\nimport { getBaseUrl } from './utils';\nimport './App.scss';\n\nconst baseUrl = getBaseUrl();\n\nclass ConfirmSubscription extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n token: null,\n isConfirmed: false,\n redirect: false\n }\n }\n\n componentDidMount() {\n const { token } = this.props.match.params;\n\n this.setState({ token }, () => {\n this.confirmSusbcription();\n });\n }\n\n confirmSusbcription = () => {\n fetch(`${baseUrl}/api/v1/confirm-subscription?token=${this.state.token}`, {\n method: 'GET',\n headers: {\n 'Accept': 'application/json',\n 'Content-Type': 'application/json'\n },\n credentials: 'include'\n })\n .then(response => response.json())\n .then((response) => {\n this.setState({ isConfirmed: true, redirect: true });\n });\n }\n\n renderRedirect = () => {\n const { pathname } = this.props.location;\n let pathnameDestination = '/';\n if (pathname.includes('/public/')) {\n pathnameDestination = pathname.split('/confirm/')[0];\n }\n if (this.state.redirect) {\n return
\n }\n }\n\n render() {\n return(\n
\n {this.renderRedirect()}\n {!this.isConfirmed && Confirming your subscription}\n
\n );\n }\n}\n\nexport default ConfirmSubscription;\n","import React from 'react';\nimport { Redirect } from 'react-router-dom';\nimport { getBaseUrl } from './utils';\nimport './App.scss';\n\nconst baseUrl = getBaseUrl();\n\nclass Unsubscribe extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n token: null,\n isUnsubscribed: false,\n redirect: false\n }\n }\n\n componentDidMount() {\n const { token } = this.props.match.params;\n\n this.setState({ token }, () => {\n this.confirmSusbcription();\n });\n }\n\n confirmSusbcription = () => {\n fetch(`${baseUrl}/api/v1/unsubscribe?token=${this.state.token}`)\n .then(response => response.json())\n .then((response) => {\n this.setState({ isUnsubscribed: true, redirect: true });\n });\n }\n\n renderRedirect = () => {\n const { pathname } = this.props.location;\n let pathnameDestination = '/';\n if (pathname.includes('/public/')) {\n pathnameDestination = pathname.split('/unsubscribe/')[0];\n }\n if (this.state.redirect) {\n return
\n }\n }\n\n render() {\n return(\n
\n {this.renderRedirect()}\n {!this.isUnsubscribed && Unsubscribing}\n
\n );\n }\n}\n\nexport default Unsubscribe;\n","// In production, we register a service worker to serve assets from local cache.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on the \"N+1\" visit to a page, since previously\n// cached resources are updated in the background.\n\n// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.\n// This link also includes instructions on opting out of this behavior.\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport default function register() {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Lets check if a service worker still exists or not.\n checkValidServiceWorker(swUrl);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://goo.gl/SC7cgQ'\n );\n });\n } else {\n // Is not local host. Just register service worker\n registerValidSW(swUrl);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the old content will have been purged and\n // the fresh content will have been added to the cache.\n // It's the perfect time to display a \"New content is\n // available; please refresh.\" message in your web app.\n console.log('New content is available; please refresh.');\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n if (\n response.status === 404 ||\n response.headers.get('content-type').indexOf('javascript') === -1\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { Route, BrowserRouter as Router, Switch } from 'react-router-dom';\nimport './index.scss';\nimport App from './App';\nimport Incidents from './IncidentsPage';\nimport Incident from './IncidentPage';\nimport ConfirmSubscription from './ConfirmSubscriptionPage';\nimport Unsubscribe from './UnsubscribePage';\nimport { unregister } from './registerServiceWorker';\n\nconst routing = (\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n);\n\nReactDOM.render(routing, document.getElementById('root'));\nunregister();\n","import React, { Component } from 'react';\nimport Subscribe from '../Subscribe';\nimport TopLevelStatus from '../TopLevelStatus';\nimport './header.scss';\nimport { ReactComponent as ExternalLink } from './assets/external-link.svg';\n\nconst EmptyState = () => (\n
\n);\n\nclass Header extends Component {\n constructor(props) {\n super(props);\n\n const baseUrl = !!process && !!process.env && process.env.REACT_APP_STAGE === 'dev'\n ? 'http://localhost:3200'\n : 'https://app.hyperping.io';\n this.state = {\n baseUrl,\n }\n }\n\n hasSubscriberFeature = () => {\n const { statuspage } = this.props;\n\n return !!statuspage.features\n && !!statuspage.features.subscribers\n && statuspage.features.subscribers === true;\n }\n \n hasSubscriberPhoneFeature = () => {\n const { statuspage } = this.props;\n\n return !!statuspage.features\n && !!statuspage.features.subscribersPhone\n && statuspage.features.subscribersPhone === true;\n }\n\n isOriginalCoverColor = () => this.props.statuspage.coverColor.toLowerCase().includes('fafbfc');\n\n render() {\n const { statuspage } = this.props;\n if (!statuspage) {\n return
;\n }\n\n return(\n
\n )\n }\n}\n\nexport default Header;\n","import React from 'react';\n\nimport './styles.scss';\n\nclass Notification extends React.Component {\n componentDidMount() {\n setTimeout(() => {\n this.props.closeNotification();\n }, 4500);\n }\n\n render() {\n return(\n
{this.props.message}
\n );\n }\n}\n\nexport default Notification;\n","import * as React from 'react';\nimport * as moment from 'moment-timezone';\n\nexport const formatDate = (rawDate) => {\n const date = new Date(rawDate);\n const formatted = moment(date).format('DD MMM YYYY');\n return formatted;\n}\n\nexport const formatDateAndTime = (rawDate) => {\n const date = new Date(rawDate);\n const formatted = moment(date).format('D MMM YYYY H:mm A');\n return formatted;\n}\n\nexport const getHourAndMinute = (rawDate) => {\n // 20:50\n\n const date = new Date(rawDate);\n const formatted = moment(date).format('HH:mm');\n return formatted;\n}\n\nexport const getTimeAgo = rawDate => moment(new Date(rawDate), 'YYYYMMDD').fromNow();\n\nexport const formatText = text => text.split('\\n').join('
');\n\nconst areDatesOnSameMonth = (latestDateRaw, oldestDateRaw) => {\n const latestDate = new Date(latestDateRaw);\n const oldestDate = new Date(oldestDateRaw);\n\n const formattedLatestDate = moment(latestDate).format('MMM');\n const formattedOldestDate = moment(oldestDate).format('MMM');\n return formattedLatestDate === formattedOldestDate;\n}\n\nconst areDatesOnSameDay = (latestDateRaw, oldestDateRaw) => {\n const latestDate = new Date(latestDateRaw);\n const oldestDate = new Date(oldestDateRaw);\n\n const latestDay = moment(latestDate).format('DD');\n const oldestDay = moment(oldestDate).format('DD');\n return { latestDay, oldestDay };\n}\n\nexport const getDateRange = (incident) => {\n const { updates } = incident;\n\n const latest = updates[0];\n if (!latest) {\n return moment(incident.date).format('DD MMM YYYY');\n }\n const oldest = updates[updates.length - 1];\n const aresameMonth = areDatesOnSameMonth(latest.UTCTime, oldest.UTCTime);\n const { latestDay, oldestDay } = areDatesOnSameDay(latest.UTCTime, oldest.UTCTime);\n if (aresameMonth && (latestDay === oldestDay)) {\n return formatDate(latest.UTCTime);\n }\n\n if (aresameMonth && (latestDay !== oldestDay)) {\n return `${oldestDay} - ${latestDay} ${moment(latest.UTCTime).format('MMM YYYY')}`;\n }\n\n if (!aresameMonth) {\n return `${oldestDay} ${moment(new Date(oldest.UTCTime)).format('MMM')} - ${latestDay} ${moment(new Date(latest.UTCTime)).format('MMM YYYY')}`;\n }\n}\n\nexport const isWithin24Hours = (dateRaw) => {\n const now = new Date();\n const hours = Math.abs(dateRaw - now) / 36e5;\n return hours <= 24;\n}\n\nexport const isUpcoming = (dateRaw) => {\n const now = new Date();\n return moment(dateRaw).isAfter(now);\n}\n\nconst getTimezone = () => moment.tz(moment.tz.guess()).format('z');\n\nconst getHourGrammar = (hour) => {\n if (hour > 1) {\n return ' hours';\n } else {\n return ' hour'\n }\n}\n\nconst getMinuteGrammar = (minute) => {\n if (minute > 1) {\n return 'minutes';\n } else {\n return 'minute'\n }\n}\n\nexport const getEstimatedDuration = (maintenance) => {\n const hasMinutes = maintenance.minutes !== 0;\n const hasHours = maintenance.hours !== 0;\n let duration = `${hasHours ? (maintenance.hours + getHourGrammar(maintenance.hours)) : ''}`;\n if (hasHours && hasMinutes) {\n duration += ` and ${maintenance.minutes} ${getMinuteGrammar(maintenance.minutes)}`\n } else if (hasMinutes) {\n duration += `${maintenance.minutes} ${getMinuteGrammar(maintenance.minutes)}`\n }\n\n const startDate = new Date(maintenance.date);\n const startHumanDate = moment(startDate).format('DD MMM h:mm A');\n const endDate = new Date(maintenance.endDate);\n const endHumanDate = moment(endDate).format('DD MMM h:mm A');\n\n const timezone = getTimezone();\n \n return (\n
\n Estimated duration: {duration}
\n{startHumanDate} {timezone} - {endHumanDate} {timezone}\n \n );\n}\n\nexport const getMaintenanceStatus = (startDate, endDate, index) => {\n if (index !== 0) {\n return;\n }\n\n const date = new Date();\n if (moment(date).isBetween(startDate, endDate)) {\n return 'In Progress';\n } else if (moment(date).isBefore(startDate)) {\n return 'Upcoming';\n } else if (moment(date).isAfter(endDate)) {\n return 'Completed'\n }\n}\n\nconst { hostname, protocol } = window.location;\n\nconst getProtocol = () => {\n // Only *.hyperping.io domains can be accessible without https\n // status.* domains are being redirected to https\n if (hostname.includes('.hyperping.io') && protocol === 'http:') {\n return 'https://';\n }\n if (!!process && !!process.env && process.env.REACT_APP_STAGE === 'dev') {\n return 'http://';\n }\n return 'https://';\n}\n\nexport const getBaseUrl = () => !!process && !!process.env && process.env.REACT_APP_STAGE === 'dev'\n ? 'http://status.dev.io:3000'\n : `${getProtocol()}app.hyperping.io` "],"sourceRoot":""}
\n 
\n 
\n }\n