┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐ │ Tauri Frontend │────▶│ Rust Backend │────▶│ Ollama API │ │ (React/Svelte) │ │ (Tauri Core) │ │ (Local LLM) │ └─────────────────┘ └─────────────────┘ └─────────────────┘ 

# Install Tauri CLI cargo install tauri-cli # Install Ollama curl -fsSL https://ollama.ai/install.sh | sh # Pull a model ollama pull llama3.2:3b 

# Create Tauri app cargo create-tauri-app ai-chat --template react-ts cd ai-chat # Add dependencies cargo add reqwest --features json,blocking cargo add serde --features derive cargo add tauri-plugin-shell --features process 

// src-tauri/src/ollama.rs use reqwest::blocking::Client; use serde::{Deserialize, Serialize}; use std::time::Duration; #[derive(Debug, Serialize, Deserialize)] pub struct ChatRequest { pub model: String, pub messages: Vec<Message>, pub stream: bool, #[serde(skip_serializing_if = "Option::is_none")] pub options: Option<ModelOptions>, } #[derive(Debug, Serialize, Deserialize)] pub struct Message { pub role: String, pub content: String, } #[derive(Debug, Serialize, Deserialize)] pub struct ModelOptions { pub temperature: Option<f32>, pub top_p: Option<f32>, pub num_predict: Option<i32>, } #[derive(Debug, Deserialize)] pub struct ChatResponse { pub message: Message, pub done: bool, } pub struct OllamaClient { client: Client, base_url: String, } impl OllamaClient { pub fn new(base_url: String) -> Self { Self { client: Client::builder() .timeout(Duration::from_secs(120)) .build() .unwrap(), base_url, } } pub fn chat(&self, request: ChatRequest) -> Result<ChatResponse, String> { let url = format!("{}/api/chat", self.base_url); let response = self.client .post(&url) .json(&request) .send() .map_err(|e| format!("Request failed: {}", e))?; if !response.status().is_success() { return Err(format!("API error: {}", response.status())); } response .json::<ChatResponse>() .map_err(|e| format!("Parse error: {}", e)) } pub fn list_models(&self) -> Result<Vec<String>, String> { let url = format!("{}/api/tags", self.base_url); let response = self.client.get(&url).send() .map_err(|e| format!("Request failed: {}", e))?; #[derive(Deserialize)] struct ModelsResponse { models: Vec<ModelInfo>, } #[derive(Deserialize)] struct ModelInfo { name: String, } response.json::<ModelsResponse>() .map(|r| r.models.into_iter().map(|m| m.name).collect()) .map_err(|e| format!("Parse error: {}", e)) } } 

// src-tauri/src/lib.rs use tauri::command; use crate::ollama::{OllamaClient, ChatRequest, Message}; #[command] fn chat(model: String, messages: Vec<Message>) -> Result<String, String> { let client = OllamaClient::new("http://localhost:11434".to_string()); let request = ChatRequest { model, messages, stream: false, options: Some(ModelOptions { temperature: Some(0.7), top_p: Some(0.9), num_predict: Some(512), }), }; let response = client.chat(request)?; Ok(response.message.content) } #[command] fn list_models() -> Result<Vec<String>, String> { let client = OllamaClient::new("http://localhost:11434".to_string()); client.list_models() } 

// src/components/Chat.tsx import { useState, useEffect } from 'react'; import { invoke } from '@tauri-apps/api/core'; interface Message { role: 'user' | 'assistant'; content: string; } export function Chat() { const [messages, setMessages] = useState<Message[]>([]); const [input, setInput] = useState(''); const [model, setModel] = useState('llama3.2:3b'); const [models, setModels] = useState<string[]>([]); const [loading, setLoading] = useState(false); useEffect(() => { loadModels(); }, []); async function loadModels() { try { const available = await invoke<string[]>('list_models'); setModels(available); if (available.length > 0 && !available.includes(model)) { setModel(available[0]); } } catch (e) { console.error('Failed to load models:', e); } } async function handleSend() { if (!input.trim() || loading) return; const userMessage: Message = { role: 'user', content: input }; setMessages(prev => [...prev, userMessage]); setInput(''); setLoading(true); try { const response = await invoke<string>('chat', { model, messages: [...messages, userMessage].map(m => ({ role: m.role, content: m.content })) }); setMessages(prev => [...prev, { role: 'assistant', content: response }]); } catch (e) { setMessages(prev => [...prev, { role: 'assistant', content: `Error: ${e}` }]); } finally { setLoading(false); } } return ( <div className="chat-container"> <div className="model-selector"> <select value={model} onChange={e => setModel(e.target.value)}> {models.map(m => <option key={m} value={m}>{m}</option>)} </select> </div> <div className="messages"> {messages.map((msg, i) => ( <div key={i} className={`message ${msg.role}`}> <strong>{msg.role === 'user' ? 'You' : 'AI'}:</strong> <p>{msg.content}</p> </div> ))} </div> <div className="input-area"> <input value={input} onChange={e => setInput(e.target.value)} onKeyDown={e => e.key === 'Enter' && !e.shiftKey && (e.preventDefault(), handleSend())} placeholder="Type a message..." disabled={loading} /> <button onClick={handleSend} disabled={loading || !input.trim()}> {loading ? 'Thinking...' : 'Send'} </button> </div> </div> ); } 

/* src/components/Chat.css */ .chat-container { display: flex; flex-direction: column; height: 100vh; max-width: 800px; margin: 0 auto; padding: 1rem; } .model-selector { padding: 0.5rem; border-bottom: 1px solid #eee; } .model-selector select { padding: 0.5rem; border-radius: 4px; border: 1px solid #ddd; } .messages { flex: 1; overflow-y: auto; padding: 1rem 0; display: flex; flex-direction: column; gap: 1rem; } .message { max-width: 85%; padding: 0.75rem 1rem; border-radius: 12px; line-height: 1.5; } .message.user { align-self: flex-end; background: #3b82f6; color: white; border-bottom-right-radius: 4px; } .message.assistant { align-self: flex-start; background: #f3f4f6; color: #1f2937; border-bottom-left-radius: 4px; } .input-area { display: flex; gap: 0.5rem; padding-top: 1rem; border-top: 1px solid #eee; } .input-area input { flex: 1; padding: 0.75rem 1rem; border: 1px solid #ddd; border-radius: 8px; font-size: 1rem; } .input-area button { padding: 0.75rem 1.5rem; background: #3b82f6; color: white; border: none; border-radius: 8px; cursor: pointer; font-weight: 500; } .input-area button:disabled { opacity: 0.6; cursor: not-allowed; } 

// src/App.tsx import { Chat } from './components/Chat'; import './components/Chat.css'; function App() { return ( <div className="app"> <header> <h1>🦙 Local AI Chat</h1> <p>Powered by Tauri + Ollama — 100% Private</p> </header> <Chat /> </div> ); } export default App; 

# Terminal 1: Start Ollama ollama serve # Terminal 2: Run Tauri dev cargo tauri dev 

# Build optimized release cargo tauri build # Output: src-tauri/target/release/bundle/ # - .msi (Windows) # - .dmg (macOS) # - .AppImage/.deb (Linux)