넛징 버블: 10초 자동 숨김 + X 닫기 버튼 추가
This commit is contained in:
parent
dc06a326b5
commit
39eb8b20fe
1 changed files with 14 additions and 7 deletions
|
|
@ -2,7 +2,8 @@
|
|||
// 인스트루먼트 섀시 하단 — 각인 스타일 상태 표시 + Ollama 오프라인 넛징
|
||||
|
||||
import { useState, useEffect } from 'react'
|
||||
import { Box, Typography, Fade } from '@mui/material'
|
||||
import { Box, Typography, Fade, IconButton } from '@mui/material'
|
||||
import CloseIcon from '@mui/icons-material/Close'
|
||||
import { Led } from './ds'
|
||||
import { d3roPalette, d3roFontMono } from '../theme'
|
||||
import { OllamaGuideModal } from './OllamaGuideModal'
|
||||
|
|
@ -30,11 +31,12 @@ export function StatusBar(): React.ReactElement {
|
|||
|
||||
const connected = llmStatus?.connectionState === 'connected'
|
||||
|
||||
// 오프라인 3초 후 넛징 버블 표시
|
||||
// 오프라인 3초 후 넛징 버블 표시 → 10초 후 자동 숨김
|
||||
useEffect(() => {
|
||||
if (!connected) {
|
||||
const timer = setTimeout(() => setShowNudge(true), 3000)
|
||||
return () => clearTimeout(timer)
|
||||
const showTimer = setTimeout(() => setShowNudge(true), 3000)
|
||||
const hideTimer = setTimeout(() => setShowNudge(false), 13000)
|
||||
return () => { clearTimeout(showTimer); clearTimeout(hideTimer) }
|
||||
}
|
||||
setShowNudge(false)
|
||||
return undefined
|
||||
|
|
@ -86,9 +88,14 @@ export function StatusBar(): React.ReactElement {
|
|||
},
|
||||
}}
|
||||
>
|
||||
<Typography sx={{ fontSize: '12px', color: d3roPalette.text.primary, mb: 0.5, fontWeight: 600 }}>
|
||||
Ollama가 실행되지 않고 있어요
|
||||
</Typography>
|
||||
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
|
||||
<Typography sx={{ fontSize: '12px', color: d3roPalette.text.primary, mb: 0.5, fontWeight: 600 }}>
|
||||
Ollama가 실행되지 않고 있어요
|
||||
</Typography>
|
||||
<IconButton size="small" onClick={() => setShowNudge(false)} sx={{ color: d3roPalette.text.inactive, p: 0, ml: 1 }}>
|
||||
<CloseIcon sx={{ fontSize: 14 }} />
|
||||
</IconButton>
|
||||
</Box>
|
||||
<Typography sx={{ fontSize: '11px', color: d3roPalette.text.inactive, mb: 1 }}>
|
||||
LLM 후처리(번역, 요약 등)를 사용하려면 Ollama가 필요합니다.
|
||||
</Typography>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue