Hide landing page live update indicator
This commit is contained in:
@@ -701,7 +701,7 @@ button:disabled,
|
|||||||
|
|
||||||
.home-metric-strip {
|
.home-metric-strip {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||||
border: 1px solid var(--ops-line);
|
border: 1px solid var(--ops-line);
|
||||||
border-radius: var(--ops-radius-lg);
|
border-radius: var(--ops-radius-lg);
|
||||||
background: rgba(255, 255, 255, 0.02);
|
background: rgba(255, 255, 255, 0.02);
|
||||||
@@ -729,10 +729,6 @@ button:disabled,
|
|||||||
font-size: 1.15rem;
|
font-size: 1.15rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.home-metric-strip strong.is-live {
|
|
||||||
color: var(--ops-green);
|
|
||||||
}
|
|
||||||
|
|
||||||
.home-recent .recent-header {
|
.home-recent .recent-header {
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -64,7 +64,6 @@ export default function HomePage() {
|
|||||||
const [recentDays, setRecentDays] = useState(90)
|
const [recentDays, setRecentDays] = useState(90)
|
||||||
const [recentStage, setRecentStage] = useState('all')
|
const [recentStage, setRecentStage] = useState('all')
|
||||||
const [authReady, setAuthReady] = useState(false)
|
const [authReady, setAuthReady] = useState(false)
|
||||||
const [liveStreamConnected, setLiveStreamConnected] = useState(false)
|
|
||||||
|
|
||||||
const submit = (event: React.FormEvent) => {
|
const submit = (event: React.FormEvent) => {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
@@ -134,11 +133,9 @@ export default function HomePage() {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!authReady) {
|
if (!authReady) {
|
||||||
setLiveStreamConnected(false)
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (!getToken()) {
|
if (!getToken()) {
|
||||||
setLiveStreamConnected(false)
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const baseUrl = getApiBase()
|
const baseUrl = getApiBase()
|
||||||
@@ -159,14 +156,8 @@ export default function HomePage() {
|
|||||||
const streamUrl = `${baseUrl}/events/stream?${params.toString()}`
|
const streamUrl = `${baseUrl}/events/stream?${params.toString()}`
|
||||||
source = new EventSource(streamUrl)
|
source = new EventSource(streamUrl)
|
||||||
|
|
||||||
source.onopen = () => {
|
|
||||||
if (closed) return
|
|
||||||
setLiveStreamConnected(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
source.onmessage = (event) => {
|
source.onmessage = (event) => {
|
||||||
if (closed) return
|
if (closed) return
|
||||||
setLiveStreamConnected(true)
|
|
||||||
try {
|
try {
|
||||||
const payload = JSON.parse(event.data)
|
const payload = JSON.parse(event.data)
|
||||||
if (!payload || typeof payload !== 'object') {
|
if (!payload || typeof payload !== 'object') {
|
||||||
@@ -188,14 +179,9 @@ export default function HomePage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
source.onerror = () => {
|
|
||||||
if (closed) return
|
|
||||||
setLiveStreamConnected(false)
|
|
||||||
}
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (closed) return
|
if (closed) return
|
||||||
console.error(error)
|
console.error(error)
|
||||||
setLiveStreamConnected(false)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -203,7 +189,6 @@ export default function HomePage() {
|
|||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
closed = true
|
closed = true
|
||||||
setLiveStreamConnected(false)
|
|
||||||
source?.close()
|
source?.close()
|
||||||
}
|
}
|
||||||
}, [authReady, recentDays, recentStage])
|
}, [authReady, recentDays, recentStage])
|
||||||
@@ -329,7 +314,6 @@ export default function HomePage() {
|
|||||||
<div><span>In view</span><strong>{recent.length}</strong></div>
|
<div><span>In view</span><strong>{recent.length}</strong></div>
|
||||||
<div><span>In progress</span><strong>{activeRecentCount}</strong></div>
|
<div><span>In progress</span><strong>{activeRecentCount}</strong></div>
|
||||||
<div><span>Ready</span><strong>{readyRecentCount}</strong></div>
|
<div><span>Ready</span><strong>{readyRecentCount}</strong></div>
|
||||||
<div><span>Live updates</span><strong className={liveStreamConnected ? 'is-live' : ''}>{liveStreamConnected ? 'Connected' : 'Reconnecting'}</strong></div>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="recent home-recent">
|
<section className="recent home-recent">
|
||||||
|
|||||||
Reference in New Issue
Block a user