import React, { useEffect, useState } from 'react'
import { StaticImage } from 'gatsby-plugin-image'
const roomStateData = {
loading: { text: '...', color: 'white' },
open: { text: 'offen', color: '#00aa00' },
closed: { text: 'geschlossen', color: '#ee3333' },
error: { text: 'laut API kaputt', color: '#ee3333' },
}
function GetRightImage(openState) {
if(openState === 'loading') {
return
}
if(openState === 'open'){
return
}
if(openState === 'closed'){
return
}
if(openState === 'error'){
return
}
}
export default function RoomState() {
const [openState, setOpenState] = useState('loading')
useEffect(() => {
fetch('https://status.ctdo.de/api/simple/v2')
.then((response) => {
if (response.status >= 200 && response.status <= 299) {
return response
} else {
throw new Error()
}
})
.then((response) => response.json())
.then((json) => setOpenState(json.state ? 'open' : 'closed'))
.catch(() => setOpenState('error'))
}, [])
const isSSR = typeof window === 'undefined'
const useIMG = false
return (
{isSSR ? '' : useIMG ? GetRightImage(openState) : roomStateData[openState].text}
)
}