Compare commits

..
10 Commits
59 changed files with 2066 additions and 545 deletions
+9 -7
View File
@@ -5,7 +5,7 @@ A local markdown note-taking app built with Tauri, SvelteKit, and Rust.
Your notes are stored as standard Markdown files on your local filesystem.
No cloud, no lock-in.
## Download (v1.1.5)
## Download (v1.1.8)
### Linux
@@ -23,19 +23,19 @@ curl -fsSL https://repo.arkhost.com/gpg.key | sudo gpg --dearmor -o /usr/share/k
#### AppImage (Arch, Fedora 43+, openSUSE Tumbleweed)
[Download AppImage](https://download.helixnotes.com/releases/v1.1.5/HelixNotes_1.1.5_amd64.AppImage)
[Download AppImage](https://download.helixnotes.com/releases/v1.1.8/HelixNotes_1.1.8_amd64.AppImage)
#### .deb (manual)
[Download .deb](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.5/HelixNotes_1.1.5_amd64.deb) — Ubuntu 22.04+
[Download .deb](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.8/HelixNotes_1.1.8_amd64.deb) — Ubuntu 22.04+
### Windows
[Download Installer](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.5/HelixNotes_1.1.5_x64-setup.exe) — Windows 10/11
[Download Installer](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.8/HelixNotes_1.1.8_x64-setup.exe) — Windows 10/11
### macOS
[Download .dmg](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.5/HelixNotes_1.1.5_x64.dmg) — macOS (Intel, runs on Apple Silicon via Rosetta)
[Download .dmg](https://codeberg.org/ArkHost/HelixNotes/releases/download/v1.1.8/HelixNotes_1.1.8_x64.dmg) — macOS (Intel, runs on Apple Silicon via Rosetta)
---
@@ -50,14 +50,16 @@ All releases: [codeberg.org/ArkHost/HelixNotes/releases](https://codeberg.org/Ar
- **Full-text search** powered by Tantivy
- **Math support** — KaTeX rendering for inline and block equations
- **Daily notes** — one-click button to create or open today's note
- **AI writing tools** — improve, summarize, translate, and more (Anthropic / OpenAI)
- **AI writing tools** — improve, summarize, translate, and more (Ollama / Anthropic / OpenAI)
- **Version history** — per-note snapshots with diff view
- **Backups** — automatic zip-based vault backups
- **PDF preview** — inline rendering of embedded PDFs
- **Tag management** — organize notes with tags, bulk edit from context menu
- **Drag-and-drop** — move notes between notebooks, reorganize notebooks by dragging
- **Obsidian import** — convert Obsidian wiki-links to standard markdown
- **Themes** — light/dark mode with customizable accent colors and fonts
- **Multi-window** — open notes in separate windows (right-click → "Open in New Window")
- **File associations** — open .md files from your file manager directly in HelixNotes
- **Themes** — light/dark mode with customizable accent colors, fonts, and line height
- **Focus mode** — distraction-free writing
- **View mode** — read-only toggle for distraction-free reading
- **Local** — everything stays on your machine
+1 -1
View File
@@ -2,7 +2,7 @@
"name": "helixnotes",
"private": true,
"license": "AGPL-3.0-or-later",
"version": "1.1.6",
"version": "1.1.9",
"type": "module",
"scripts": {
"dev": "vite dev",
+382 -109
View File
File diff suppressed because it is too large Load Diff
+3 -2
View File
@@ -1,6 +1,6 @@
[package]
name = "helixnotes"
version = "1.1.6"
version = "1.1.9"
description = "Local markdown note-taking app"
authors = ["HelixNotes"]
license = "AGPL-3.0-or-later"
@@ -38,7 +38,8 @@ reqwest = { version = "0.12", default-features = false, features = ["json", "str
futures = "0.3"
rayon = "1"
rustls = { version = "0.23", default-features = false, features = ["ring", "logging", "std", "tls12"] }
[target.'cfg(not(target_os = "android"))'.dependencies]
tauri-plugin-updater = "2"
tauri-plugin-single-instance = "2"
arboard = { version = "3", features = ["image-data", "wayland-data-control"] }
png = "0.17"
Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.3 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 953 B

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.4 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 793 B

After

Width:  |  Height:  |  Size: 1023 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 183 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 735 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

+52 -21
View File
@@ -6,6 +6,7 @@ use crate::types::AiStreamEvent;
const ANTHROPIC_API_URL: &str = "https://api.anthropic.com/v1/messages";
const OPENAI_API_URL: &str = "https://api.openai.com/v1/chat/completions";
const OLLAMA_DEFAULT_URL: &str = "http://localhost:11434";
pub fn ai_request(
app: AppHandle,
@@ -15,6 +16,7 @@ pub fn ai_request(
system_prompt: String,
user_message: String,
request_id: String,
base_url: Option<String>,
) {
std::thread::spawn(move || {
let rt = tokio::runtime::Runtime::new().unwrap();
@@ -23,7 +25,22 @@ pub fn ai_request(
"openai" => {
stream_openai(
&app,
&api_key,
OPENAI_API_URL,
Some(&api_key),
&model,
&system_prompt,
&user_message,
&request_id,
)
.await
}
"ollama" => {
let url = base_url.as_deref().unwrap_or(OLLAMA_DEFAULT_URL);
let url = format!("{}/v1/chat/completions", url.trim_end_matches('/'));
stream_openai(
&app,
&url,
None,
&model,
&system_prompt,
&user_message,
@@ -188,7 +205,8 @@ async fn stream_anthropic(
async fn stream_openai(
app: &AppHandle,
api_key: &str,
url: &str,
api_key: Option<&str>,
model: &str,
system_prompt: &str,
user_message: &str,
@@ -224,10 +242,15 @@ async fn stream_openai(
body["temperature"] = json!(0.7);
}
let response = client
.post(OPENAI_API_URL)
.header("Authorization", format!("Bearer {}", api_key))
.header("content-type", "application/json")
let mut req = client
.post(url)
.header("content-type", "application/json");
if let Some(key) = api_key {
req = req.header("Authorization", format!("Bearer {}", key));
}
let response = req
.json(&body)
.send()
.await
@@ -325,9 +348,19 @@ async fn stream_openai(
Ok(())
}
pub async fn test_connection(provider: &str, api_key: &str, model: &str) -> Result<String, String> {
pub async fn test_connection(
provider: &str,
api_key: &str,
model: &str,
base_url: Option<&str>,
) -> Result<String, String> {
match provider {
"openai" => test_openai(api_key, model).await,
"openai" => test_openai(OPENAI_API_URL, Some(api_key), model).await,
"ollama" => {
let url = base_url.unwrap_or(OLLAMA_DEFAULT_URL);
let url = format!("{}/v1/chat/completions", url.trim_end_matches('/'));
test_openai(&url, None, model).await
}
_ => test_anthropic(api_key, model).await,
}
}
@@ -365,19 +398,12 @@ async fn test_anthropic(api_key: &str, model: &str) -> Result<String, String> {
}
}
async fn test_openai(api_key: &str, model: &str) -> Result<String, String> {
async fn test_openai(url: &str, api_key: Option<&str>, model: &str) -> Result<String, String> {
let client = Client::new();
let is_gpt5 = model.starts_with("gpt-5");
let token_key = if is_gpt5 {
"max_completion_tokens"
} else {
"max_tokens"
};
let body = json!({
"model": model,
token_key: 10,
"max_tokens": 10,
"messages": [
{
"role": "user",
@@ -386,10 +412,15 @@ async fn test_openai(api_key: &str, model: &str) -> Result<String, String> {
]
});
let response = client
.post(OPENAI_API_URL)
.header("Authorization", format!("Bearer {}", api_key))
.header("content-type", "application/json")
let mut req = client
.post(url)
.header("content-type", "application/json");
if let Some(key) = api_key {
req = req.header("Authorization", format!("Bearer {}", key));
}
let response = req
.json(&body)
.send()
.await
+79 -15
View File
@@ -11,9 +11,21 @@ use tauri::{AppHandle, Manager, State};
pub fn open_vault(app: AppHandle, state: State<'_, AppState>, path: String) -> Result<(), String> {
operations::ensure_vault_structure(&path)?;
// Initialize search index
let search = SearchIndex::new(&path)?;
search.rebuild(&path)?;
// Initialize search index — rebuild in background on Android (FUSE is slow)
let search = std::sync::Arc::new(SearchIndex::new(&path)?);
#[cfg(target_os = "android")]
{
let search_bg = search.clone();
let vault = path.clone();
std::thread::spawn(move || {
let _ = search_bg.rebuild(&vault);
log::info!("Android: search index rebuild complete");
});
}
#[cfg(not(target_os = "android"))]
{
search.rebuild(&path)?;
}
*state.search_index.lock().map_err(|e| e.to_string())? = Some(search);
// Start file watcher
@@ -462,6 +474,41 @@ pub fn save_vault_state(state: State<'_, AppState>, vault_state: VaultState) ->
operations::save_vault_state(vault_path, &vault_state)
}
// ── Clipboard ──
/// Read image from system clipboard (bypasses WebKitGTK clipboard bug).
/// Returns PNG bytes as Vec<u8>, or error if no image on clipboard.
#[cfg(not(target_os = "android"))]
#[tauri::command]
pub fn read_clipboard_image() -> Result<Vec<u8>, String> {
let mut clipboard =
arboard::Clipboard::new().map_err(|e| format!("Clipboard init failed: {}", e))?;
let img = clipboard
.get_image()
.map_err(|_| "No image on clipboard".to_string())?;
// Encode RGBA data to PNG
let mut buf: Vec<u8> = Vec::new();
{
let mut encoder =
png::Encoder::new(std::io::Cursor::new(&mut buf), img.width as u32, img.height as u32);
encoder.set_color(png::ColorType::Rgba);
encoder.set_depth(png::BitDepth::Eight);
let mut writer = encoder
.write_header()
.map_err(|e| format!("PNG header failed: {}", e))?;
writer
.write_image_data(&img.bytes)
.map_err(|e| format!("PNG encode failed: {}", e))?;
}
Ok(buf)
}
#[cfg(target_os = "android")]
#[tauri::command]
pub fn read_clipboard_image() -> Result<Vec<u8>, String> {
Err("Clipboard image reading not supported on Android".to_string())
}
// ── Attachments ──
#[tauri::command]
@@ -1334,11 +1381,13 @@ pub fn set_ai_settings(
api_key: Option<String>,
model: String,
writing_style: Option<String>,
base_url: Option<String>,
) -> Result<(), String> {
let mut config = state.config.lock().map_err(|e| e.to_string())?;
let key = api_key.filter(|k| !k.is_empty());
match provider.as_deref() {
Some("openai") => config.openai_api_key = key,
Some("ollama") => config.ollama_base_url = base_url.filter(|u| !u.trim().is_empty()),
_ => config.ai_api_key = key,
}
config.ai_provider = provider;
@@ -1350,27 +1399,36 @@ pub fn set_ai_settings(
#[tauri::command]
pub fn test_ai_connection(app: AppHandle) -> Result<(), String> {
let (provider, api_key, model) = {
let (provider, api_key, model, base_url) = {
let state = app.state::<AppState>();
let config = state.config.lock().map_err(|e| e.to_string())?;
let provider = config
.ai_provider
.clone()
.unwrap_or_else(|| "anthropic".to_string());
let key = if provider == "openai" {
let key = if provider == "ollama" {
// Ollama doesn't require an API key
Some(String::new())
} else if provider == "openai" {
config.openai_api_key.clone()
} else {
config.ai_api_key.clone()
}
.ok_or("No API key configured")?;
let model = config.ai_model.clone();
(provider, key, model)
let base_url = config.ollama_base_url.clone();
(provider, key, model, base_url)
};
std::thread::spawn(move || {
use tauri::Emitter;
let rt = tokio::runtime::Runtime::new().unwrap();
let result = rt.block_on(crate::ai::test_connection(&provider, &api_key, &model));
let result = rt.block_on(crate::ai::test_connection(
&provider,
&api_key,
&model,
base_url.as_deref(),
));
match result {
Ok(msg) => {
let _ = app.emit(
@@ -1397,14 +1455,16 @@ pub fn ai_ask(
custom_prompt: Option<String>,
request_id: String,
) -> Result<(), String> {
let (provider, api_key, model, writing_style) = {
let (provider, api_key, model, writing_style, base_url) = {
let state = app.state::<AppState>();
let config = state.config.lock().map_err(|e| e.to_string())?;
let provider = config
.ai_provider
.clone()
.unwrap_or_else(|| "anthropic".to_string());
let key = if provider == "openai" {
let key = if provider == "ollama" {
Some(String::new())
} else if provider == "openai" {
config.openai_api_key.clone()
} else {
config.ai_api_key.clone()
@@ -1412,7 +1472,8 @@ pub fn ai_ask(
.ok_or("No API key configured. Go to Settings > AI to set up your API key.")?;
let model = config.ai_model.clone();
let style = config.ai_writing_style.clone();
(provider, key, model, style)
let base_url = config.ollama_base_url.clone();
(provider, key, model, style, base_url)
};
let mut system_prompt = "You are a helpful writing assistant inside a note-taking app called HelixNotes. \
@@ -1458,6 +1519,7 @@ pub fn ai_ask(
system_prompt,
user_message,
request_id,
base_url,
);
Ok(())
}
@@ -1508,11 +1570,13 @@ pub fn get_install_type() -> String {
} else if std::path::Path::new("/var/lib/dpkg/info/helix-notes.list").exists() {
"deb".to_string()
} else if std::path::Path::new("/var/lib/pacman/local").exists()
&& std::process::Command::new("pacman")
.args(["-Q", "helixnotes"])
.output()
.map(|o| o.status.success())
.unwrap_or(false)
&& ["helixnotes", "helixnotes-bin", "helixnotes-appimage-bin"].iter().any(|pkg| {
std::process::Command::new("pacman")
.args(["-Q", pkg])
.output()
.map(|o| o.status.success())
.unwrap_or(false)
})
{
"aur".to_string()
} else if std::env::var("APPIMAGE").is_ok() {
+7 -1
View File
@@ -44,7 +44,7 @@ pub fn run() {
)?;
}
// On Android, set config dir from Tauri's path resolver
// On Android, set config dir from Tauri's path resolver, then reload config
#[cfg(target_os = "android")]
{
if let Ok(config_dir) = app.path().config_dir() {
@@ -52,6 +52,11 @@ pub fn run() {
} else if let Ok(data_dir) = app.path().data_dir() {
commands::set_android_config_dir(data_dir);
}
// Reload config now that the Android config dir is available
let reloaded = commands::load_app_config();
let _ = app.state::<AppState>().config.lock().map(|mut cfg| {
*cfg = reloaded;
});
}
#[cfg(not(target_os = "android"))]
@@ -115,6 +120,7 @@ pub fn run() {
commands::empty_trash,
commands::load_vault_state,
commands::save_vault_state,
commands::read_clipboard_image,
commands::save_image,
commands::save_attachment,
commands::get_notebook_icons,
+7 -5
View File
@@ -77,18 +77,20 @@ impl SearchIndex {
for entry in WalkDir::new(vault_path)
.into_iter()
.filter_map(|e| e.ok())
.filter(|e| {
.filter_entry(|e| {
let p = e.path();
p.is_file()
&& p.extension().and_then(|x| x.to_str()) == Some("md")
&& !p.starts_with(&hn_dir)
!p.starts_with(&hn_dir)
&& !p
.file_name()
.and_then(|n| n.to_str())
.map(|n| n.starts_with('.'))
.unwrap_or(false)
})
.filter_map(|e| e.ok())
.filter(|e| {
e.file_type().is_file()
&& e.path().extension().and_then(|x| x.to_str()) == Some("md")
})
{
if let Ok(raw) = fs::read_to_string(entry.path()) {
let filename = entry.file_name().to_string_lossy().to_string();
+2 -1
View File
@@ -3,10 +3,11 @@ use crate::types::AppConfig;
use notify::RecommendedWatcher;
use std::sync::atomic::AtomicBool;
use std::sync::Mutex;
use std::sync::Arc;
pub struct AppState {
pub config: Mutex<AppConfig>,
pub search_index: Mutex<Option<SearchIndex>>,
pub search_index: Mutex<Option<Arc<SearchIndex>>>,
pub watcher: Mutex<Option<RecommendedWatcher>>,
pub importing: AtomicBool,
pub pending_open_file: Mutex<Option<String>>,
+5 -2
View File
@@ -93,6 +93,8 @@ pub struct AppConfig {
pub ai_api_key: Option<String>,
#[serde(default)]
pub openai_api_key: Option<String>,
#[serde(default)]
pub ollama_base_url: Option<String>,
#[serde(default = "default_ai_model")]
pub ai_model: String,
#[serde(default)]
@@ -132,7 +134,7 @@ fn default_max_versions() -> u32 {
}
fn default_ai_model() -> String {
"claude-sonnet-4-5-20250929".to_string()
"claude-sonnet-4-6".to_string()
}
impl Default for AppConfig {
@@ -164,7 +166,8 @@ impl Default for AppConfig {
ai_provider: None,
ai_api_key: None,
openai_api_key: None,
ai_model: "claude-sonnet-4-5-20250929".to_string(),
ollama_base_url: None,
ai_model: "claude-sonnet-4-6".to_string(),
ai_writing_style: None,
default_view_mode: false,
show_tray_icon: false,
+176 -41
View File
@@ -59,11 +59,11 @@ fn scan_dir_recursive(dir: &Path, vault_root: &str) -> Vec<NotebookEntry> {
return entries;
};
// Collect subdirs (root level only lists directories, note counts come from scan_dir_with_count)
let mut dirs: Vec<_> = read_dir
.filter_map(|e| e.ok())
.filter(|e| {
let path = e.path();
path.is_dir() && !is_hidden(&path)
e.file_type().map(|ft| ft.is_dir()).unwrap_or(false) && !is_hidden(&e.path())
})
.collect();
@@ -74,6 +74,8 @@ fn scan_dir_recursive(dir: &Path, vault_root: &str) -> Vec<NotebookEntry> {
.cmp(&b.file_name().to_string_lossy().to_lowercase())
});
// Store note_count for the parent directory (used when this is the top-level call)
// Each directory pushes its own entry with its own note_count
for dir_entry in dirs {
let path = dir_entry.path();
let name = dir_entry.file_name().to_string_lossy().to_string();
@@ -83,32 +85,71 @@ fn scan_dir_recursive(dir: &Path, vault_root: &str) -> Vec<NotebookEntry> {
.to_string_lossy()
.to_string();
let children = scan_dir_recursive(&path, vault_root);
let note_count = count_notes_in_dir(&path);
let (children, child_note_count) = scan_dir_with_count(&path, vault_root);
entries.push(NotebookEntry {
name,
path: path.to_string_lossy().to_string(),
relative_path: relative,
children,
note_count,
note_count: child_note_count,
});
}
entries
}
fn count_notes_in_dir(dir: &Path) -> usize {
fs::read_dir(dir)
.map(|rd| {
rd.filter_map(|e| e.ok())
.filter(|e| {
let path = e.path();
path.is_file() && path.extension().and_then(|x| x.to_str()) == Some("md")
})
.count()
})
.unwrap_or(0)
/// Combined scan: returns (children, note_count) in a single read_dir pass.
fn scan_dir_with_count(dir: &Path, vault_root: &str) -> (Vec<NotebookEntry>, usize) {
let root = Path::new(vault_root);
let Ok(read_dir) = fs::read_dir(dir) else {
return (Vec::new(), 0);
};
let mut subdirs = Vec::new();
let mut note_count = 0usize;
for entry in read_dir.filter_map(|e| e.ok()) {
let ft = match entry.file_type() {
Ok(ft) => ft,
Err(_) => continue,
};
if ft.is_dir() && !is_hidden(&entry.path()) {
subdirs.push(entry);
} else if ft.is_file() && entry.path().extension().and_then(|x| x.to_str()) == Some("md") {
note_count += 1;
}
}
subdirs.sort_by(|a, b| {
a.file_name()
.to_string_lossy()
.to_lowercase()
.cmp(&b.file_name().to_string_lossy().to_lowercase())
});
let mut entries = Vec::new();
for dir_entry in subdirs {
let path = dir_entry.path();
let name = dir_entry.file_name().to_string_lossy().to_string();
let relative = path
.strip_prefix(root)
.unwrap_or(&path)
.to_string_lossy()
.to_string();
let (children, child_note_count) = scan_dir_with_count(&path, vault_root);
entries.push(NotebookEntry {
name,
path: path.to_string_lossy().to_string(),
relative_path: relative,
children,
note_count: child_note_count,
});
}
(entries, note_count)
}
fn is_hidden(path: &Path) -> bool {
@@ -129,37 +170,88 @@ pub fn scan_notes(vault_path: &str, notebook_path: Option<&str>) -> Result<Vec<N
let root = Path::new(scan_path);
let vault_root = Path::new(vault_path);
log::info!("scan_notes: vault={}, scan={}, exists={}", vault_path, scan_path, root.exists());
if !root.exists() {
return Err("Path does not exist".to_string());
}
let md_files: Vec<PathBuf> = if notebook_path.is_some() {
// Only direct children for a specific notebook
fs::read_dir(root)
.map_err(|e| e.to_string())?
.filter_map(|e| e.ok())
.map(|e| e.path())
.filter(|p| p.is_file() && p.extension().and_then(|x| x.to_str()) == Some("md"))
.collect()
} else {
// Recursive for "All Notes"
WalkDir::new(root)
.into_iter()
.filter_map(|e| e.ok())
.filter(|e| !is_hidden(e.path()) && !e.path().starts_with(&helixnotes_dir(vault_path)))
.map(|e| e.path().to_path_buf())
.filter(|p| p.is_file() && p.extension().and_then(|x| x.to_str()) == Some("md"))
.collect()
};
// On Android, use metadata-only scan (no file reads) for fast listing on FUSE
#[cfg(target_os = "android")]
{
let mut notes = Vec::new();
// Log what read_dir sees
if let Ok(rd) = fs::read_dir(root) {
let items: Vec<_> = rd.filter_map(|e| e.ok()).collect();
log::info!("scan_notes: read_dir found {} entries in {:?}", items.len(), root);
for (i, entry) in items.iter().enumerate().take(5) {
let ft = entry.file_type().map(|ft| if ft.is_file() { "file" } else if ft.is_dir() { "dir" } else { "other" }).unwrap_or("err");
log::info!(" [{}] {:?} type={}", i, entry.file_name(), ft);
}
} else {
log::info!("scan_notes: read_dir FAILED for {:?}", root);
}
// Process files in parallel with partial reads
let mut notes: Vec<NoteEntry> = md_files
.par_iter()
.filter_map(|path| read_note_entry_fast(path, vault_root).ok())
.collect();
if notebook_path.is_some() {
if let Ok(rd) = fs::read_dir(root) {
for entry in rd.filter_map(|e| e.ok()) {
let is_file = entry.file_type().map(|ft| ft.is_file()).unwrap_or(false);
if is_file && entry.path().extension().and_then(|x| x.to_str()) == Some("md") {
if let Ok(note) = read_note_entry_metadata_only(&entry.path(), vault_root) {
notes.push(note);
}
}
}
}
} else {
let hn_dir = helixnotes_dir(vault_path);
for entry in WalkDir::new(root)
.into_iter()
// filter_entry skips descending into hidden dirs (unlike filter)
.filter_entry(|e| !is_hidden(e.path()) && !e.path().starts_with(&hn_dir))
.filter_map(|e| e.ok())
.filter(|e| {
e.file_type().is_file()
&& e.path().extension().and_then(|x| x.to_str()) == Some("md")
})
{
if let Ok(note) = read_note_entry_metadata_only(entry.path(), vault_root) {
notes.push(note);
}
}
}
log::info!("scan_notes: Android scan found {} notes", notes.len());
notes.sort_by(|a, b| b.meta.modified.cmp(&a.meta.modified));
return Ok(notes);
}
notes.sort_by(|a, b| b.meta.modified.cmp(&a.meta.modified));
Ok(notes)
#[cfg(not(target_os = "android"))]
{
let md_files: Vec<PathBuf> = if notebook_path.is_some() {
fs::read_dir(root)
.map_err(|e| e.to_string())?
.filter_map(|e| e.ok())
.map(|e| e.path())
.filter(|p| p.is_file() && p.extension().and_then(|x| x.to_str()) == Some("md"))
.collect()
} else {
WalkDir::new(root)
.into_iter()
.filter_entry(|e| !is_hidden(e.path()) && !e.path().starts_with(&helixnotes_dir(vault_path)))
.filter_map(|e| e.ok())
.map(|e| e.path().to_path_buf())
.filter(|p| p.is_file() && p.extension().and_then(|x| x.to_str()) == Some("md"))
.collect()
};
let mut notes: Vec<NoteEntry> = md_files
.par_iter()
.filter_map(|path| read_note_entry_fast(path, vault_root).ok())
.collect();
notes.sort_by(|a, b| b.meta.modified.cmp(&a.meta.modified));
Ok(notes)
}
}
fn read_note_entry(path: &Path, vault_root: &Path) -> Result<NoteEntry, String> {
@@ -167,6 +259,49 @@ fn read_note_entry(path: &Path, vault_root: &Path) -> Result<NoteEntry, String>
read_note_entry_from_str(&raw, path, vault_root)
}
/// Android-only: reads just the frontmatter (first 2KB) for tags/title/pinned,
/// uses filesystem timestamps for dates. No preview text.
#[cfg(target_os = "android")]
fn read_note_entry_metadata_only(path: &Path, vault_root: &Path) -> Result<NoteEntry, String> {
// Read first 2KB — enough for frontmatter with tags, title, pinned
let mut file = fs::File::open(path).map_err(|e| e.to_string())?;
let mut buf = vec![0u8; 2048];
let bytes_read = file.read(&mut buf).map_err(|e| e.to_string())?;
buf.truncate(bytes_read);
let raw = String::from_utf8_lossy(&buf);
let filename = path
.file_name()
.unwrap_or_default()
.to_string_lossy()
.to_string();
let (mut meta, _content) = frontmatter::parse_note(&raw, &filename);
// Always use filesystem timestamps on Android (faster than parsing date strings)
if let Ok(fs_meta) = fs::metadata(path) {
if let Ok(m) = fs_meta.modified() {
meta.modified = m.into();
}
if let Ok(c) = fs_meta.created() {
meta.created = c.into();
}
}
let relative = path
.strip_prefix(vault_root)
.unwrap_or(path)
.to_string_lossy()
.to_string();
Ok(NoteEntry {
path: path.to_string_lossy().to_string(),
relative_path: relative,
meta,
preview: String::new(),
})
}
/// Fast version: reads only the first ~2KB of the file (enough for frontmatter + preview).
fn read_note_entry_fast(path: &Path, vault_root: &Path) -> Result<NoteEntry, String> {
let mut file = fs::File::open(path).map_err(|e| e.to_string())?;
+1 -1
View File
@@ -1,7 +1,7 @@
{
"$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
"productName": "HelixNotes",
"version": "1.1.6",
"version": "1.1.9",
"identifier": "com.helixnotes.app",
"build": {
"frontendDist": "../build",
+6 -1
View File
@@ -164,6 +164,10 @@ export async function saveVaultState(vaultState: VaultState): Promise<void> {
return invoke("save_vault_state", { vaultState });
}
export async function readClipboardImage(): Promise<number[]> {
return invoke("read_clipboard_image");
}
export async function saveImage(name: string, data: number[]): Promise<string> {
return invoke("save_image", { name, data });
}
@@ -314,8 +318,9 @@ export async function setAiSettings(
apiKey: string | null,
model: string,
writingStyle: string | null,
baseUrl: string | null = null,
): Promise<void> {
return invoke("set_ai_settings", { provider, apiKey, model, writingStyle });
return invoke("set_ai_settings", { provider, apiKey, model, writingStyle, baseUrl });
}
export async function testAiConnection(): Promise<void> {
+207 -105
View File
@@ -29,13 +29,18 @@
showSettings,
sourceMode,
mobileView,
appConfig
appConfig,
quickAccessPaths,
tags,
notes,
updateAvailable as globalUpdateAvailable,
settingsTab
} from '$lib/stores/app';
const appWindow = getCurrentWindow();
const isMac = navigator.platform.startsWith('Mac');
const isMobile = /android|ios/i.test(navigator.userAgent);
import { loadVaultState, saveVaultState, readNote, createDailyNote, createBackup, getPendingOpenFile } from '$lib/api';
import { loadVaultState, saveVaultState, readNote, createDailyNote, createBackup, getPendingOpenFile, addQuickAccess, removeQuickAccess, getQuickAccess } from '$lib/api';
import { debounce } from '$lib/utils/debounce';
import { openNoteWindow } from '$lib/utils/window';
import { get } from 'svelte/store';
@@ -46,7 +51,12 @@
let editor: Editor;
let unlistenFileChange: (() => void) | null = null;
let unlistenOpenFile: (() => void) | null = null;
// Mobile editor header helpers
let noteRelativePath = $derived($activeNotePath && $appConfig?.active_vault ? $activeNotePath.replace($appConfig.active_vault + '/', '') : '');
let isQuickAccess = $derived(noteRelativePath ? $quickAccessPaths.includes(noteRelativePath) : false);
let backupInterval: ReturnType<typeof setInterval> | null = null;
let navigatingFromHistory = false;
let noteHistory: string[] = [];
let noteHistoryIndex = -1;
@@ -98,6 +108,7 @@
noteHistoryIndex = newIndex;
navigatingFromHistory = true;
readNote(path).then((content) => {
editor?.flushSave();
$activeNote = content;
$activeNotePath = path;
$editorDirty = false;
@@ -114,6 +125,7 @@
if (!vaultRoot || !filePath.startsWith(vaultRoot)) return;
try {
const content = await readNote(filePath);
editor?.flushSave();
$activeNote = content;
$activeNotePath = filePath;
$editorDirty = false;
@@ -125,7 +137,7 @@
const persistState = debounce(async () => {
const state: VaultState = {
last_open_note: null,
last_open_note: $activeNotePath,
sidebar_width: $sidebarWidth,
notelist_width: $notelistWidth,
sidebar_collapsed: $sidebarCollapsed,
@@ -152,12 +164,11 @@
}
function handleViewChanged() {
noteList?.refresh(true);
noteList?.refresh();
if (isMobile) $mobileView = 'notelist';
}
async function createAndFocusNote() {
if (isMobile && $mobileView !== 'notelist') $mobileView = 'notelist';
await noteList?.handleCreateNote();
editor?.focusTitle();
if (isMobile) $mobileView = 'editor';
@@ -167,6 +178,7 @@
try {
const entry = await createDailyNote();
const content = await readNote(entry.path);
editor?.flushSave();
$activeNote = content;
$activeNotePath = entry.path;
$editorDirty = false;
@@ -179,6 +191,38 @@
}
}
// Android back gesture / hardware back button support
let mobileNavFromPopstate = false;
if (isMobile) {
// Seed initial history state
history.replaceState({ mobileView: 'sidebar' }, '');
// When mobileView changes forward, push browser history so Android back gesture works
$effect(() => {
const view = $mobileView;
if (mobileNavFromPopstate) {
mobileNavFromPopstate = false;
return;
}
// Replace state to track current view
history.pushState({ mobileView: view }, '');
});
window.addEventListener('popstate', (e) => {
const currentView = $mobileView;
if (currentView === 'sidebar') {
// Already at root — let Android handle it (exit app)
return;
}
mobileNavFromPopstate = true;
if (currentView === 'editor') $mobileView = 'notelist';
else if (currentView === 'notelist') $mobileView = 'sidebar';
// Push state again so next back gesture also works
history.pushState({ mobileView: $mobileView }, '');
});
}
function mobileBack() {
if ($mobileView === 'editor') $mobileView = 'notelist';
else if ($mobileView === 'notelist') $mobileView = 'sidebar';
@@ -270,28 +314,84 @@
persistState();
});
$effect(() => {
$activeNotePath;
persistState();
});
onMount(async () => {
let lastNotePath: string | null = null;
try {
const state = await loadVaultState();
$sidebarWidth = state.sidebar_width;
$notelistWidth = state.notelist_width;
$sidebarCollapsed = state.sidebar_collapsed;
$collapsedNotebooks = state.collapsed_notebooks ?? [];
lastNotePath = state.last_open_note ?? null;
} catch (_) {}
// On mobile, prefetch last-opened note so first tap is instant
let prefetchPromise: Promise<any> | null = null;
if (isMobile && lastNotePath) {
prefetchPromise = readNote(lastNotePath).catch(() => null);
}
applyTheme($theme);
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
if ($theme === 'system') applyTheme('system');
});
await sidebar?.refresh();
await noteList?.refresh();
// Run sidebar and note list refresh in parallel
await Promise.all([sidebar?.refresh(), noteList?.refresh()]);
unlistenFileChange = await listen<FileEvent>('file-changed', async () => {
await sidebar?.refresh();
await noteList?.refresh(true);
});
// On mobile, derive tags from the scanned notes (avoids a separate full-scan Rust call)
if (isMobile) {
const tagMap = new Map<string, number>();
for (const note of $notes) {
for (const tag of note.meta.tags) {
tagMap.set(tag, (tagMap.get(tag) ?? 0) + 1);
}
}
$tags = Array.from(tagMap.entries()).sort((a, b) => a[0].localeCompare(b[0]));
}
// On mobile, auto-load the last-opened note so it's ready when the user taps it
if (isMobile && prefetchPromise) {
prefetchPromise.then((noteContent) => {
if (noteContent && lastNotePath && !$activeNotePath) {
$activeNote = noteContent;
$activeNotePath = lastNotePath;
$editorDirty = false;
editor?.loadNote(lastNotePath, noteContent.content);
}
});
}
if (isMobile) {
// Mobile: debounce file-changed heavily and skip when actively editing
// (our own saves trigger the watcher, causing expensive refreshes on FUSE)
const debouncedRefresh = debounce(async () => {
if (get(editorDirty)) return; // user is still typing, skip
await Promise.all([sidebar?.refresh(), noteList?.refresh(true)]);
// Re-derive tags from refreshed notes
const tagMap = new Map<string, number>();
for (const note of get(notes)) {
for (const tag of note.meta.tags) {
tagMap.set(tag, (tagMap.get(tag) ?? 0) + 1);
}
}
tags.set(Array.from(tagMap.entries()).sort((a, b) => a[0].localeCompare(b[0])));
}, 3000);
unlistenFileChange = await listen<FileEvent>('file-changed', () => {
debouncedRefresh();
});
} else {
unlistenFileChange = await listen<FileEvent>('file-changed', async () => {
await sidebar?.refresh();
await noteList?.refresh(true);
});
}
// Listen for file open events (from single-instance or OS file associations)
unlistenOpenFile = await listen<string>('open-file', async (event) => {
@@ -340,18 +440,23 @@
</svg>
</div>
{/if}
<span class="mobile-header-title">
{#if $mobileView === 'sidebar'}
HelixNotes
{:else if $mobileView === 'notelist'}
{$activeNotebook?.name || 'All Notes'}
{:else}
{$activeNote?.meta.title || 'Untitled'}
{#if $mobileView !== 'editor'}
<span class="mobile-header-title">
{#if $mobileView === 'sidebar'}
HelixNotes
{:else}
{$activeNotebook?.name || 'All Notes'}
{/if}
</span>
{#if $globalUpdateAvailable && $mobileView === 'sidebar'}
<button class="mobile-update-badge" onclick={() => { $settingsTab = 'updates'; $showSettings = true; }}>
v{$globalUpdateAvailable.version}
</button>
{/if}
</span>
{/if}
<div class="mobile-header-actions">
{#if $mobileView === 'editor'}
<button class="mobile-header-btn" class:active={$readOnly} onclick={() => ($readOnly = !$readOnly)}>
<button class="mobile-header-btn" class:active={$readOnly} onclick={() => ($readOnly = !$readOnly)} title={$readOnly ? 'Edit' : 'View'}>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
{#if $readOnly}
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />
@@ -362,26 +467,76 @@
{/if}
</svg>
</button>
<button class="mobile-header-btn" class:active={$sourceMode} onclick={() => ($sourceMode = !$sourceMode)} title={$sourceMode ? 'Rich Editor' : 'Source Mode'}>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="16 18 22 12 16 6" /><polyline points="8 6 2 12 8 18" />
</svg>
</button>
<button class="mobile-header-btn" onclick={() => editor?.openNoteSearch()} title="Find in note">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>
</svg>
</button>
<button class="mobile-header-btn" class:active={$activeNote?.meta.pinned} onclick={() => { if ($activeNote) { $activeNote.meta.pinned = !$activeNote.meta.pinned; $editorDirty = true; } }} title="Pin">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 17v5"/><path d="M9 2h6l-1 7h4l-2 4H8l-2-4h4L9 2z"/>
</svg>
</button>
<button class="mobile-header-btn" class:active={isQuickAccess} onclick={async () => {
if (!noteRelativePath) return;
try {
if (isQuickAccess) { await removeQuickAccess(noteRelativePath); } else { await addQuickAccess(noteRelativePath); }
$quickAccessPaths = (await getQuickAccess()).map(n => n.relative_path);
} catch (e) { console.error('Quick access toggle failed:', e); }
}} title="Quick Access">
<svg width="18" height="18" viewBox="0 0 24 24" fill={isQuickAccess ? 'currentColor' : 'none'} stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" />
</svg>
</button>
<button class="mobile-header-btn" onclick={() => editor?.toggleOutlinePanel()} title="Outline">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="6" x2="20" y2="6"/><line x1="8" y1="12" x2="20" y2="12"/><line x1="8" y1="18" x2="20" y2="18"/><circle cx="4" cy="12" r="1" fill="currentColor"/><circle cx="4" cy="18" r="1" fill="currentColor"/>
</svg>
</button>
<button class="mobile-header-btn" onclick={() => editor?.toggleHistoryPanel()} title="History">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/>
</svg>
</button>
{#if $appConfig?.ai_provider && ($appConfig?.ai_provider === 'ollama' || $appConfig?.ai_api_key || $appConfig?.openai_api_key)}
<button class="mobile-header-btn" onclick={() => editor?.triggerAiMenu()} title="AI Actions">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 8V4l-2-2"/><rect x="4" y="8" width="16" height="12" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M9 13v2"/><path d="M15 13v2"/>
</svg>
</button>
{/if}
{:else}
<button class="mobile-header-btn" onclick={createAndFocusNote}>
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
<button class="mobile-header-btn" onclick={() => ($showSearch = true)} title="Search">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="11" cy="11" r="8" />
<line x1="21" y1="21" x2="16.65" y2="16.65" />
</svg>
</button>
<button class="mobile-header-btn" onclick={createAndFocusNote} title="New Note">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
<path d="M12 5v14M5 12h14" />
</svg>
</button>
<button class="mobile-header-btn" onclick={handleDailyNote} title="Daily Note">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
<line x1="16" y1="2" x2="16" y2="6" />
<line x1="8" y1="2" x2="8" y2="6" />
<line x1="3" y1="10" x2="21" y2="10" />
</svg>
</button>
<button class="mobile-header-btn" onclick={() => ($showSettings = true)} title="Settings">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="3" />
<path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z" />
</svg>
</button>
{/if}
<button class="mobile-header-btn" onclick={() => ($showInfo = true)} title="Info">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10" />
<line x1="12" y1="16" x2="12" y2="12" />
<line x1="12" y1="8" x2="12.01" y2="8" />
</svg>
</button>
<button class="mobile-header-btn" onclick={() => ($showSettings = true)} title="Settings">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="3" />
<path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z" />
</svg>
</button>
</div>
</div>
@@ -391,47 +546,13 @@
<Sidebar bind:this={sidebar} onViewChanged={handleViewChanged} />
</div>
<div class="mobile-panel" class:active={$mobileView === 'notelist'}>
<NoteList bind:this={noteList} onNoteSelected={handleNoteSelected} onNoteMoved={() => sidebar?.refresh()} />
<NoteList bind:this={noteList} onNoteSelected={handleNoteSelected} onBeforeNoteSwitch={() => editor?.flushSave()} onNoteMoved={() => sidebar?.refresh()} />
</div>
<div class="mobile-panel" class:active={$mobileView === 'editor'}>
<Editor bind:this={editor} />
</div>
</div>
<!-- Mobile Bottom Nav -->
{#if $mobileView !== 'editor'}
<div class="mobile-bottom-nav">
<button class="mobile-nav-item" class:active={$mobileView === 'sidebar'} onclick={() => ($mobileView = 'sidebar')}>
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
<path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z" />
</svg>
<span>Notebooks</span>
</button>
<button class="mobile-nav-item" onclick={() => $showSearch = true}>
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
<circle cx="11" cy="11" r="8" />
<line x1="21" y1="21" x2="16.65" y2="16.65" />
</svg>
<span>Search</span>
</button>
<button class="mobile-nav-item" onclick={handleDailyNote}>
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
<line x1="16" y1="2" x2="16" y2="6" />
<line x1="8" y1="2" x2="8" y2="6" />
<line x1="3" y1="10" x2="21" y2="10" />
</svg>
<span>Daily</span>
</button>
<button class="mobile-nav-item" onclick={() => ($showSettings = true)}>
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="3" />
<path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z" />
</svg>
<span>Settings</span>
</button>
</div>
{/if}
</div>
{:else}
<!-- ═══ DESKTOP LAYOUT ═══ -->
@@ -485,7 +606,7 @@
{/if}
<div class="notelist-panel" style="width: {$notelistWidth}px">
<NoteList bind:this={noteList} onNoteSelected={handleNoteSelected} onNoteMoved={() => sidebar?.refresh()} />
<NoteList bind:this={noteList} onNoteSelected={handleNoteSelected} onBeforeNoteSwitch={() => editor?.flushSave()} onNoteMoved={() => sidebar?.refresh()} />
</div>
<ResizeHandle onResize={handleNotelistResize} />
@@ -634,10 +755,25 @@
padding: 0 4px;
}
.mobile-update-badge {
background: var(--accent);
color: white;
border: none;
border-radius: 10px;
padding: 2px 8px;
font-size: 11px;
font-weight: 600;
font-family: inherit;
cursor: pointer;
white-space: nowrap;
flex-shrink: 0;
}
.mobile-header-actions {
display: flex;
align-items: center;
gap: 2px;
margin-left: auto;
}
.mobile-header-btn {
@@ -682,38 +818,4 @@
pointer-events: auto;
}
.mobile-bottom-nav {
display: flex;
align-items: center;
justify-content: space-around;
height: 56px;
background: var(--bg-secondary);
border-top: 1px solid var(--border-color);
flex-shrink: 0;
padding-bottom: env(safe-area-inset-bottom);
}
.mobile-nav-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
padding: 6px 16px;
border: none;
background: none;
color: var(--text-tertiary);
font-size: 10px;
font-weight: 500;
cursor: pointer;
border-radius: 8px;
transition: color 0.15s;
}
.mobile-nav-item:active {
background: var(--bg-hover);
}
.mobile-nav-item.active {
color: var(--accent);
}
</style>
+467 -152
View File
@@ -39,7 +39,7 @@
import { openFile, copyFileTo } from '$lib/api';
import { save as saveDialog } from '@tauri-apps/plugin-dialog';
import { activeNote, activeNotePath, appConfig, editorDirty, sourceMode, focusMode, readOnly, quickAccessPaths, notes } from '$lib/stores/app';
import { saveNote, saveImage, saveAttachment, addQuickAccess, removeQuickAccess, getQuickAccess, getNoteVersions, getNoteVersionContent, createVersion, aiAsk, getAllNoteTitles, readNote, renameNote } from '$lib/api';
import { saveNote, saveImage, saveAttachment, readClipboardImage, addQuickAccess, removeQuickAccess, getQuickAccess, getNoteVersions, getNoteVersionContent, createVersion, aiAsk, getAllNoteTitles, readNote, renameNote } from '$lib/api';
import type { VersionEntry, AiStreamEvent, NoteTitleEntry } from '$lib/types';
import { listen } from '@tauri-apps/api/event';
import { debounce } from '$lib/utils/debounce';
@@ -52,7 +52,7 @@
let keyboardHeight = $state(0);
if (isMobile && typeof window !== 'undefined' && window.visualViewport) {
const vv = window.visualViewport;
const update = () => { keyboardHeight = Math.max(0, Math.round(window.innerHeight - vv.height)); };
const update = () => { keyboardHeight = Math.max(0, Math.round(window.innerHeight - vv.height - vv.offsetTop)); };
vv.addEventListener('resize', update);
vv.addEventListener('scroll', update);
}
@@ -69,6 +69,8 @@
let pendingContent = $state<string | null>(null);
let ignoreNextUpdate = false;
let isLoadingNote = false;
let fixingBlobsPromise: Promise<void> = Promise.resolve();
let hasPendingBlobs = false;
let lastSourceMode = $sourceMode;
let linkContextMenu = $state<{ x: number; y: number; href: string; anchor: HTMLAnchorElement } | null>(null);
let titleWasStripped = false;
@@ -109,6 +111,7 @@
let aiEmptyNote = $state(false);
let aiOriginalMarkdown = $state('');
let aiMediaPlaceholders = $state<Map<string, string>>(new Map());
let aiStreamUnlisten: (() => void) | null = null;
// View mode (read-only) — state managed by $readOnly store
@@ -295,6 +298,17 @@
renderHTML({ HTMLAttributes }) {
const src = HTMLAttributes.src || '';
const name = HTMLAttributes.name || 'file.pdf';
if (isMobile) {
// On mobile, render as a clickable link instead of iframe
const vaultRoot = $appConfig?.active_vault ?? '';
const absPath = normalizePath(`${vaultRoot}/${decodeURIComponent(src)}`);
return ['div', mergeAttributes({ 'data-pdf-src': src, 'data-pdf-name': name, class: 'pdf-embed-mobile' }),
['a', { href: '#', 'data-open-file': absPath, class: 'pdf-link-mobile', onclick: 'return false;' },
['span', { class: 'pdf-icon-mobile' }, '\uD83D\uDCC4'],
['span', {}, name],
],
];
}
const vaultRoot = $appConfig?.active_vault ?? '';
const pdfHeight = $appConfig?.pdf_height ?? 600;
const absPath = normalizePath(`${vaultRoot}/${decodeURIComponent(src)}`);
@@ -1056,6 +1070,12 @@
const autoSave = debounce(async () => {
if (!$activeNote || !$activeNotePath || !$editorDirty) return;
// Only fix blob images if a paste occurred (avoids full doc scan on every save)
if (hasPendingBlobs) {
hasPendingBlobs = false;
fixingBlobsPromise = fixBlobImages();
}
await fixingBlobsPromise;
try {
const body = $sourceMode
? restoreTitleH1(sourceContent)
@@ -1071,10 +1091,11 @@
} catch (e) {
console.error('Auto-save failed:', e);
}
}, 500);
}, isMobile ? 1500 : 500);
export async function forceSave() {
if (!$activeNote || !$activeNotePath) return;
await fixingBlobsPromise;
try {
const body = $sourceMode ? restoreTitleH1(sourceContent) : editorToMarkdown();
const trimmed = body.replace(/^#.*\n?/, '').trim();
@@ -1199,6 +1220,24 @@
});
}
/** Flush unsaved editor content to disk (synchronous serialize + fire-and-forget save).
* Call BEFORE updating $activeNote/$activeNotePath stores when switching notes. */
export function flushSave() {
if (!$editorDirty || !$activeNote || !$activeNotePath) return;
try {
const body = $sourceMode
? restoreTitleH1(sourceContent)
: editorToMarkdown();
const trimmed = body.replace(/^#.*\n?/, '').trim();
if (trimmed || !$activeNote.content || $activeNote.content.trim().length <= 10) {
saveNote($activeNotePath, $activeNote.meta, body);
}
} catch (e) {
console.error('Pre-switch save failed:', e);
}
$editorDirty = false;
}
export function loadNote(path: string, content: string) {
loadedPath = path;
lastSourceMode = $sourceMode;
@@ -1400,6 +1439,7 @@
}
case 'image': {
const src = stripAssetSrc(node.attrs.src || '');
if (!src) return ''; // Skip images with unresolved blob: URLs
const alt = node.attrs.alt || '';
const size = node.attrs['data-size'] || node.attrs.size || 'full';
const sizeSuffix = size && size !== 'full' ? `|size=${size}` : '';
@@ -1476,6 +1516,7 @@
parts.push(text);
} else if (child.type.name === 'image') {
const src = stripAssetSrc(child.attrs.src || '');
if (!src) return; // Skip images with unresolved blob: URLs
const alt = child.attrs.alt || '';
const size = child.attrs['data-size'] || child.attrs.size || 'full';
const sizeSuffix = size && size !== 'full' ? `|size=${size}` : '';
@@ -1847,11 +1888,14 @@
return `![${alt}](${url.replace(/ /g, '%20')})`;
});
// Pre-process: transform PDF embed divs into iframes before markdown-it (it passes HTML through)
// Pre-process: transform PDF embed divs iframes on desktop, clickable links on mobile
src = src.replace(/<div[^>]*data-pdf-src="([^"]*)"[^>]*data-pdf-name="([^"]*)"[^>]*>[^<]*<\/div>/gi, (_, pdfSrc, name) => {
const vaultRoot = $appConfig?.active_vault ?? '';
const pdfHeight = $appConfig?.pdf_height ?? 600;
const absPath = normalizePath(`${vaultRoot}/${decodeURIComponent(pdfSrc)}`);
if (isMobile) {
return `<div class="pdf-embed-mobile"><a href="#" data-open-file="${absPath}" class="pdf-link-mobile" onclick="return false;">\uD83D\uDCC4 ${name}</a></div>`;
}
const pdfHeight = $appConfig?.pdf_height ?? 600;
const displaySrc = convertFileSrc(absPath);
return `<div data-pdf-src="${pdfSrc}" data-pdf-name="${name}" class="pdf-embed"><iframe src="${displaySrc}" width="100%" height="${pdfHeight}px"></iframe><p class="pdf-label">${name}</p></div>`;
});
@@ -1947,11 +1991,16 @@
return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
}
// When editorElement appears in DOM (first note selected), initialize TipTap
// When editorElement appears in DOM, initialize TipTap.
// On mobile, pre-create editor with empty content so first note load is fast.
$effect(() => {
if (editorElement && !editor && pendingContent !== null) {
createEditor(pendingContent);
pendingContent = null;
if (editorElement && !editor) {
if (pendingContent !== null) {
createEditor(pendingContent);
pendingContent = null;
} else if (isMobile) {
createEditor('');
}
}
});
@@ -1997,6 +2046,7 @@
});
function destroyEditor() {
flushSave();
if (editor) {
editor.destroy();
editor = null;
@@ -2068,6 +2118,20 @@
}
}
},
// On mobile, handle clicks on PDF file links to open in external app
...(isMobile ? { click: (_view: any, event: MouseEvent) => {
const target = (event.target as HTMLElement).closest('[data-open-file]') as HTMLElement | null;
if (target) {
event.preventDefault();
const filePath = target.getAttribute('data-open-file');
if (filePath) {
const bridge = (window as any).Android;
if (bridge && typeof bridge.openFile === 'function') {
bridge.openFile(filePath);
}
}
}
}} : {}),
// Prevent native text drag — it causes copy-instead-of-move in Tauri's webview.
// File drops from OS are handled by Tauri's onDragDropEvent listener instead.
dragstart: (_view, event) => {
@@ -2078,7 +2142,11 @@
},
},
handleDrop: (_view, event) => handleFileDrop(event),
handlePaste: (_view, event) => handleFilePaste(event),
handlePaste: (_view, event) => {
const handled = handleFilePaste(event);
if (!handled) hasPendingBlobs = true; // ProseMirror may insert blob: images from web paste
return handled;
},
},
onTransaction: () => {
// Batch toolbar state updates to once per frame — avoids ~35 isActive() calls per transaction during selection drag
@@ -2088,8 +2156,9 @@
editorState++;
});
}
updateSlashMenu();
updateWikiLinkMenu();
// On mobile, only check menus when they're already open (avoid work on every keystroke)
if (!isMobile || slashMenu) updateSlashMenu();
if (!isMobile || wikiLinkMenu) updateWikiLinkMenu();
},
onUpdate: () => {
if (ignoreNextUpdate || isLoadingNote) {
@@ -2098,9 +2167,7 @@
}
$editorDirty = true;
autoSave();
// Fix any blob: URLs from pasted web images
fixBlobImages();
if (showOutline) updateOutline();
if (!isMobile && showOutline) updateOutline();
},
});
editorReady = true;
@@ -2110,6 +2177,19 @@
}
}
export function toggleOutlinePanel() {
showOutline = !showOutline;
if (showOutline) updateOutline();
}
export function toggleHistoryPanel() {
toggleHistory();
}
export function triggerAiMenu() {
openAiMenu();
}
export function addLinkFromToolbar() {
if (!editor) return;
const { from, to } = editor.state.selection;
@@ -2219,7 +2299,14 @@
if (href) {
event.preventDefault();
event.stopPropagation();
linkContextMenu = { x: event.clientX, y: event.clientY, href, anchor };
let lx = event.clientX;
let ly = event.clientY;
const lw = 200, lh = 200;
if (lx + lw > window.innerWidth) lx = window.innerWidth - lw - 8;
if (ly + lh > window.innerHeight) ly = window.innerHeight - lh - 8;
if (lx < 4) lx = 4;
if (ly < 4) ly = 4;
linkContextMenu = { x: lx, y: ly, href, anchor };
return;
}
}
@@ -2466,7 +2553,10 @@
aiTranslateMenu = false;
aiCustomPrompt = '';
if (hasSelection) {
if (isMobile) {
// Mobile: bottom sheet, no positioning needed
aiMenu = { x: 0, y: 0 };
} else if (hasSelection) {
const coords = editor.view.coordsAtPos(from);
let x = coords.left;
let y = coords.top - 8;
@@ -2491,6 +2581,7 @@
}
function closeAiMenu() {
if (aiStreamUnlisten) { aiStreamUnlisten(); aiStreamUnlisten = null; }
aiMenu = null;
aiLoading = false;
aiResult = null;
@@ -2518,6 +2609,9 @@
aiShowCustom = false;
aiTranslateMenu = false;
// Cancel any previous stream listener
if (aiStreamUnlisten) { aiStreamUnlisten(); aiStreamUnlisten = null; }
const requestId = crypto.randomUUID();
const unlisten = await listen<AiStreamEvent>('ai-stream', (event) => {
const data = event.payload;
@@ -2525,13 +2619,16 @@
aiResult = (aiResult ?? '') + data.text;
} else if (data.event_type === 'done') {
aiLoading = false;
aiStreamUnlisten = null;
unlisten();
} else if (data.event_type === 'error') {
aiError = data.error ?? 'Unknown error';
aiLoading = false;
aiStreamUnlisten = null;
unlisten();
}
});
aiStreamUnlisten = unlisten;
try {
await aiAsk(action, aiSelectedText, customPrompt ?? null, requestId);
@@ -2539,6 +2636,7 @@
aiError = String(e);
aiLoading = false;
unlisten();
aiStreamUnlisten = null;
}
}
@@ -2721,9 +2819,34 @@
}
return true;
}
// WebKitGTK fallback (bug #218519): older WebKitGTK versions return
// empty DataTransferItemList for image pastes. Detect this and read
// the image directly from the system clipboard via Rust/arboard.
if (items.length === 0) {
const hasText = event.clipboardData!.getData('text/plain');
const hasHtml = event.clipboardData!.getData('text/html');
if (!hasText && !hasHtml) {
event.preventDefault();
insertClipboardImage();
return true;
}
}
return false;
}
async function insertClipboardImage() {
try {
const data = await readClipboardImage();
const relativePath = await saveImage('pasted-image.png', data);
if (editor) {
const displaySrc = resolveImageSrc(relativePath);
editor.chain().focus().setImage({ src: displaySrc }).run();
}
} catch (e) {
console.error('Clipboard image fallback failed:', e);
}
}
async function insertImage(file: File) {
try {
const buffer = await file.arrayBuffer();
@@ -2744,7 +2867,7 @@
const data = Array.from(new Uint8Array(buffer));
const relativePath = await saveAttachment(file.name, data);
if (!editor) return;
const usePdfPreview = $appConfig?.pdf_preview ?? false;
const usePdfPreview = !isMobile && ($appConfig?.pdf_preview ?? false);
if (usePdfPreview) {
editor.chain().focus().insertContent({
type: 'pdfEmbed',
@@ -2839,16 +2962,25 @@
resetSourceHistory(sourceContent);
lastSourceMode = true;
} else if (!isSource && lastSourceMode) {
// Switching BACK to WYSIWYG: destroy old editor (its DOM element is gone),
// wait for DOM to swap textarea→div, then create editor on new element.
destroyEditor();
const content = sourceContent || ($activeNote?.content ?? '');
lastSourceMode = false;
tick().then(() => {
if (editorElement && !editor) {
createEditor(content);
if (isMobile) {
// Mobile: editor stays in DOM, just update its content
const content = sourceContent || ($activeNote?.content ?? '');
if (editor) {
ignoreNextUpdate = true;
editor.commands.setContent(markdownToHtml(content));
}
});
} else {
// Desktop: destroy old editor (its DOM element is gone),
// wait for DOM to swap textarea→div, then create editor on new element.
destroyEditor();
const content = sourceContent || ($activeNote?.content ?? '');
tick().then(() => {
if (editorElement && !editor) {
createEditor(content);
}
});
}
}
});
@@ -2874,7 +3006,7 @@
readFile(filePath).then((data) => {
saveAttachment(name, Array.from(data)).then((relativePath) => {
if (!editor) return;
const usePdfPreview = $appConfig?.pdf_preview ?? false;
const usePdfPreview = !isMobile && ($appConfig?.pdf_preview ?? false);
if (usePdfPreview) {
editor.chain().focus().insertContent({
type: 'pdfEmbed',
@@ -2947,14 +3079,18 @@
if (!newTitle) return;
const oldPath = $activeNotePath;
$activeNote.meta.title = newTitle;
// Update stripped title so restoreTitleH1 uses the new title
if (titleWasStripped) strippedTitle = newTitle;
$editorDirty = true;
autoSave();
// Force save current editor content before renaming so disk is up-to-date
await forceSave();
// Rename file on disk if filename doesn't match the new title
const filename = oldPath.split('/').pop() ?? '';
const stem = filename.replace(/\.md$/, '');
if (stem !== newTitle) {
try {
const newPath = await renameNote(oldPath, newTitle);
loadedPath = newPath;
$activeNotePath = newPath;
notes.update(list => list.map(n =>
n.path === oldPath
@@ -2976,14 +3112,14 @@
}}
/>
</div>
<div class="toolbar-actions" class:mobile={isMobile}>
{#if !isMobile}
<div class="toolbar-actions">
{#if $editorDirty}
<span class="save-indicator">Unsaved</span>
{/if}
{#if $readOnly}
<span class="readonly-indicator">View Mode</span>
{/if}
{#if !isMobile}
<button
class="icon-btn"
class:active={noteSearchOpen}
@@ -2994,7 +3130,6 @@
<circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>
</svg>
</button>
{/if}
<button
class="icon-btn"
@@ -3008,7 +3143,7 @@
}}
title={$activeNote?.meta.pinned ? 'Unpin note' : 'Pin note'}
>
<svg width={isMobile ? "20" : "16"} height={isMobile ? "20" : "16"} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 17v5"/>
<path d="M9 2h6l-1 7h4l-2 4H8l-2-4h4L9 2z"/>
</svg>
@@ -3032,7 +3167,7 @@
}}
title={isQuickAccess ? 'Remove from Quick Access' : 'Add to Quick Access'}
>
<svg width={isMobile ? "20" : "16"} height={isMobile ? "20" : "16"} viewBox="0 0 24 24" fill={isQuickAccess ? 'currentColor' : 'none'} stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<svg width="16" height="16" viewBox="0 0 24 24" fill={isQuickAccess ? 'currentColor' : 'none'} stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" />
</svg>
</button>
@@ -3042,7 +3177,7 @@
onclick={() => { showOutline = !showOutline; if (showOutline) updateOutline(); }}
title="Outline"
>
<svg width={isMobile ? "20" : "16"} height={isMobile ? "20" : "16"} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="6" x2="20" y2="6"/><line x1="8" y1="12" x2="20" y2="12"/><line x1="8" y1="18" x2="20" y2="18"/><circle cx="4" cy="12" r="1" fill="currentColor"/><circle cx="4" cy="18" r="1" fill="currentColor"/>
</svg>
</button>
@@ -3052,12 +3187,11 @@
onclick={toggleHistory}
title="Version history"
>
<svg width={isMobile ? "20" : "16"} height={isMobile ? "20" : "16"} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10"/>
<polyline points="12 6 12 12 16 14"/>
</svg>
</button>
{#if !isMobile}
{#if $appConfig?.enable_wiki_links}
<button
class="icon-btn"
@@ -3071,7 +3205,7 @@
</svg>
</button>
{/if}
{#if $appConfig?.ai_provider && ($appConfig?.ai_api_key || $appConfig?.openai_api_key)}
{#if $appConfig?.ai_provider && ($appConfig?.ai_provider === 'ollama' || $appConfig?.ai_api_key || $appConfig?.openai_api_key)}
<button
class="icon-btn"
onclick={openAiMenu}
@@ -3092,8 +3226,8 @@
<path d="M5.854 4.854a.5.5 0 10-.708-.708l-3.5 3.5a.5.5 0 000 .708l3.5 3.5a.5.5 0 00.708-.708L2.707 8l3.147-3.146zm4.292 0a.5.5 0 01.708-.708l3.5 3.5a.5.5 0 010 .708l-3.5 3.5a.5.5 0 01-.708-.708L13.293 8l-3.147-3.146z" />
</svg>
</button>
{/if}
</div>
{/if}
</div>
<div class="editor-body-wrapper">
@@ -3133,19 +3267,11 @@
{/if}
<div class="editor-body-row">
<div class="editor-body">
{#if $sourceMode}
{#if $appConfig?.show_line_numbers}
<div class="line-numbers-clip" aria-hidden="true">
<div class="line-numbers">
{#each sourceContent.split('\n') as _, i}
<span>{i + 1}</span>
{/each}
</div>
</div>
{/if}
{#if isMobile}
<!-- Mobile: both views always in DOM, toggled via display to avoid slow editor re-creation -->
<textarea
class="source-editor"
class:with-line-numbers={$appConfig?.show_line_numbers}
style={$sourceMode ? '' : 'display:none'}
bind:this={sourceElement}
bind:value={sourceContent}
readonly={$readOnly}
@@ -3157,7 +3283,6 @@
}}
onkeydown={(e) => {
const mod = e.ctrlKey || e.metaKey;
// Shift+Enter: insert two trailing spaces + newline for markdown hard break
if (e.key === 'Enter' && e.shiftKey && !mod) {
e.preventDefault();
const ta = sourceElement;
@@ -3174,71 +3299,130 @@
pushSourceHistoryDebounced();
return;
}
// Undo
if (mod && (e.key === 'z' || e.key === 'Z') && !e.shiftKey) {
e.preventDefault();
sourceUndo();
return;
}
// Redo
if ((mod && (e.key === 'z' || e.key === 'Z') && e.shiftKey) || (mod && (e.key === 'y' || e.key === 'Y'))) {
e.preventDefault();
sourceRedo();
return;
}
if (e.altKey && (e.key === 'ArrowUp' || e.key === 'ArrowDown')) {
e.preventDefault();
pushSourceHistoryImmediate();
const ta = sourceElement;
const val = ta.value;
const start = ta.selectionStart;
const lines = val.split('\n');
// Find current line index
let pos = 0;
let curLine = 0;
for (let i = 0; i < lines.length; i++) {
if (pos + lines[i].length >= start) { curLine = i; break; }
pos += lines[i].length + 1;
}
if (e.key === 'ArrowUp' && curLine > 0) {
const tmp = lines[curLine];
lines[curLine] = lines[curLine - 1];
lines[curLine - 1] = tmp;
sourceContent = lines.join('\n');
tick().then(() => {
const newPos = lines.slice(0, curLine - 1).join('\n').length + 1 + (start - pos);
ta.setSelectionRange(newPos, newPos);
pushSourceHistoryImmediate();
});
} else if (e.key === 'ArrowDown' && curLine < lines.length - 1) {
const tmp = lines[curLine];
lines[curLine] = lines[curLine + 1];
lines[curLine + 1] = tmp;
sourceContent = lines.join('\n');
tick().then(() => {
const newPos = lines.slice(0, curLine + 1).join('\n').length + 1 + (start - pos);
ta.setSelectionRange(newPos, newPos);
pushSourceHistoryImmediate();
});
}
$editorDirty = true;
autoSave();
}
}}
onscroll={() => {
if ($appConfig?.show_line_numbers) {
const clip = sourceElement?.previousElementSibling as HTMLElement;
const gutter = clip?.firstElementChild as HTMLElement;
if (gutter) {
gutter.style.transform = `translateY(-${sourceElement.scrollTop}px)`;
}
}
}}
spellcheck="false"
></textarea>
{:else}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="tiptap-wrapper" bind:this={editorElement} onclick={(e) => { closeLinkContextMenu(); handleEditorClick(e); showOutline = false; }} oncontextmenu={handleEditorContextMenu}></div>
<div class="tiptap-wrapper" style={$sourceMode ? 'display:none' : ''} bind:this={editorElement} onclick={(e) => { closeLinkContextMenu(); handleEditorClick(e); showOutline = false; }}></div>
{:else}
<!-- Desktop: conditional rendering with line numbers -->
{#if $sourceMode}
{#if $appConfig?.show_line_numbers}
<div class="line-numbers-clip" aria-hidden="true">
<div class="line-numbers">
{#each sourceContent.split('\n') as _, i}
<span>{i + 1}</span>
{/each}
</div>
</div>
{/if}
<textarea
class="source-editor"
class:with-line-numbers={$appConfig?.show_line_numbers}
bind:this={sourceElement}
bind:value={sourceContent}
readonly={$readOnly}
onclick={() => { showOutline = false; }}
oninput={() => {
$editorDirty = true;
autoSave();
pushSourceHistoryDebounced();
}}
onkeydown={(e) => {
const mod = e.ctrlKey || e.metaKey;
// Shift+Enter: insert two trailing spaces + newline for markdown hard break
if (e.key === 'Enter' && e.shiftKey && !mod) {
e.preventDefault();
const ta = sourceElement;
const start = ta.selectionStart;
const end = ta.selectionEnd;
const val = ta.value;
sourceContent = val.slice(0, start) + ' \n' + val.slice(end);
tick().then(() => {
const newPos = start + 3;
ta.setSelectionRange(newPos, newPos);
});
$editorDirty = true;
autoSave();
pushSourceHistoryDebounced();
return;
}
// Undo
if (mod && (e.key === 'z' || e.key === 'Z') && !e.shiftKey) {
e.preventDefault();
sourceUndo();
return;
}
// Redo
if ((mod && (e.key === 'z' || e.key === 'Z') && e.shiftKey) || (mod && (e.key === 'y' || e.key === 'Y'))) {
e.preventDefault();
sourceRedo();
return;
}
if (e.altKey && (e.key === 'ArrowUp' || e.key === 'ArrowDown')) {
e.preventDefault();
pushSourceHistoryImmediate();
const ta = sourceElement;
const val = ta.value;
const start = ta.selectionStart;
const lines = val.split('\n');
// Find current line index
let pos = 0;
let curLine = 0;
for (let i = 0; i < lines.length; i++) {
if (pos + lines[i].length >= start) { curLine = i; break; }
pos += lines[i].length + 1;
}
if (e.key === 'ArrowUp' && curLine > 0) {
const tmp = lines[curLine];
lines[curLine] = lines[curLine - 1];
lines[curLine - 1] = tmp;
sourceContent = lines.join('\n');
tick().then(() => {
const newPos = lines.slice(0, curLine - 1).join('\n').length + 1 + (start - pos);
ta.setSelectionRange(newPos, newPos);
pushSourceHistoryImmediate();
});
} else if (e.key === 'ArrowDown' && curLine < lines.length - 1) {
const tmp = lines[curLine];
lines[curLine] = lines[curLine + 1];
lines[curLine + 1] = tmp;
sourceContent = lines.join('\n');
tick().then(() => {
const newPos = lines.slice(0, curLine + 1).join('\n').length + 1 + (start - pos);
ta.setSelectionRange(newPos, newPos);
pushSourceHistoryImmediate();
});
}
$editorDirty = true;
autoSave();
}
}}
onscroll={() => {
if ($appConfig?.show_line_numbers) {
const clip = sourceElement?.previousElementSibling as HTMLElement;
const gutter = clip?.firstElementChild as HTMLElement;
if (gutter) {
gutter.style.transform = `translateY(-${sourceElement.scrollTop}px)`;
}
}
}}
spellcheck="false"
></textarea>
{:else}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="tiptap-wrapper" bind:this={editorElement} onclick={(e) => { closeLinkContextMenu(); handleEditorClick(e); showOutline = false; }} oncontextmenu={handleEditorContextMenu}></div>
{/if}
{/if}
</div>
@@ -3320,10 +3504,44 @@
{#if editorReady && !$sourceMode}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="editor-formatting-bar" style={isMobile && keyboardHeight > 0 ? `bottom: ${keyboardHeight}px` : ''} onclick={() => { headingDropdown = false; colorDropdown = false; highlightDropdown = false; tablePickerOpen = false; alignDropdown = false; insertDropdown = false; }}>
<div class="editor-formatting-bar" style={isMobile ? `${keyboardHeight > 0 ? `bottom: ${keyboardHeight}px;` : ''}${anyDropdownOpen ? 'overflow: visible;' : ''}` : ''} onclick={() => { headingDropdown = false; colorDropdown = false; highlightDropdown = false; tablePickerOpen = false; alignDropdown = false; insertDropdown = false; }}>
{#if isMobile}
<!-- ═══ MOBILE formatting bar: compact, relevant buttons only ═══ -->
<!-- Insert (+) dropdown — at front like desktop -->
<div class="fmt-dropdown-wrap">
<button class="fmt-btn insert-btn" onclick={(e) => { e.stopPropagation(); insertDropdown = !insertDropdown; headingDropdown = false; }} title="Insert">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
</button>
{#if insertDropdown}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="fmt-dropdown insert-dropdown" onclick={(e) => e.stopPropagation()}>
<button onclick={() => { insertDropdown = false; document.querySelector<HTMLInputElement>('#insert-image-input')?.click(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 00-2.828 0L6 21"/></svg>
Image
</button>
<button onclick={() => { insertDropdown = false; document.querySelector<HTMLInputElement>('#insert-file-input')?.click(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 22a2 2 0 01-2-2V4a2 2 0 012-2h8a2.4 2.4 0 011.704.706l3.588 3.588A2.4 2.4 0 0120 8v12a2 2 0 01-2 2z"/><path d="M14 2v5a1 1 0 001 1h5"/></svg>
File
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().setHorizontalRule().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M5 12h14"/></svg>
Horizontal Rule
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().toggleCodeBlock().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m10 9-3 3 3 3"/><path d="m14 15 3-3-3-3"/><rect x="3" y="3" width="18" height="18" rx="2"/></svg>
Code Block
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().toggleBlockquote().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 5H3"/><path d="M21 12H8"/><path d="M21 19H8"/><path d="M3 12v7"/></svg>
Quote
</button>
</div>
{/if}
</div>
<div class="fmt-sep"></div>
<!-- Heading dropdown -->
<div class="fmt-dropdown-wrap">
<button class="fmt-btn" class:active={(editorState, editor.isActive('heading'))} onclick={(e) => { e.stopPropagation(); headingDropdown = !headingDropdown; insertDropdown = false; }} title="Heading">
@@ -3393,39 +3611,14 @@
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 14 5-5-5-5"/><path d="M20 9H9.5A5.5 5.5 0 004 14.5 5.5 5.5 0 009.5 20H13"/></svg>
</button>
{#if $appConfig?.ai_provider && ($appConfig?.ai_provider === 'ollama' || $appConfig?.ai_api_key || $appConfig?.openai_api_key)}
<div class="fmt-sep"></div>
<!-- Insert (+) dropdown — mobile version with common inserts -->
<div class="fmt-dropdown-wrap">
<button class="fmt-btn insert-btn" onclick={(e) => { e.stopPropagation(); insertDropdown = !insertDropdown; headingDropdown = false; }} title="Insert">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="M12 5v14"/></svg>
</button>
{#if insertDropdown}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="fmt-dropdown insert-dropdown" onclick={(e) => e.stopPropagation()}>
<button onclick={() => { insertDropdown = false; document.querySelector<HTMLInputElement>('#insert-image-input')?.click(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 00-2.828 0L6 21"/></svg>
Image
</button>
<button onclick={() => { insertDropdown = false; document.querySelector<HTMLInputElement>('#insert-file-input')?.click(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 22a2 2 0 01-2-2V4a2 2 0 012-2h8a2.4 2.4 0 011.704.706l3.588 3.588A2.4 2.4 0 0120 8v12a2 2 0 01-2 2z"/><path d="M14 2v5a1 1 0 001 1h5"/></svg>
File
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().setHorizontalRule().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M5 12h14"/></svg>
Horizontal Rule
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().toggleCodeBlock().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m10 9-3 3 3 3"/><path d="m14 15 3-3-3-3"/><rect x="3" y="3" width="18" height="18" rx="2"/></svg>
Code Block
</button>
<button onclick={() => { insertDropdown = false; editor?.chain().focus().toggleBlockquote().run(); }}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 5H3"/><path d="M21 12H8"/><path d="M21 19H8"/><path d="M3 12v7"/></svg>
Quote
</button>
</div>
{/if}
</div>
<button class="fmt-btn" onclick={openAiMenu} title="AI Actions">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 8V4l-2-2"/><rect x="4" y="8" width="16" height="12" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M9 13v2"/><path d="M15 13v2"/>
</svg>
</button>
{/if}
{:else}
<!-- ═══ DESKTOP formatting bar: full feature set ═══ -->
@@ -3905,7 +4098,7 @@
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7" rx="1.5"/><polyline points="4.5 6.5 6 8 8.5 4.5"/><line x1="13" y1="6.5" x2="21" y2="6.5"/><rect x="3" y="14" width="7" height="7" rx="1.5"/><line x1="13" y1="17.5" x2="21" y2="17.5"/></svg>
Task List
</button>
{#if $appConfig?.ai_provider && ($appConfig?.ai_api_key || $appConfig?.openai_api_key)}
{#if $appConfig?.ai_provider && ($appConfig?.ai_provider === 'ollama' || $appConfig?.ai_api_key || $appConfig?.openai_api_key)}
<div class="text-ctx-sep"></div>
<button onclick={openAiMenu}>
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -4092,9 +4285,9 @@
{#if aiMenu}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="ai-menu-overlay" onclick={closeAiMenu}>
<div class="ai-menu-overlay" class:mobile={isMobile} onclick={closeAiMenu}>
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="ai-menu" style="left: {aiMenu.x}px; top: {aiMenu.y}px" onclick={(e) => e.stopPropagation()}>
<div class="ai-menu" class:mobile={isMobile} style={isMobile ? '' : `left: ${aiMenu.x}px; top: ${aiMenu.y}px`} onclick={(e) => e.stopPropagation()}>
{#if aiResult !== null || aiLoading}
<!-- Result view -->
<div class="ai-result-header">
@@ -5879,6 +6072,30 @@
border-top: 1px solid var(--border);
margin: 0;
}
:global(.tiptap .pdf-embed-mobile) {
margin: 8px 0;
}
:global(.tiptap .pdf-link-mobile) {
display: flex;
align-items: center;
gap: 10px;
padding: 14px 16px;
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 10px;
color: var(--text-primary);
font-size: 15px;
font-weight: 500;
text-decoration: none;
cursor: pointer;
}
:global(.tiptap .pdf-link-mobile:active) {
background: var(--bg-hover);
}
:global(.tiptap .pdf-icon-mobile) {
font-size: 20px;
line-height: 1;
}
/* Slash commands menu */
.slash-menu-overlay {
@@ -6304,7 +6521,7 @@
}
.editor-container.mobile .editor-toolbar {
padding: 8px 8px 6px 12px;
padding: 8px 16px 6px 16px;
flex-shrink: 0;
flex-direction: column;
align-items: stretch;
@@ -6347,11 +6564,11 @@
min-height: 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 50px;
padding: 0;
}
.editor-container.mobile .tiptap-wrapper {
min-height: 100%;
min-height: 0;
}
.editor-container.mobile .editor-formatting-bar {
@@ -6388,11 +6605,11 @@
}
.editor-container.mobile .fmt-dropdown {
position: fixed;
bottom: auto;
left: 8px;
right: 8px;
top: auto;
position: absolute;
bottom: calc(100% + 4px);
left: 0;
right: auto;
min-width: 180px;
max-width: calc(100vw - 16px);
max-height: 60vh;
overflow-y: auto;
@@ -6405,10 +6622,11 @@
}
.editor-container.mobile .insert-dropdown {
position: fixed;
bottom: 60px;
left: 8px;
right: 8px;
position: absolute;
bottom: calc(100% + 4px);
left: 0;
right: auto;
min-width: 200px;
max-width: calc(100vw - 16px);
}
@@ -6421,21 +6639,30 @@
}
.editor-container.mobile :global(.editor-content) {
padding: 8px 16px !important;
padding: 8px 16px 220px !important;
font-size: 16px !important;
}
.editor-container.mobile .source-editor {
padding: 8px 16px;
padding: 8px 16px 220px;
font-size: 15px;
white-space: pre-wrap;
word-break: break-word;
overflow-x: hidden;
}
.editor-container.mobile .editor-body-row {
position: relative;
}
.editor-container.mobile .history-panel,
.editor-container.mobile .outline-panel {
position: absolute;
inset: 0;
width: 100% !important;
max-width: 100%;
border-left: none;
border-top: 1px solid var(--border-color);
z-index: 10;
}
.editor-container.mobile .note-search-bar {
@@ -6446,4 +6673,92 @@
padding: 8px 10px;
font-size: 15px;
}
/* ═══ AI Menu — Mobile Bottom Sheet ═══ */
.ai-menu-overlay.mobile {
background: rgba(0, 0, 0, 0.35);
display: flex;
align-items: flex-end;
justify-content: center;
}
.ai-menu.mobile {
position: relative;
left: auto !important;
top: auto !important;
width: 100%;
max-width: 100%;
min-width: 0;
border-radius: 16px 16px 0 0;
border-bottom: none;
max-height: 70vh;
padding: 8px 4px calc(env(safe-area-inset-bottom, 0px) + 8px);
}
.ai-menu.mobile .ai-menu-label {
padding: 10px 16px 6px;
font-size: 12px;
}
.ai-menu.mobile .ai-menu-item {
padding: 12px 16px;
font-size: 15px;
min-height: 44px;
border-radius: 8px;
}
.ai-menu.mobile .ai-menu-sep {
margin: 4px 8px;
}
.ai-menu.mobile .ai-result-header {
padding: 12px 16px 8px;
}
.ai-menu.mobile .ai-result-body {
padding: 8px 16px;
font-size: 15px;
max-height: 40vh;
}
.ai-menu.mobile .ai-result-actions {
padding: 8px 16px 4px;
gap: 10px;
}
.ai-menu.mobile .ai-result-actions button {
padding: 10px 16px;
font-size: 14px;
min-height: 44px;
}
.ai-menu.mobile .ai-custom-body {
padding: 8px 12px;
}
.ai-menu.mobile .ai-custom-input {
font-size: 15px;
min-height: 80px;
}
.ai-menu.mobile .ai-custom-submit {
padding: 10px 16px;
font-size: 14px;
min-height: 44px;
}
.ai-menu.mobile .ai-custom-header {
padding: 10px 12px;
font-size: 15px;
}
.ai-menu.mobile .ai-back-btn {
min-width: 44px;
min-height: 44px;
}
.ai-menu.mobile .ai-error {
padding: 12px 16px;
font-size: 14px;
}
</style>
+20 -1
View File
@@ -6,9 +6,10 @@
import type { VaultStats } from '$lib/types';
const modKey = navigator.platform.startsWith('Mac') ? '⌘' : 'Ctrl';
const isMobile = /android|ios/i.test(navigator.userAgent);
let stats = $state<VaultStats | null>(null);
let activeTab = $state<'about' | 'shortcuts'>('shortcuts');
let activeTab = $state<'about' | 'shortcuts'>(isMobile ? 'about' : 'shortcuts');
let appVersion = $state('...');
getVersion().then(v => appVersion = v).catch(() => appVersion = '0.0.0');
@@ -54,10 +55,12 @@
</div>
<div class="info-body">
{#if !isMobile}
<div class="info-tabs">
<button class="info-tab" class:active={activeTab === 'shortcuts'} onclick={() => activeTab = 'shortcuts'}>Shortcuts</button>
<button class="info-tab" class:active={activeTab === 'about'} onclick={() => activeTab = 'about'}>About</button>
</div>
{/if}
{#if activeTab === 'about'}
<div class="info-logo">
@@ -127,6 +130,7 @@
<div class="shortcut-row"><span class="shortcut-desc">Go back</span><span class="shortcut-keys"><kbd>Alt</kbd>+<kbd></kbd></span></div>
<div class="shortcut-row"><span class="shortcut-desc">Go forward</span><span class="shortcut-keys"><kbd>Alt</kbd>+<kbd></kbd></span></div>
<div class="shortcut-row"><span class="shortcut-desc">Toggle source mode</span><span class="shortcut-keys"><kbd>{modKey}</kbd>+<kbd>Shift</kbd>+<kbd>M</kbd></span></div>
<div class="shortcut-row"><span class="shortcut-desc">Open note in new window</span><span class="shortcut-keys"><kbd>{modKey}</kbd>+<kbd>Shift</kbd>+<kbd>W</kbd></span></div>
<div class="shortcut-row"><span class="shortcut-desc">Exit focus mode</span><span class="shortcut-keys"><kbd>Esc</kbd></span></div>
<h4 class="shortcuts-group-title">Editor Commands</h4>
@@ -397,4 +401,19 @@
color: var(--text-tertiary);
line-height: 1.4;
}
/* Mobile */
@media (max-width: 600px) {
.info-panel {
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
border: none;
}
.info-header {
padding-top: calc(env(safe-area-inset-top, 12px) + 12px);
}
}
</style>
+51 -11
View File
@@ -12,7 +12,8 @@
quickAccessPaths,
appConfig,
notebooks,
tags
tags,
mobileView
} from '$lib/stores/app';
import {
getNotes,
@@ -35,14 +36,34 @@
import { openNoteWindow } from '$lib/utils/window';
import type { NoteEntry, SortMode } from '$lib/types';
let { onNoteSelected = (_path: string, _content: string) => {}, onNoteMoved = () => {} }: {
let { onNoteSelected = (_path: string, _content: string) => {}, onNoteMoved = () => {}, onBeforeNoteSwitch = () => {} }: {
onNoteSelected?: (path: string, content: string) => void;
onNoteMoved?: () => void;
onBeforeNoteSwitch?: () => void;
} = $props();
const modKey = navigator.platform.startsWith('Mac') ? '⌘' : 'Ctrl';
const isMobile = /android|ios/i.test(navigator.userAgent);
/** Derive tags from current $notes store (avoids re-scanning files on mobile) */
function deriveTagsFromNotes() {
const tagMap = new Map<string, number>();
for (const note of $notes) {
for (const tag of note.meta.tags) {
tagMap.set(tag, (tagMap.get(tag) ?? 0) + 1);
}
}
$tags = Array.from(tagMap.entries()).sort((a, b) => a[0].localeCompare(b[0]));
}
async function refreshTags() {
if (isMobile) {
deriveTagsFromNotes();
} else {
await refreshTags();
}
}
let compact = $derived($appConfig?.compact_notes ?? false);
let contextMenu = $state<{ x: number; y: number; note: NoteEntry } | null>(null);
let sortMenu = $state<{ x: number; y: number } | null>(null);
@@ -168,7 +189,12 @@
} else if ($viewMode === 'quickaccess') {
$notes = await getQuickAccess();
} else if ($viewMode === 'tag' && $activeTag) {
const all = await getNotes(null);
// Reuse cached "all" notes if available, otherwise fetch and cache them
let all = noteCache.get('all');
if (!all) {
all = await getNotes(null);
noteCache.set('all', all);
}
$notes = all.filter((n) => n.meta.tags.includes($activeTag!));
} else {
const nbPath = $viewMode === 'notebook' ? $activeNotebook?.path ?? null : null;
@@ -181,9 +207,13 @@
}
async function selectNote(note: NoteEntry) {
if ($activeNotePath === note.path) return;
if ($activeNotePath === note.path) {
if (isMobile) $mobileView = 'editor';
return;
}
try {
const content = await readNote(note.path);
onBeforeNoteSwitch();
$activeNote = content;
$activeNotePath = note.path;
$editorDirty = false;
@@ -322,7 +352,7 @@
if ($activeNotePath === note.path && $activeNote) {
$activeNote = { ...$activeNote, meta: { ...$activeNote.meta, tags: newTags } };
}
$tags = await getAllTags();
await refreshTags();
} catch (e) {
console.error('Failed to save tags:', e);
}
@@ -358,7 +388,7 @@
}
}
}
$tags = await getAllTags();
await refreshTags();
} catch (e) {
console.error('Failed to add tag to batch:', e);
}
@@ -380,7 +410,7 @@
}
}
}
$tags = await getAllTags();
await refreshTags();
} catch (e) {
console.error('Failed to remove tag from batch:', e);
}
@@ -447,9 +477,18 @@
}
}
function clampMenu(x: number, y: number, menuWidth = 220, menuHeight = 400): { x: number; y: number } {
if (x + menuWidth > window.innerWidth) x = window.innerWidth - menuWidth - 8;
if (y + menuHeight > window.innerHeight) y = window.innerHeight - menuHeight - 8;
if (x < 4) x = 4;
if (y < 4) y = 4;
return { x, y };
}
function onContextMenu(e: MouseEvent, note: NoteEntry) {
e.preventDefault();
contextMenu = { x: e.clientX, y: e.clientY, note };
const { x, y } = clampMenu(e.clientX, e.clientY);
contextMenu = { x, y, note };
}
function startRename(note: NoteEntry) {
@@ -689,16 +728,17 @@
onclick={(e) => handleNoteClick(e, note)}
oncontextmenu={(e) => {
e.preventDefault();
const pos = clampMenu(e.clientX, e.clientY);
// If multi-selected and right-clicking a selected note, show batch menu
if (selectedPaths.size > 1 && selectedPaths.has(note.path)) {
contextMenu = { x: e.clientX, y: e.clientY, note };
contextMenu = { x: pos.x, y: pos.y, note };
return;
}
// Otherwise clear selection and show single menu
if (selectedPaths.size > 0 && !selectedPaths.has(note.path)) {
clearSelection();
}
contextMenu = { x: e.clientX, y: e.clientY, note };
contextMenu = { x: pos.x, y: pos.y, note };
}}
draggable="true"
ondragstart={(e) => {
@@ -1537,7 +1577,7 @@
}
.note-list.mobile .list-content {
padding: 4px 8px;
padding: 4px 8px 180px;
}
.note-list.mobile .note-item {
+5 -2
View File
@@ -1,5 +1,5 @@
<script lang="ts">
import { showSearch, activeNote, activeNotePath, editorDirty, appConfig } from '$lib/stores/app';
import { showSearch, activeNote, activeNotePath, editorDirty, appConfig, mobileView } from '$lib/stores/app';
import { searchNotes, readNote } from '$lib/api';
import { debounce } from '$lib/utils/debounce';
import type { SearchResult } from '$lib/types';
@@ -83,6 +83,8 @@
return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
}
const isMobile = /android|ios/i.test(navigator.userAgent);
async function openResult(result: SearchResult) {
try {
const content = await readNote(result.path);
@@ -90,6 +92,7 @@
$activeNotePath = result.path;
$editorDirty = false;
$showSearch = false;
if (isMobile) $mobileView = 'editor';
} catch (e) {
console.error('Failed to open search result:', e);
}
@@ -118,7 +121,7 @@
oninput={handleInput}
onkeydown={handleKeydown}
/>
<kbd class="search-esc">Esc</kbd>
{#if !isMobile}<kbd class="search-esc">Esc</kbd>{/if}
</div>
{#if results.length > 0}
+244 -49
View File
@@ -1,12 +1,14 @@
<script lang="ts">
import { showSettings, theme, appConfig, updateAvailable as globalUpdateAvailable, updateObj as globalUpdateObj, installType, settingsTab } from '$lib/stores/app';
import { showSettings, theme, appConfig, updateAvailable as globalUpdateAvailable, updateObj as globalUpdateObj, installType, settingsTab, vaultReady, androidApkUrl, checkForUpdateMobile } from '$lib/stores/app';
import { setTheme, setAccentColor, setFontSize, setFontFamily, setLineHeight, setGeneralSettings, importObsidian, createBackup, listBackups, restoreBackup, deleteBackup, setBackupSettings, setAiSettings, testAiConnection } from '$lib/api';
import { open as openDialog } from '@tauri-apps/plugin-dialog';
import { listen } from '@tauri-apps/api/event';
import { check as checkUpdate } from '@tauri-apps/plugin-updater';
import { getVersion } from '@tauri-apps/api/app';
import { openUrl } from '@tauri-apps/plugin-opener';
import type { ImportResult, BackupEntry } from '$lib/types';
const isMobile = /android|ios/i.test(navigator.userAgent);
type Tab = 'general' | 'editor' | 'styling' | 'import' | 'backup' | 'ai' | 'updates';
let activeTab = $state<Tab>('styling');
@@ -54,15 +56,27 @@
updateMessage = null;
updateAvailable = null;
try {
const update = await checkUpdate();
if (update) {
updateObj = update;
$globalUpdateObj = update;
updateAvailable = { version: update.version, body: update.body, date: update.date };
globalUpdateAvailable.set({ version: update.version, body: update.body });
updateMessage = { type: 'info', text: `Version ${update.version} is available!` };
if (isMobile) {
await checkForUpdateMobile();
const global = $globalUpdateAvailable;
if (global) {
updateAvailable = { version: global.version, body: global.body };
updateMessage = { type: 'info', text: `Version ${global.version} is available!` };
} else {
updateMessage = { type: 'success', text: 'You are on the latest version.' };
}
} else {
updateMessage = { type: 'success', text: 'You are on the latest version.' };
const { check: checkUpdate } = await import('@tauri-apps/plugin-updater');
const update = await checkUpdate();
if (update) {
updateObj = update;
$globalUpdateObj = update;
updateAvailable = { version: update.version, body: update.body, date: update.date };
globalUpdateAvailable.set({ version: update.version, body: update.body });
updateMessage = { type: 'info', text: `Version ${update.version} is available!` };
} else {
updateMessage = { type: 'success', text: 'You are on the latest version.' };
}
}
} catch (e) {
updateMessage = { type: 'error', text: `Failed to check: ${e}` };
@@ -204,18 +218,20 @@
let aiProvider = $state<string | null>($appConfig?.ai_provider ?? null);
let aiApiKey = $derived.by(() => {
if (aiProvider === 'openai') return _openaiKey;
if (aiProvider === 'ollama') return '';
return _anthropicKey;
});
let _anthropicKey = $state($appConfig?.ai_api_key ?? '');
let _openaiKey = $state($appConfig?.openai_api_key ?? '');
let aiModel = $state($appConfig?.ai_model ?? 'claude-sonnet-4-5-20250929');
let _ollamaBaseUrl = $state($appConfig?.ollama_base_url ?? 'http://localhost:11434');
let aiModel = $state($appConfig?.ai_model ?? 'claude-sonnet-4-6');
let aiWritingStyle = $state($appConfig?.ai_writing_style ?? '');
let aiShowKey = $state(false);
let aiTestLoading = $state(false);
let aiTestMessage = $state<{ type: 'success' | 'error'; text: string } | null>(null);
const anthropicModels = [
{ value: 'claude-sonnet-4-5-20250929', label: 'Claude Sonnet 4.5', desc: 'Balanced' },
{ value: 'claude-sonnet-4-6', label: 'Claude Sonnet 4.6', desc: 'Balanced' },
{ value: 'claude-opus-4-6', label: 'Claude Opus 4.6', desc: 'Most capable' },
{ value: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5', desc: 'Fast' },
];
@@ -228,13 +244,15 @@
let aiModels = $derived(aiProvider === 'openai' ? openaiModels : anthropicModels);
async function saveAiSettings() {
await setAiSettings(aiProvider, aiApiKey || null, aiModel, aiWritingStyle || null);
const baseUrl = aiProvider === 'ollama' ? (_ollamaBaseUrl || null) : null;
await setAiSettings(aiProvider, aiApiKey || null, aiModel, aiWritingStyle || null, baseUrl);
if ($appConfig) {
$appConfig = {
...$appConfig,
ai_provider: aiProvider,
ai_api_key: _anthropicKey || null,
openai_api_key: _openaiKey || null,
ollama_base_url: _ollamaBaseUrl || null,
ai_model: aiModel,
ai_writing_style: aiWritingStyle || null,
};
@@ -502,9 +520,9 @@
{#if $showSettings}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="settings-overlay" onclick={close} onkeydown={(e) => { if (e.key === 'Escape') close(); }}>
<div class="settings-overlay" class:mobile={isMobile} onclick={close} onkeydown={(e) => { if (e.key === 'Escape') close(); }}>
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="settings-panel" onclick={(e) => e.stopPropagation()}>
<div class="settings-panel" class:mobile={isMobile} onclick={(e) => e.stopPropagation()}>
<div class="settings-header">
<h2>Settings</h2>
<button class="close-btn" onclick={close}>
@@ -535,18 +553,22 @@
</svg>
Styling
</button>
{#if !isMobile}
<button class="tab-btn" class:active={activeTab === 'import'} onclick={() => activeTab = 'import'}>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 3v12"/><path d="m8 11 4 4 4-4"/><path d="M8 5H4a2 2 0 00-2 2v10a2 2 0 002 2h16a2 2 0 002-2V7a2 2 0 00-2-2h-4"/>
</svg>
Import
</button>
{/if}
{#if !isMobile}
<button class="tab-btn" class:active={activeTab === 'backup'} onclick={() => { activeTab = 'backup'; loadBackups(); }}>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 12a9 9 0 00-9-9 9.75 9.75 0 00-6.74 2.74L3 8"/><path d="M3 3v5h5"/><path d="M3 12a9 9 0 009 9 9.75 9.75 0 006.74-2.74L21 16"/><path d="M16 16h5v5"/>
</svg>
Backup
</button>
{/if}
<button class="tab-btn" class:active={activeTab === 'ai'} onclick={() => activeTab = 'ai'}>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 8V4l-2-2"/><rect x="4" y="8" width="16" height="12" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M9 13v2"/><path d="M15 13v2"/>
@@ -586,6 +608,20 @@
</div>
</div>
{#if isMobile}
<div class="settings-section">
<h3>Vault</h3>
<p class="setting-desc" style="margin-bottom: 12px; color: var(--text-tertiary); font-size: 13px;">Current: <strong style="color: var(--text-primary);">{$appConfig?.active_vault?.split('/').pop() ?? 'Unknown'}</strong></p>
<button class="import-btn" onclick={() => { $showSettings = false; $vaultReady = false; }}>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z"/>
</svg>
Switch Vault
</button>
</div>
{/if}
{#if !isMobile}
<div class="settings-section">
<h3>Performance</h3>
<label class="setting-toggle">
@@ -631,6 +667,7 @@
</label>
{/if}
</div>
{/if}
</div>
{:else if activeTab === 'editor'}
<div class="tab-content">
@@ -645,6 +682,7 @@
<span class="toggle-knob"></span>
</button>
</label>
{#if !isMobile}
<label class="setting-toggle" style="margin-top: 12px;">
<span class="setting-label">
<span class="setting-name">Show line numbers</span>
@@ -654,6 +692,7 @@
<span class="toggle-knob"></span>
</button>
</label>
{/if}
<label class="setting-toggle" style="margin-top: 12px;">
<span class="setting-label">
<span class="setting-name">Open notes in View Mode</span>
@@ -678,6 +717,7 @@
</label>
</div>
{#if !isMobile}
<div class="settings-section">
<h3>PDF Preview</h3>
<label class="setting-toggle">
@@ -709,6 +749,7 @@
<span class="setting-hint">Default height for PDF previews in notes</span>
</div>
{/if}
{/if}
</div>
{:else if activeTab === 'styling'}
<div class="tab-content">
@@ -845,6 +886,7 @@
</label>
<div class="backup-actions">
{#if !isMobile}
<button class="backup-link-btn" onclick={handleSelectBackupFolder}>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z"/>
@@ -854,6 +896,7 @@
{#if $appConfig?.backup_location}
<p class="backup-path">{$appConfig.backup_location}</p>
{/if}
{/if}
<button class="backup-link-btn" onclick={handleBackupNow} disabled={backupLoading}>
{#if backupLoading}
<svg class="spinner-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10" opacity="0.25" /><path d="M12 2a10 10 0 019.95 9" /></svg>
@@ -981,52 +1024,86 @@
<h3>Provider</h3>
<div class="setting-options">
<button class="option-btn" class:active={!aiProvider} onclick={() => { if (!aiProvider) return; aiProvider = null; aiTestMessage = null; saveAiSettings(); }}>Disabled</button>
<button class="option-btn" class:active={aiProvider === 'anthropic'} onclick={() => { if (aiProvider === 'anthropic') return; aiProvider = 'anthropic'; aiModel = 'claude-sonnet-4-5-20250929'; aiTestMessage = null; saveAiSettings(); }}>Anthropic</button>
<button class="option-btn" class:active={aiProvider === 'ollama'} onclick={() => { if (aiProvider === 'ollama') return; aiProvider = 'ollama'; aiModel = 'gemma3:4b'; aiTestMessage = null; saveAiSettings(); }}>Ollama</button>
<button class="option-btn" class:active={aiProvider === 'anthropic'} onclick={() => { if (aiProvider === 'anthropic') return; aiProvider = 'anthropic'; aiModel = 'claude-sonnet-4-6'; aiTestMessage = null; saveAiSettings(); }}>Anthropic</button>
<button class="option-btn" class:active={aiProvider === 'openai'} onclick={() => { if (aiProvider === 'openai') return; aiProvider = 'openai'; aiModel = 'gpt-5.2'; aiTestMessage = null; saveAiSettings(); }}>OpenAI</button>
</div>
</div>
{#if aiProvider}
<div class="settings-section">
<h3>API Key</h3>
<div class="ai-key-row">
{#if aiProvider === 'ollama'}
<p class="setting-hint" style="color: var(--text-success, #4ade80); margin-top: -4px; margin-bottom: 12px;">Your data stays on your device. No text is sent to any external server.</p>
{:else}
<p class="setting-hint" style="color: var(--text-warning, #f59e0b); margin-top: -4px; margin-bottom: 12px;">Your selected text and note content will be sent to {aiProvider === 'openai' ? 'OpenAI' : 'Anthropic'} servers for processing.</p>
{/if}
{#if aiProvider === 'ollama'}
<div class="settings-section">
<h3>Server URL</h3>
<input
type={aiShowKey ? 'text' : 'password'}
type="text"
class="ai-key-input"
placeholder={aiProvider === 'openai' ? 'sk-...' : 'sk-ant-...'}
value={aiApiKey}
oninput={(e) => { const v = (e.target as HTMLInputElement).value; if (aiProvider === 'openai') _openaiKey = v; else _anthropicKey = v; }}
placeholder="http://localhost:11434"
value={_ollamaBaseUrl}
oninput={(e) => { _ollamaBaseUrl = (e.target as HTMLInputElement).value; }}
onblur={saveAiSettings}
/>
<button class="ai-key-toggle" onclick={() => aiShowKey = !aiShowKey} title={aiShowKey ? 'Hide' : 'Show'}>
{#if aiShowKey}
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>
{:else}
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
{/if}
</button>
<p class="setting-hint">Ollama server address. Install from <a href="https://ollama.com" target="_blank" class="ai-link">ollama.com</a></p>
</div>
{#if aiProvider === 'openai'}
<p class="setting-hint">Get your API key from <a href="https://platform.openai.com/api-keys" target="_blank" class="ai-link">platform.openai.com</a></p>
{:else}
<p class="setting-hint">Get your API key from <a href="https://console.anthropic.com/settings/keys" target="_blank" class="ai-link">console.anthropic.com</a></p>
{/if}
</div>
{:else}
<div class="settings-section">
<h3>API Key</h3>
<div class="ai-key-row">
<input
type={aiShowKey ? 'text' : 'password'}
class="ai-key-input"
placeholder={aiProvider === 'openai' ? 'sk-...' : 'sk-ant-...'}
value={aiApiKey}
oninput={(e) => { const v = (e.target as HTMLInputElement).value; if (aiProvider === 'openai') _openaiKey = v; else _anthropicKey = v; }}
onblur={saveAiSettings}
/>
<button class="ai-key-toggle" onclick={() => aiShowKey = !aiShowKey} title={aiShowKey ? 'Hide' : 'Show'}>
{#if aiShowKey}
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>
{:else}
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
{/if}
</button>
</div>
{#if aiProvider === 'openai'}
<p class="setting-hint">Get your API key from <a href="https://platform.openai.com/api-keys" target="_blank" class="ai-link">platform.openai.com</a></p>
{:else}
<p class="setting-hint">Get your API key from <a href="https://console.anthropic.com/settings/keys" target="_blank" class="ai-link">console.anthropic.com</a></p>
{/if}
</div>
{/if}
<div class="settings-section">
<h3>Model</h3>
<div class="ai-model-options">
{#each aiModels as m}
<button
class="ai-model-btn"
class:active={aiModel === m.value}
onclick={() => { aiModel = m.value; saveAiSettings(); }}
>
<span class="ai-model-name">{m.label}</span>
<span class="ai-model-desc">{m.desc}</span>
</button>
{/each}
</div>
{#if aiProvider === 'ollama'}
<input
type="text"
class="ai-key-input"
placeholder="gemma3:4b"
value={aiModel}
oninput={(e) => { aiModel = (e.target as HTMLInputElement).value; }}
onblur={saveAiSettings}
/>
<p class="setting-hint">Enter the model name as shown by <code>ollama list</code></p>
{:else}
<div class="ai-model-options">
{#each aiModels as m}
<button
class="ai-model-btn"
class:active={aiModel === m.value}
onclick={() => { aiModel = m.value; saveAiSettings(); }}
>
<span class="ai-model-name">{m.label}</span>
<span class="ai-model-desc">{m.desc}</span>
</button>
{/each}
</div>
{/if}
</div>
<div class="settings-section">
@@ -1044,7 +1121,7 @@
<div class="settings-section">
<h3>Connection</h3>
<button class="import-btn" onclick={handleTestAi} disabled={aiTestLoading || !aiApiKey}>
<button class="import-btn" onclick={handleTestAi} disabled={aiTestLoading || (aiProvider !== 'ollama' && !aiApiKey)}>
{#if aiTestLoading}
<svg class="spinner-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10" opacity="0.25" /><path d="M12 2a10 10 0 019.95 9" /></svg>
Testing...
@@ -1067,7 +1144,11 @@
<div class="settings-section">
<h3>Usage</h3>
{#if isMobile}
<p class="import-desc">Use the AI button in the toolbar or header to access AI writing tools: improve, fix grammar, rewrite, summarize, translate, and more.</p>
{:else}
<p class="import-desc">Select text in the editor and right-click to access AI writing tools: improve, fix grammar, rewrite, summarize, translate, and more.</p>
{/if}
</div>
{/if}
</div>
@@ -1133,6 +1214,13 @@
<p>Update via your AUR helper:</p>
<code>yay -Syu helixnotes</code>
</div>
{:else if $installType === 'android'}
<button class="update-install-btn" onclick={() => { openUrl('https://helixnotes.com/#download').catch(() => {}); }}>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/>
</svg>
Download from Website
</button>
{:else}
<a class="update-install-btn" href="https://codeberg.org/ArkHost/HelixNotes/releases" target="_blank" rel="noopener">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -2047,4 +2135,111 @@
color: var(--accent);
}
/* ═══ Mobile ═══ */
.settings-overlay.mobile {
align-items: stretch;
justify-content: stretch;
}
.settings-panel.mobile {
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
border: none;
}
.settings-panel.mobile .settings-content {
flex-direction: column;
}
.settings-panel.mobile .settings-tabs {
flex-direction: row;
min-width: 0;
border-right: none;
border-bottom: 1px solid var(--border-light);
padding: 8px 8px 0;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
gap: 0;
}
.settings-panel.mobile .settings-tabs::-webkit-scrollbar {
display: none;
}
.settings-panel.mobile .tab-btn {
flex-shrink: 0;
flex-direction: column;
gap: 4px;
padding: 8px 14px 10px;
font-size: 11px;
border-radius: 8px 8px 0 0;
}
.settings-panel.mobile .tab-btn.active {
border-bottom: 2px solid var(--accent);
border-radius: 8px 8px 0 0;
}
.settings-panel.mobile .settings-header {
padding-top: calc(env(safe-area-inset-top, 12px) + 12px);
}
.settings-panel.mobile .settings-body {
padding: 16px;
}
.settings-panel.mobile .setting-name {
font-size: 14px;
}
.settings-panel.mobile .setting-desc {
font-size: 12px;
}
.settings-panel.mobile .toggle-switch {
width: 44px;
height: 26px;
}
.settings-panel.mobile .toggle-knob {
width: 22px;
height: 22px;
}
.settings-panel.mobile .toggle-switch.on .toggle-knob {
transform: translateX(18px);
}
.settings-panel.mobile .option-btn {
padding: 12px 10px;
font-size: 14px;
}
.settings-panel.mobile .theme-btn {
padding: 12px 10px;
font-size: 14px;
}
.settings-panel.mobile .accent-grid {
grid-template-columns: repeat(4, 1fr);
gap: 10px;
}
.settings-panel.mobile .accent-swatch {
padding: 14px 8px;
}
.settings-panel.mobile .font-size-options {
gap: 8px;
}
.settings-panel.mobile .font-size-btn {
padding: 12px 6px;
}
</style>
+65 -8
View File
@@ -51,11 +51,23 @@
export async function refresh() {
try {
$notebooks = await getNotebooks();
$tags = await getAllTags();
$notebookIcons = await getNotebookIcons();
const qaNotes = await getQuickAccess();
$quickAccessPaths = qaNotes.map(n => n.relative_path);
if (isMobile) {
// On mobile, parallelize and skip getAllTags (derive from $notes instead)
const [nbs, icons, qaNotes] = await Promise.all([
getNotebooks(),
getNotebookIcons(),
getQuickAccess(),
]);
$notebooks = nbs;
$notebookIcons = icons;
$quickAccessPaths = qaNotes.map(n => n.relative_path);
} else {
$notebooks = await getNotebooks();
$tags = await getAllTags();
$notebookIcons = await getNotebookIcons();
const qaNotes = await getQuickAccess();
$quickAccessPaths = qaNotes.map(n => n.relative_path);
}
} catch (e) {
console.error('Failed to refresh sidebar:', e);
}
@@ -271,9 +283,18 @@
return convertFileSrc(`${vaultRoot}/${iconPath}`);
}
function clampMenu(x: number, y: number, menuWidth = 220, menuHeight = 300): { x: number; y: number } {
if (x + menuWidth > window.innerWidth) x = window.innerWidth - menuWidth - 8;
if (y + menuHeight > window.innerHeight) y = window.innerHeight - menuHeight - 8;
if (x < 4) x = 4;
if (y < 4) y = 4;
return { x, y };
}
function onContextMenu(e: MouseEvent, nb: NotebookEntry) {
e.preventDefault();
contextMenu = { x: e.clientX, y: e.clientY, notebook: nb };
const { x, y } = clampMenu(e.clientX, e.clientY);
contextMenu = { x, y, notebook: nb };
}
function closeContextMenu() {
@@ -283,7 +304,8 @@
function onTrashContextMenu(e: MouseEvent) {
e.preventDefault();
e.stopPropagation();
trashContextMenu = { x: e.clientX, y: e.clientY };
const { x, y } = clampMenu(e.clientX, e.clientY, 180, 60);
trashContextMenu = { x, y };
}
async function handleEmptyTrash() {
@@ -310,6 +332,7 @@
<svelte:window onclick={handleWindowClick} />
<aside class="sidebar" class:collapsed={$sidebarCollapsed} class:mobile={isMobile}>
{#if !isMobile}
<div class="sidebar-header">
<button class="collapse-btn" onclick={() => ($sidebarCollapsed = !$sidebarCollapsed)} title="Toggle sidebar">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -329,6 +352,7 @@
</button>
{/if}
</div>
{/if}
{#if !$sidebarCollapsed}
<nav class="sidebar-nav">
@@ -425,9 +449,32 @@
{@render notebookItem(nb, 0)}
{/each}
</div>
{#if isMobile && $tags.length > 0}
<div class="tags-section-inline">
<button class="section-header" onclick={() => tagsCollapsed = !tagsCollapsed}>
<span class="section-title">Tags</span>
<span class="tag-count" style="margin-left: auto">{$tags.length}</span>
</button>
{#if !tagsCollapsed}
<div class="tag-list">
{#each $tags as [tag, count]}
<button
class="tag-item"
class:active={$viewMode === 'tag' && $activeTag === tag}
onclick={() => selectTag(tag)}
>
<span class="tag-hash">#</span>
<span class="tag-name">{tag}</span>
<span class="tag-count">{count}</span>
</button>
{/each}
</div>
{/if}
</div>
{/if}
</div>
{#if $tags.length > 0}
{#if !isMobile && $tags.length > 0}
<div class="tags-section">
<button class="section-header" onclick={() => tagsCollapsed = !tagsCollapsed}>
<span class="section-title">Tags</span>
@@ -1052,6 +1099,16 @@
height: 20px;
}
.sidebar.mobile .section {
padding-bottom: 180px;
}
.sidebar.mobile .tags-section-inline {
border-top: 1px solid var(--border-light);
padding: 4px 0;
margin-top: 8px;
}
.sidebar.mobile .section-header {
padding: 12px 16px 6px;
min-height: 44px;
+238 -7
View File
@@ -11,12 +11,56 @@
let recentVaults: VaultConfig[] = $derived($appConfig?.vaults ?? []);
let loading = $state(false);
let error = $state('');
let vaultName = $state('HelixNotes');
let hasPermission = $state(!isMobile);
let selectedLocation = $state('Documents');
let customPath = $state('');
const storageLocations = [
{ label: 'Documents', path: '/storage/emulated/0/Documents' },
{ label: 'Downloads', path: '/storage/emulated/0/Download' },
{ label: 'Internal Storage', path: '/storage/emulated/0' },
];
if (isMobile) {
checkPermission();
setTimeout(checkPermission, 500);
(window as any).__storagePermissionGranted = () => { hasPermission = true; };
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === 'visible') setTimeout(checkPermission, 300);
});
}
function checkPermission() {
try {
const bridge = (window as any).Android;
if (bridge?.hasStoragePermission) {
hasPermission = bridge.hasStoragePermission() === true;
}
} catch { /* bridge not ready */ }
}
function requestPermission() {
try {
const bridge = (window as any).Android;
bridge?.requestStoragePermission?.();
} catch {
error = 'Go to Settings > Apps > HelixNotes > Permissions and enable "All files access".';
}
}
function getMobileBasePath(): string {
if (selectedLocation === 'Custom') {
return customPath.trim() || '/storage/emulated/0/Documents';
}
return storageLocations.find(l => l.label === selectedLocation)?.path || '/storage/emulated/0/Documents';
}
let fullPath = $derived(isMobile ? `${getMobileBasePath()}/${vaultName.trim() || 'HelixNotes'}` : '');
async function pickFolder() {
if (isMobile) {
// Use shared Documents folder for Syncthing/Nextcloud compatibility
const vaultPath = '/storage/emulated/0/Documents/HelixNotes';
await openSelectedVault(vaultPath);
await openSelectedVault(fullPath);
} else {
const selected = await open({ directory: true, multiple: false, title: 'Choose Notes Folder' });
if (selected) {
@@ -29,6 +73,12 @@
loading = true;
error = '';
try {
if (isMobile) {
try {
const bridge = (window as any).Android;
bridge?.prepareVaultDir?.(path);
} catch { /* Rust will retry mkdir itself */ }
}
await openVault(path);
const config = await getAppConfig();
$appConfig = config;
@@ -68,7 +118,41 @@
<h1>HelixNotes</h1>
<p class="subtitle">Local markdown notes</p>
{#if isMobile}
<p class="description">Notes are stored in Documents/HelixNotes as Markdown files. Sync with Nextcloud, Syncthing, or any file sync app.</p>
<p class="description">Choose where to store your notes. Sync with Syncthing, Nextcloud, or any file sync app.</p>
{#if !hasPermission}
<button class="btn-permission" onclick={requestPermission}>
Grant File Access
</button>
<p class="permission-hint">Required to access Documents, Downloads, and other shared folders.</p>
{/if}
<div class="location-selector">
<label class="location-label">Location</label>
<div class="location-options">
{#each storageLocations as loc}
<button
class="location-option"
class:active={selectedLocation === loc.label}
onclick={() => selectedLocation = loc.label}
>{loc.label}</button>
{/each}
<button
class="location-option"
class:active={selectedLocation === 'Custom'}
onclick={() => selectedLocation = 'Custom'}
>Custom</button>
</div>
{#if selectedLocation === 'Custom'}
<input class="custom-path-input" type="text" bind:value={customPath} placeholder="/storage/emulated/0/..." />
{/if}
</div>
<div class="vault-name-input">
<label for="vault-name">Vault name</label>
<div class="vault-name-preview"><input id="vault-name" type="text" bind:value={vaultName} placeholder="HelixNotes" /></div>
<span class="vault-path-hint">{fullPath}</span>
</div>
{:else}
<p class="description">Your notes are stored as standard Markdown (.md) files. Pick any folder — existing .md files will be recognized automatically.</p>
{/if}
@@ -87,13 +171,13 @@
{/if}
</button>
{#if !isMobile && $appConfig?.active_vault}
{#if $appConfig?.active_vault}
<button class="btn-back" onclick={() => ($vaultReady = true)}>
Back
</button>
{/if}
{#if !isMobile && recentVaults.length > 0}
{#if recentVaults.length > 0}
<div class="recent">
<span class="recent-label">Recent</span>
{#each recentVaults as vault}
@@ -110,11 +194,13 @@
<style>
.vault-picker {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
height: 100dvh;
background: var(--bg-primary);
position: relative;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.window-controls {
@@ -148,6 +234,9 @@
max-width: 400px;
width: 100%;
padding: 48px 32px;
padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px));
margin: auto;
flex-shrink: 0;
}
.logo {
@@ -276,6 +365,130 @@
white-space: nowrap;
}
.vault-name-input {
margin-bottom: 20px;
text-align: left;
}
.vault-name-input label {
display: block;
font-size: 12px;
font-weight: 500;
color: var(--text-tertiary);
margin-bottom: 6px;
}
.vault-name-preview {
display: flex;
align-items: center;
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 8px;
padding: 10px 12px;
font-size: 14px;
color: var(--text-tertiary);
}
.vault-name-preview input {
background: none;
border: none;
outline: none;
color: var(--text-primary);
font-size: 14px;
font-family: inherit;
width: 100%;
padding: 0;
}
.location-selector {
margin-bottom: 16px;
text-align: left;
}
.location-label {
display: block;
font-size: 12px;
font-weight: 500;
color: var(--text-tertiary);
margin-bottom: 6px;
}
.location-options {
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.location-option {
padding: 8px 14px;
border: 1px solid var(--border-color);
border-radius: 8px;
background: var(--bg-secondary);
color: var(--text-secondary);
font-size: 13px;
font-family: inherit;
cursor: pointer;
transition: all 0.15s;
}
.location-option.active {
background: var(--accent);
color: white;
border-color: var(--accent);
}
.custom-path-input {
width: 100%;
margin-top: 8px;
padding: 10px 12px;
background: var(--bg-secondary);
border: 1px solid var(--border-color);
border-radius: 8px;
color: var(--text-primary);
font-size: 13px;
font-family: inherit;
outline: none;
box-sizing: border-box;
}
.custom-path-input:focus {
border-color: var(--accent);
}
.vault-path-hint {
display: block;
font-size: 11px;
color: var(--text-tertiary);
margin-top: 6px;
opacity: 0.7;
word-break: break-all;
}
.btn-permission {
width: 100%;
padding: 12px 20px;
background: var(--accent);
color: white;
border: none;
border-radius: 10px;
font-size: 15px;
font-weight: 600;
cursor: pointer;
margin-bottom: 6px;
transition: background 0.15s;
}
.btn-permission:hover {
background: var(--accent-hover);
}
.permission-hint {
font-size: 12px;
color: var(--text-tertiary);
margin-bottom: 20px;
opacity: 0.7;
}
/* Mobile */
.mobile .btn-primary {
padding: 14px 20px;
@@ -295,4 +508,22 @@
width: 88px;
height: 88px;
}
.mobile .btn-back {
padding: 14px 20px;
font-size: 16px;
border-radius: 12px;
}
.mobile .vault-item {
padding: 14px 16px;
}
.mobile .vault-name {
font-size: 15px;
}
.mobile .vault-path {
font-size: 13px;
}
</style>
+32
View File
@@ -59,6 +59,7 @@ export const updateAvailable = writable<{
} | null>(null);
export const updateObj = writable<any>(null);
export const installType = writable<string>("native");
export const androidApkUrl = writable<string | null>(null);
export async function checkForUpdate() {
try {
@@ -73,6 +74,37 @@ export async function checkForUpdate() {
}
}
function isNewerVersion(remote: string, local: string): boolean {
const r = remote.split(".").map(Number);
const l = local.split(".").map(Number);
for (let i = 0; i < Math.max(r.length, l.length); i++) {
const rv = r[i] || 0;
const lv = l[i] || 0;
if (rv > lv) return true;
if (rv < lv) return false;
}
return false;
}
export async function checkForUpdateMobile() {
try {
const { getVersion } = await import("@tauri-apps/api/app");
const currentVersion = await getVersion();
const res = await fetch("https://helixnotes.com/latest.json");
if (!res.ok) return;
const data = await res.json();
if (data.version && isNewerVersion(data.version, currentVersion)) {
updateAvailable.set({ version: data.version, body: data.notes });
const android = data.platforms?.["android-universal"];
if (android?.url) {
androidApkUrl.set(android.url);
}
}
} catch {
// Silent fail
}
}
// Derived
export const sortedNotes = derived(
[notes, sortMode, viewMode],
+1
View File
@@ -60,6 +60,7 @@ export interface AppConfig {
ai_provider: string | null;
ai_api_key: string | null;
openai_api_key: string | null;
ollama_base_url: string | null;
ai_model: string;
ai_writing_style: string | null;
default_view_mode: boolean;
+6 -3
View File
@@ -1,7 +1,7 @@
<script lang="ts">
import { onMount } from 'svelte';
import '../app.css';
import { theme, appConfig, activeNotePath, installType, checkForUpdate } from '$lib/stores/app';
import { theme, appConfig, activeNotePath, installType, checkForUpdate, checkForUpdateMobile } from '$lib/stores/app';
import { openUrl } from '@tauri-apps/plugin-opener';
import { openFile, getInstallType } from '$lib/api';
import { get } from 'svelte/store';
@@ -33,9 +33,12 @@
return resolved.join('/');
}
// Detect install type and check for updates on startup (skip on mobile — updates via app store)
// Detect install type and check for updates on startup
onMount(() => {
if (!isMobile) {
if (isMobile) {
installType.set('android');
checkForUpdateMobile();
} else {
getInstallType().then(t => installType.set(t)).catch(() => {});
checkForUpdate();
}