63 lines
2.1 KiB
TypeScript
63 lines
2.1 KiB
TypeScript
import React from 'react';
|
|
import { useInbox } from '../store.js';
|
|
import { Banner } from './Banner.js';
|
|
|
|
interface OllamaBannerProps {
|
|
onOpenSettings?: () => void;
|
|
}
|
|
|
|
export function OllamaBanner({ onOpenSettings }: OllamaBannerProps = {}): React.ReactElement | null {
|
|
const aiEnabled = useInbox((s) => s.ai_enabled);
|
|
const status = useInbox((s) => s.ollamaStatus);
|
|
const recheckOllama = useInbox((s) => s.recheckOllama);
|
|
// v0.2.9 Cut B Task 14 — AI-less mode 에서는 banner 자체 비활성.
|
|
if (!aiEnabled) return null;
|
|
if (status.ok) return null;
|
|
const isMissing = status.reason?.includes('not installed');
|
|
const message = isMissing
|
|
? '`ollama pull gemma4:e4b` 실행 후 앱을 재시작해주세요.'
|
|
: 'Inkling 정리가 잠시 멈췄습니다. Ollama를 실행해주세요.';
|
|
return (
|
|
<Banner severity="warning">
|
|
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
|
|
<div style={{ display: 'flex', alignItems: 'center', gap: 8, width: '100%' }}>
|
|
<span style={{ flex: 1 }}>⚠ {message}</span>
|
|
<button
|
|
onClick={() => {
|
|
recheckOllama().catch((e) => {
|
|
// eslint-disable-next-line no-console
|
|
console.warn('recheckOllama failed', e);
|
|
});
|
|
}}
|
|
style={{
|
|
background: 'transparent', color: '#946100',
|
|
border: '1px solid #d99500', borderRadius: 4,
|
|
padding: '2px 8px', fontSize: 12, cursor: 'pointer'
|
|
}}
|
|
>
|
|
재확인
|
|
</button>
|
|
{onOpenSettings && (
|
|
<button
|
|
onClick={onOpenSettings}
|
|
style={{
|
|
background: 'transparent', color: 'inherit',
|
|
border: '1px solid currentColor', borderRadius: 4,
|
|
padding: '2px 8px', fontSize: 12, cursor: 'pointer',
|
|
marginLeft: 6
|
|
}}
|
|
>
|
|
설정
|
|
</button>
|
|
)}
|
|
</div>
|
|
{status.reason ? (
|
|
<span style={{ fontSize: 11, opacity: 0.7, marginTop: 4 }}>
|
|
진단: {status.reason}
|
|
</span>
|
|
) : null}
|
|
</div>
|
|
</Banner>
|
|
);
|
|
}
|