넛징 버블: 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 오프라인 넛징
|
// 인스트루먼트 섀시 하단 — 각인 스타일 상태 표시 + Ollama 오프라인 넛징
|
||||||
|
|
||||||
import { useState, useEffect } from 'react'
|
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 { Led } from './ds'
|
||||||
import { d3roPalette, d3roFontMono } from '../theme'
|
import { d3roPalette, d3roFontMono } from '../theme'
|
||||||
import { OllamaGuideModal } from './OllamaGuideModal'
|
import { OllamaGuideModal } from './OllamaGuideModal'
|
||||||
|
|
@ -30,11 +31,12 @@ export function StatusBar(): React.ReactElement {
|
||||||
|
|
||||||
const connected = llmStatus?.connectionState === 'connected'
|
const connected = llmStatus?.connectionState === 'connected'
|
||||||
|
|
||||||
// 오프라인 3초 후 넛징 버블 표시
|
// 오프라인 3초 후 넛징 버블 표시 → 10초 후 자동 숨김
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!connected) {
|
if (!connected) {
|
||||||
const timer = setTimeout(() => setShowNudge(true), 3000)
|
const showTimer = setTimeout(() => setShowNudge(true), 3000)
|
||||||
return () => clearTimeout(timer)
|
const hideTimer = setTimeout(() => setShowNudge(false), 13000)
|
||||||
|
return () => { clearTimeout(showTimer); clearTimeout(hideTimer) }
|
||||||
}
|
}
|
||||||
setShowNudge(false)
|
setShowNudge(false)
|
||||||
return undefined
|
return undefined
|
||||||
|
|
@ -86,9 +88,14 @@ export function StatusBar(): React.ReactElement {
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Typography sx={{ fontSize: '12px', color: d3roPalette.text.primary, mb: 0.5, fontWeight: 600 }}>
|
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
|
||||||
Ollama가 실행되지 않고 있어요
|
<Typography sx={{ fontSize: '12px', color: d3roPalette.text.primary, mb: 0.5, fontWeight: 600 }}>
|
||||||
</Typography>
|
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 }}>
|
<Typography sx={{ fontSize: '11px', color: d3roPalette.text.inactive, mb: 1 }}>
|
||||||
LLM 후처리(번역, 요약 등)를 사용하려면 Ollama가 필요합니다.
|
LLM 후처리(번역, 요약 등)를 사용하려면 Ollama가 필요합니다.
|
||||||
</Typography>
|
</Typography>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue