Multi Feeds + Ron rss save
This commit is contained in:
@@ -20,6 +20,7 @@ serde_json = "1"
|
|||||||
easy-nostr = { path = "./easy-nostr" }
|
easy-nostr = { path = "./easy-nostr" }
|
||||||
tokio = { version = "1", features = ["full"] }
|
tokio = { version = "1", features = ["full"] }
|
||||||
feed-rs = "2.3.1"
|
feed-rs = "2.3.1"
|
||||||
|
ron = "0.8"
|
||||||
|
|
||||||
# FIX: default-features entfernt und rustls-tls hinzugefügt
|
# FIX: default-features entfernt und rustls-tls hinzugefügt
|
||||||
reqwest = { version = "0.12", default-features = false, features = ["json", "rustls-tls"] }
|
reqwest = { version = "0.12", default-features = false, features = ["json", "rustls-tls"] }
|
||||||
|
|||||||
@@ -10,9 +10,10 @@ pub fn run() {
|
|||||||
.invoke_handler(tauri::generate_handler![
|
.invoke_handler(tauri::generate_handler![
|
||||||
home::fetch_nostr_posts,
|
home::fetch_nostr_posts,
|
||||||
news::save_openrouter_key,
|
news::save_openrouter_key,
|
||||||
|
news::load_rss_config,
|
||||||
|
news::save_rss_urls, // Geändert von save_rss_url zu save_rss_urls
|
||||||
news::fetch_ai_news,
|
news::fetch_ai_news,
|
||||||
news::fetch_rss_news,
|
news::fetch_rss_news,
|
||||||
news::save_rss_url,
|
|
||||||
])
|
])
|
||||||
.run(tauri::generate_context!())
|
.run(tauri::generate_context!())
|
||||||
.expect("error while running tauri application");
|
.expect("error while running tauri application");
|
||||||
|
|||||||
@@ -1,22 +1,35 @@
|
|||||||
use serde::{Deserialize, Serialize};
|
use serde::{Deserialize, Serialize};
|
||||||
|
use std::fs;
|
||||||
|
use std::path::PathBuf;
|
||||||
use std::sync::Mutex;
|
use std::sync::Mutex;
|
||||||
use tauri::State;
|
use tauri::{AppHandle, Manager, State};
|
||||||
|
|
||||||
|
#[derive(Serialize, Deserialize, Default, Clone)]
|
||||||
|
pub struct RssConfig {
|
||||||
|
pub urls: Vec<String>,
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Default)]
|
#[derive(Default)]
|
||||||
pub struct NewsState {
|
pub struct NewsState {
|
||||||
pub openrouter_key: Mutex<String>,
|
pub openrouter_key: Mutex<String>,
|
||||||
pub rss_url: Mutex<String>, // Neu: Speicher für die RSS-URL
|
pub rss_config: Mutex<RssConfig>,
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Serialize, Deserialize, Clone)]
|
#[derive(Serialize, Deserialize, Clone, PartialEq, Debug)]
|
||||||
#[serde(rename_all = "camelCase")]
|
#[serde(rename_all = "camelCase")]
|
||||||
pub struct NewsArticle {
|
pub struct NewsArticle {
|
||||||
pub content: String,
|
pub content: String,
|
||||||
pub author: String,
|
pub author: String,
|
||||||
pub created_at: u64,
|
pub created_at: String,
|
||||||
|
}
|
||||||
|
|
||||||
|
fn get_config_path(app: &AppHandle) -> PathBuf {
|
||||||
|
app.path()
|
||||||
|
.app_config_dir()
|
||||||
|
.unwrap_or_else(|_| PathBuf::from("."))
|
||||||
|
.join("rss.ron")
|
||||||
}
|
}
|
||||||
|
|
||||||
// Bestehender Command für den API Key
|
|
||||||
#[tauri::command]
|
#[tauri::command]
|
||||||
pub async fn save_openrouter_key(key: String, state: State<'_, NewsState>) -> Result<(), String> {
|
pub async fn save_openrouter_key(key: String, state: State<'_, NewsState>) -> Result<(), String> {
|
||||||
let mut lock = state.openrouter_key.lock().map_err(|_| "Lock failed")?;
|
let mut lock = state.openrouter_key.lock().map_err(|_| "Lock failed")?;
|
||||||
@@ -24,11 +37,63 @@ pub async fn save_openrouter_key(key: String, state: State<'_, NewsState>) -> Re
|
|||||||
Ok(())
|
Ok(())
|
||||||
}
|
}
|
||||||
|
|
||||||
// NEU: Command zum Speichern der RSS URL
|
|
||||||
#[tauri::command]
|
#[tauri::command]
|
||||||
pub async fn save_rss_url(url: String, state: State<'_, NewsState>) -> Result<(), String> {
|
pub async fn load_rss_config(
|
||||||
let mut lock = state.rss_url.lock().map_err(|_| "Lock failed")?;
|
app: AppHandle,
|
||||||
*lock = url.trim().to_string();
|
state: State<'_, NewsState>,
|
||||||
|
) -> Result<Vec<String>, String> {
|
||||||
|
let path = get_config_path(&app);
|
||||||
|
|
||||||
|
// Initialisierung mit Standard-Feeds, falls Datei nicht existiert
|
||||||
|
if !path.exists() {
|
||||||
|
let default_urls = vec![
|
||||||
|
"https://www.nasa.gov/news-release/feed/".to_string(),
|
||||||
|
"https://www.heise.de/rss/heise-atom.xml".to_string(),
|
||||||
|
];
|
||||||
|
|
||||||
|
let config = RssConfig {
|
||||||
|
urls: default_urls.clone(),
|
||||||
|
};
|
||||||
|
|
||||||
|
if let Some(parent) = path.parent() {
|
||||||
|
fs::create_dir_all(parent).map_err(|e| e.to_string())?;
|
||||||
|
}
|
||||||
|
|
||||||
|
let ron_str = ron::to_string(&config).map_err(|e| e.to_string())?;
|
||||||
|
fs::write(&path, ron_str).map_err(|e| e.to_string())?;
|
||||||
|
|
||||||
|
let mut lock = state.rss_config.lock().unwrap();
|
||||||
|
lock.urls = default_urls.clone();
|
||||||
|
|
||||||
|
return Ok(default_urls);
|
||||||
|
}
|
||||||
|
|
||||||
|
let content = fs::read_to_string(path).map_err(|e| e.to_string())?;
|
||||||
|
let config: RssConfig = ron::from_str(&content).map_err(|e| e.to_string())?;
|
||||||
|
|
||||||
|
let mut lock = state.rss_config.lock().unwrap();
|
||||||
|
*lock = config.clone();
|
||||||
|
Ok(config.urls)
|
||||||
|
}
|
||||||
|
|
||||||
|
#[tauri::command]
|
||||||
|
pub async fn save_rss_urls(
|
||||||
|
urls: Vec<String>,
|
||||||
|
app: AppHandle,
|
||||||
|
state: State<'_, NewsState>,
|
||||||
|
) -> Result<(), String> {
|
||||||
|
let config = RssConfig { urls };
|
||||||
|
let path = get_config_path(&app);
|
||||||
|
|
||||||
|
if let Some(parent) = path.parent() {
|
||||||
|
fs::create_dir_all(parent).map_err(|e| e.to_string())?;
|
||||||
|
}
|
||||||
|
|
||||||
|
let ron_str = ron::to_string(&config).map_err(|e| e.to_string())?;
|
||||||
|
fs::write(path, ron_str).map_err(|e| e.to_string())?;
|
||||||
|
|
||||||
|
let mut lock = state.rss_config.lock().unwrap();
|
||||||
|
*lock = config;
|
||||||
Ok(())
|
Ok(())
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -39,79 +104,74 @@ pub async fn fetch_ai_news(state: State<'_, NewsState>) -> Result<Vec<NewsArticl
|
|||||||
.lock()
|
.lock()
|
||||||
.map_err(|_| "Lock failed")?
|
.map_err(|_| "Lock failed")?
|
||||||
.clone();
|
.clone();
|
||||||
|
|
||||||
if key.is_empty() {
|
if key.is_empty() {
|
||||||
return Err("API Key fehlt.".to_string());
|
return Err("API Key fehlt.".into());
|
||||||
}
|
}
|
||||||
|
|
||||||
let client = reqwest::Client::new();
|
let client = reqwest::Client::new();
|
||||||
let body = serde_json::json!({
|
|
||||||
"model": "minimax/minimax-m2.1",
|
|
||||||
"messages": [
|
|
||||||
{"role": "system", "content": "Kurze News, 1-2 Sätze, Deutsch."},
|
|
||||||
{"role": "user", "content": "Tech-News."}
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
let response = client
|
let response = client
|
||||||
.post("https://openrouter.ai/api/v1/chat/completions")
|
.post("https://openrouter.ai/api/v1/chat/completions")
|
||||||
.header("Authorization", format!("Bearer {}", key))
|
.header("Authorization", format!("Bearer {}", key))
|
||||||
.json(&body)
|
.json(&serde_json::json!({
|
||||||
|
"model": "minimax/minimax-m2.1",
|
||||||
|
"messages": [
|
||||||
|
{"role": "system", "content": "Kurze News, 1-2 Sätze, Deutsch."},
|
||||||
|
{"role": "user", "content": "Tech-News."}
|
||||||
|
]
|
||||||
|
}))
|
||||||
.send()
|
.send()
|
||||||
.await
|
.await
|
||||||
.map_err(|e| e.to_string())?;
|
.map_err(|e| e.to_string())?;
|
||||||
|
|
||||||
let json_res: serde_json::Value = response.json().await.map_err(|e| e.to_string())?;
|
let json: serde_json::Value = response.json().await.map_err(|e| e.to_string())?;
|
||||||
let content = json_res["choices"][0]["message"]["content"]
|
let content = json["choices"][0]["message"]["content"]
|
||||||
.as_str()
|
.as_str()
|
||||||
.unwrap_or("Fehler")
|
.unwrap_or("Fehler")
|
||||||
.to_string();
|
.to_string();
|
||||||
|
|
||||||
Ok(vec![NewsArticle {
|
Ok(vec![NewsArticle {
|
||||||
content,
|
content,
|
||||||
author: "OpenRouter AI".to_string(),
|
author: "OpenRouter AI".into(),
|
||||||
created_at: 0,
|
created_at: "Gerade eben".into(),
|
||||||
}])
|
}])
|
||||||
}
|
}
|
||||||
|
|
||||||
// VERBESSERT: Lädt nun den echten Feed von der gespeicherten URL
|
|
||||||
#[tauri::command]
|
#[tauri::command]
|
||||||
pub async fn fetch_rss_news(state: State<'_, NewsState>) -> Result<Vec<NewsArticle>, String> {
|
pub async fn fetch_rss_news(state: State<'_, NewsState>) -> Result<Vec<NewsArticle>, String> {
|
||||||
let url = state.rss_url.lock().map_err(|_| "Lock failed")?.clone();
|
let urls = state.rss_config.lock().unwrap().urls.clone();
|
||||||
|
let mut all_articles = Vec::new();
|
||||||
|
let client = reqwest::Client::new();
|
||||||
|
|
||||||
if url.is_empty() {
|
for url in urls {
|
||||||
return Err("RSS URL fehlt. Bitte in den Einstellungen eintragen.".to_string());
|
if let Ok(res) = client.get(&url).send().await {
|
||||||
|
if let Ok(bytes) = res.bytes().await {
|
||||||
|
if let Ok(feed) = feed_rs::parser::parse(&bytes[..]) {
|
||||||
|
let source = feed
|
||||||
|
.title
|
||||||
|
.map(|t| t.content)
|
||||||
|
.unwrap_or_else(|| "RSS".into());
|
||||||
|
|
||||||
|
for entry in feed.entries.into_iter().take(3) {
|
||||||
|
let date = entry
|
||||||
|
.published
|
||||||
|
.or(entry.updated)
|
||||||
|
.map(|d| d.format("%d.%m.%Y %H:%M").to_string())
|
||||||
|
.unwrap_or_else(|| "--.--.----".into());
|
||||||
|
|
||||||
|
all_articles.push(NewsArticle {
|
||||||
|
content: format!(
|
||||||
|
"### {}\n\n{}",
|
||||||
|
entry.title.map(|t| t.content).unwrap_or_default(),
|
||||||
|
entry.summary.map(|s| s.content).unwrap_or_default()
|
||||||
|
),
|
||||||
|
author: source.clone(),
|
||||||
|
created_at: date,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
Ok(all_articles)
|
||||||
let response = reqwest::get(&url)
|
|
||||||
.await
|
|
||||||
.map_err(|e| e.to_string())?
|
|
||||||
.bytes()
|
|
||||||
.await
|
|
||||||
.map_err(|e| e.to_string())?;
|
|
||||||
|
|
||||||
let feed = feed_rs::parser::parse(&response[..]).map_err(|e| e.to_string())?;
|
|
||||||
|
|
||||||
let articles = feed
|
|
||||||
.entries
|
|
||||||
.into_iter()
|
|
||||||
.take(5)
|
|
||||||
.map(|entry| NewsArticle {
|
|
||||||
content: format!(
|
|
||||||
"### {}\n\n{}",
|
|
||||||
entry.title.map(|t| t.content).unwrap_or_default(),
|
|
||||||
entry
|
|
||||||
.summary
|
|
||||||
.map(|s| s.content)
|
|
||||||
.unwrap_or_else(|| "Kein Inhalt".to_string())
|
|
||||||
),
|
|
||||||
author: feed
|
|
||||||
.title
|
|
||||||
.as_ref()
|
|
||||||
.map(|t| t.content.clone())
|
|
||||||
.unwrap_or_else(|| "RSS".into()),
|
|
||||||
created_at: entry.updated.map(|d| d.timestamp() as u64).unwrap_or(0),
|
|
||||||
})
|
|
||||||
.collect();
|
|
||||||
|
|
||||||
Ok(articles)
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -22,17 +22,16 @@ pub enum NewsMode {
|
|||||||
pub struct NewsArticle {
|
pub struct NewsArticle {
|
||||||
pub content: String,
|
pub content: String,
|
||||||
pub author: String,
|
pub author: String,
|
||||||
pub created_at: u64,
|
pub created_at: String,
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Serialize)]
|
#[derive(Serialize)]
|
||||||
struct StringArgs {
|
struct StringArgs {
|
||||||
pub key: String,
|
key: String,
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Serialize)]
|
#[derive(Serialize)]
|
||||||
struct UrlArgs {
|
struct UrlsArgs {
|
||||||
pub url: String,
|
urls: Vec<String>,
|
||||||
}
|
}
|
||||||
|
|
||||||
#[function_component(News)]
|
#[function_component(News)]
|
||||||
@@ -41,203 +40,203 @@ pub fn news() -> Html {
|
|||||||
let error_msg = use_state(|| None::<String>);
|
let error_msg = use_state(|| None::<String>);
|
||||||
let show_config = use_state(|| false);
|
let show_config = use_state(|| false);
|
||||||
let current_mode = use_state(|| NewsMode::Ai);
|
let current_mode = use_state(|| NewsMode::Ai);
|
||||||
let api_key_ref = use_node_ref();
|
let rss_urls = use_state(Vec::<String>::new);
|
||||||
let rss_url_ref = use_node_ref();
|
|
||||||
|
|
||||||
|
let api_key_ref = use_node_ref();
|
||||||
|
let new_url_ref = use_node_ref();
|
||||||
|
|
||||||
|
// Init: Konfiguration laden
|
||||||
|
{
|
||||||
|
let rss_urls = rss_urls.clone();
|
||||||
|
use_effect_with((), move |_| {
|
||||||
|
spawn_local(async move {
|
||||||
|
if let Ok(res) = invoke("load_rss_config", JsValue::NULL).await {
|
||||||
|
if let Ok(urls) = serde_wasm_bindgen::from_value::<Vec<String>>(res) {
|
||||||
|
rss_urls.set(urls);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|| ()
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// News laden Funktion
|
||||||
let load_news = {
|
let load_news = {
|
||||||
let articles = articles.clone();
|
let articles = articles.clone();
|
||||||
let error_msg = error_msg.clone();
|
let error_msg = error_msg.clone();
|
||||||
let current_mode = current_mode.clone();
|
let mode = *current_mode;
|
||||||
|
Callback::from(move |_| {
|
||||||
Callback::from(move |_e: MouseEvent| {
|
|
||||||
let articles = articles.clone();
|
let articles = articles.clone();
|
||||||
let error_msg = error_msg.clone();
|
let error_msg = error_msg.clone();
|
||||||
let mode = *current_mode;
|
|
||||||
|
|
||||||
articles.set(None);
|
articles.set(None);
|
||||||
error_msg.set(None);
|
error_msg.set(None);
|
||||||
|
|
||||||
spawn_local(async move {
|
spawn_local(async move {
|
||||||
let command = match mode {
|
let cmd = if mode == NewsMode::Ai {
|
||||||
NewsMode::Ai => "fetch_ai_news",
|
"fetch_ai_news"
|
||||||
NewsMode::Rss => "fetch_rss_news",
|
} else {
|
||||||
|
"fetch_rss_news"
|
||||||
};
|
};
|
||||||
|
match invoke(cmd, JsValue::NULL).await {
|
||||||
match invoke(command, JsValue::NULL).await {
|
Ok(res) => {
|
||||||
Ok(res) => match serde_wasm_bindgen::from_value::<Vec<NewsArticle>>(res) {
|
let data = serde_wasm_bindgen::from_value::<Vec<NewsArticle>>(res)
|
||||||
Ok(new_news) => articles.set(Some(new_news)),
|
.unwrap_or_default();
|
||||||
Err(e) => error_msg.set(Some(format!("Datenfehler: {}", e))),
|
articles.set(Some(data));
|
||||||
},
|
|
||||||
Err(e) => {
|
|
||||||
let msg = e.as_string().unwrap_or_else(|| "Fehler beim Laden".into());
|
|
||||||
error_msg.set(Some(msg));
|
|
||||||
}
|
}
|
||||||
|
Err(e) => error_msg.set(Some(e.as_string().unwrap_or_default())),
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
let save_settings = {
|
// Automatisches Laden bei Modus-Wechsel
|
||||||
let show_config = show_config.clone();
|
|
||||||
let api_key_ref = api_key_ref.clone();
|
|
||||||
let rss_url_ref = rss_url_ref.clone();
|
|
||||||
let load_news = load_news.clone();
|
|
||||||
|
|
||||||
Callback::from(move |_| {
|
|
||||||
let key = api_key_ref.cast::<HtmlInputElement>().unwrap().value();
|
|
||||||
let url = rss_url_ref.cast::<HtmlInputElement>().unwrap().value();
|
|
||||||
let show_config_handle = show_config.clone();
|
|
||||||
let load_news_handle = load_news.clone();
|
|
||||||
|
|
||||||
spawn_local(async move {
|
|
||||||
let key_args = serde_wasm_bindgen::to_value(&StringArgs { key }).unwrap();
|
|
||||||
let url_args = serde_wasm_bindgen::to_value(&UrlArgs { url }).unwrap();
|
|
||||||
|
|
||||||
let _ = invoke("save_openrouter_key", key_args).await;
|
|
||||||
let _ = invoke("save_rss_url", url_args).await;
|
|
||||||
|
|
||||||
show_config_handle.set(false);
|
|
||||||
load_news_handle.emit(MouseEvent::new("click").unwrap());
|
|
||||||
});
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
let switch_mode = {
|
|
||||||
let current_mode = current_mode.clone();
|
|
||||||
let load_news = load_news.clone();
|
|
||||||
Callback::from(move |mode: NewsMode| {
|
|
||||||
current_mode.set(mode);
|
|
||||||
load_news.emit(MouseEvent::new("click").unwrap());
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
{
|
{
|
||||||
let load_news = load_news.clone();
|
let load_news = load_news.clone();
|
||||||
use_effect_with((), move |_| {
|
use_effect_with((*current_mode).clone(), move |_| {
|
||||||
load_news.emit(MouseEvent::new("click").unwrap());
|
load_news.emit(MouseEvent::new("click").unwrap());
|
||||||
|| ()
|
|| ()
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
let mode = *current_mode;
|
let save_settings = {
|
||||||
let is_config_visible = *show_config;
|
let rss_urls = rss_urls.clone();
|
||||||
|
let api_key_ref = api_key_ref.clone();
|
||||||
|
let show_config = show_config.clone();
|
||||||
|
let load_news = load_news.clone();
|
||||||
|
Callback::from(move |_| {
|
||||||
|
let key = api_key_ref
|
||||||
|
.cast::<HtmlInputElement>()
|
||||||
|
.map(|i| i.value())
|
||||||
|
.unwrap_or_default();
|
||||||
|
let urls = (*rss_urls).clone();
|
||||||
|
let show_config = show_config.clone();
|
||||||
|
let load_news = load_news.clone();
|
||||||
|
spawn_local(async move {
|
||||||
|
let _ = invoke(
|
||||||
|
"save_openrouter_key",
|
||||||
|
serde_wasm_bindgen::to_value(&StringArgs { key }).unwrap(),
|
||||||
|
)
|
||||||
|
.await;
|
||||||
|
let _ = invoke(
|
||||||
|
"save_rss_urls",
|
||||||
|
serde_wasm_bindgen::to_value(&UrlsArgs { urls }).unwrap(),
|
||||||
|
)
|
||||||
|
.await;
|
||||||
|
show_config.set(false);
|
||||||
|
load_news.emit(MouseEvent::new("click").unwrap());
|
||||||
|
});
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
html! {
|
html! {
|
||||||
<div class="feed-container">
|
<div class="feed-container">
|
||||||
<div class="feed-header">
|
<div class="feed-header">
|
||||||
<h1 class="feed-title">
|
<div class="header-main">
|
||||||
{ if mode == NewsMode::Ai { "📰 KI News" } else { "📻 RSS Feed" } }
|
<h1>{ if *current_mode == NewsMode::Ai { "📰 KI News" } else { "📻 RSS Feeds" } }</h1>
|
||||||
</h1>
|
<div class="mode-toggle">
|
||||||
|
|
||||||
<div style="display: flex; gap: 10px; align-items: center;">
|
|
||||||
<div class="mode-switch">
|
|
||||||
<button
|
<button
|
||||||
class={if mode == NewsMode::Ai { "switch-btn active-ai" } else { "switch-btn" }}
|
class={if *current_mode == NewsMode::Ai { "toggle-btn active" } else { "toggle-btn" }}
|
||||||
onclick={let switch = switch_mode.clone(); move |_| switch.emit(NewsMode::Ai)}
|
onclick={let m = current_mode.clone(); move |_| m.set(NewsMode::Ai)}>
|
||||||
>
|
|
||||||
{"KI"}
|
{"KI"}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
class={if mode == NewsMode::Rss { "switch-btn active-rss" } else { "switch-btn" }}
|
class={if *current_mode == NewsMode::Rss { "toggle-btn active" } else { "toggle-btn" }}
|
||||||
onclick={let switch = switch_mode.clone(); move |_| switch.emit(NewsMode::Rss)}
|
onclick={let m = current_mode.clone(); move |_| m.set(NewsMode::Rss)}>
|
||||||
>
|
|
||||||
{"RSS"}
|
{"RSS"}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<button class="reload-btn" onclick={let sc = show_config.clone(); move |_| sc.set(!*sc)}>
|
<div class="header-actions">
|
||||||
{"⚙️"}
|
<button class="action-btn" onclick={let sc = show_config.clone(); move |_| sc.set(!*sc)}>{"⚙️"}</button>
|
||||||
</button>
|
<button class="action-btn" onclick={load_news.clone()}>{"🔄"}</button>
|
||||||
<button class="reload-btn" onclick={load_news.clone()}>
|
|
||||||
{"🔄"}
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
if is_config_visible {
|
if *show_config {
|
||||||
<div class="config-panel">
|
<div class="config-panel">
|
||||||
<h3>{"Einstellungen"}</h3>
|
<div class="config-section">
|
||||||
<div style="margin-bottom: 10px;">
|
<label>{"OPENROUTER API KEY"}</label>
|
||||||
<label style="font-size: 0.7rem; color: #4a90e2; display: block; margin-bottom: 4px;">{"OPENROUTER KEY"}</label>
|
<input ref={api_key_ref} type="password" class="config-input" placeholder="sk-..." />
|
||||||
<input
|
|
||||||
ref={api_key_ref}
|
|
||||||
type="password"
|
|
||||||
placeholder="sk-or-v1-..."
|
|
||||||
class="config-input"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-bottom: 15px;">
|
|
||||||
<label style="font-size: 0.7rem; color: #facc15; display: block; margin-bottom: 4px;">{"RSS URL"}</label>
|
<div class="config-section">
|
||||||
<input
|
<label>{"RSS FEEDS"}</label>
|
||||||
ref={rss_url_ref}
|
<div class="rss-input-row">
|
||||||
type="text"
|
<input ref={new_url_ref.clone()} type="text" class="config-input" placeholder="URL hinzufügen..." />
|
||||||
placeholder="https://zum-rss-feed.xml"
|
<button class="add-btn" onclick={
|
||||||
class="config-input"
|
let rss_urls = rss_urls.clone();
|
||||||
/>
|
let new_url_ref = new_url_ref.clone();
|
||||||
|
move |_| {
|
||||||
|
if let Some(input) = new_url_ref.cast::<HtmlInputElement>() {
|
||||||
|
let val = input.value();
|
||||||
|
if !val.trim().is_empty() {
|
||||||
|
let mut list = (*rss_urls).clone();
|
||||||
|
list.push(val);
|
||||||
|
rss_urls.set(list);
|
||||||
|
input.set_value("");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}>{"+"}</button>
|
||||||
|
</div>
|
||||||
|
<div class="rss-list-scroll">
|
||||||
|
{ for (*rss_urls).iter().enumerate().map(|(i, url)| html! {
|
||||||
|
<div class="rss-url-entry" key={i}>
|
||||||
|
<span class="url-text">{url}</span>
|
||||||
|
<button class="delete-btn" onclick={
|
||||||
|
let rss_urls = rss_urls.clone();
|
||||||
|
move |_| {
|
||||||
|
let mut list = (*rss_urls).clone();
|
||||||
|
list.remove(i);
|
||||||
|
rss_urls.set(list);
|
||||||
|
}
|
||||||
|
}>{"✕"}</button>
|
||||||
|
</div>
|
||||||
|
}) }
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<button class="save-btn" onclick={save_settings}>{"Alles Speichern"}</button>
|
<button class="save-master-btn" onclick={save_settings}>{"Alles Speichern"}</button>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
{
|
<div class="posts-list">
|
||||||
if let Some(msg) = (*error_msg).clone() {
|
{ if let Some(msg) = (*error_msg).clone() {
|
||||||
html! {
|
html! { <div class="error-box">{ format!("⚠️ Error: {}", msg) }</div> }
|
||||||
<div class="error-card">
|
|
||||||
<p>{ format!("⚠️ {}", msg) }</p>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
} else if let Some(list) = (*articles).clone() {
|
} else if let Some(list) = (*articles).clone() {
|
||||||
html! {
|
if list.is_empty() {
|
||||||
<div class="posts-list">
|
html! { <p class="empty-msg">{"Keine Nachrichten gefunden. Überprüfe deine Feeds."}</p> }
|
||||||
{ for list.iter().map(|a| html! { <NewsCard article={a.clone()} mode={mode} /> }) }
|
} else {
|
||||||
<div class="footer-action">
|
html! { for list.iter().map(|a| html! { <NewsCard article={a.clone()} /> }) }
|
||||||
<button class="reload-btn-large" onclick={load_news}>
|
|
||||||
{ if mode == NewsMode::Ai { "Mehr News generieren" } else { "Feed aktualisieren" } }
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
html! {
|
html! { <div class="loading-spinner">{"Lade Nachrichten..."}</div> }
|
||||||
<p class="status-msg">
|
} }
|
||||||
{ if mode == NewsMode::Ai { "KI schreibt gerade News..." } else { "RSS Feeds werden geladen..." } }
|
</div>
|
||||||
</p>
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Properties, PartialEq)]
|
#[derive(Properties, PartialEq)]
|
||||||
pub struct NewsProps {
|
pub struct NewsCardProps {
|
||||||
pub article: NewsArticle,
|
pub article: NewsArticle,
|
||||||
pub mode: NewsMode,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#[function_component(NewsCard)]
|
#[function_component(NewsCard)]
|
||||||
pub fn news_card(props: &NewsProps) -> Html {
|
pub fn news_card(props: &NewsCardProps) -> Html {
|
||||||
let a = &props.article;
|
let a = &props.article;
|
||||||
let mode = props.mode;
|
|
||||||
|
|
||||||
let markdown_html = {
|
let markdown_html = {
|
||||||
let mut options = Options::empty();
|
let mut options = Options::empty();
|
||||||
options.insert(Options::ENABLE_STRIKETHROUGH);
|
options.insert(Options::ENABLE_STRIKETHROUGH);
|
||||||
let parser = Parser::new_ext(&a.content, options);
|
let parser = Parser::new_ext(&a.content, options);
|
||||||
let mut html_output = String::new();
|
let mut out = String::new();
|
||||||
md_html::push_html(&mut html_output, parser);
|
md_html::push_html(&mut out, parser);
|
||||||
html_output
|
out
|
||||||
};
|
};
|
||||||
|
|
||||||
html! {
|
html! {
|
||||||
<div class="post-card">
|
<div class="post-card">
|
||||||
<div class="post-header">
|
<div class="post-header">
|
||||||
<span class="post-author" style={if mode == NewsMode::Ai { "color: #4a90e2;" } else { "color: #facc15;" }}>
|
<span class="post-author">{ &a.author }</span>
|
||||||
{ &a.author }
|
<span class="post-date">{ &a.created_at }</span>
|
||||||
</span>
|
|
||||||
<span class="post-date">
|
|
||||||
{ if mode == NewsMode::Ai { "✨ AI Generated" } else { "📡 RSS Source" } }
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="post-content markdown-body">
|
<div class="post-content markdown-body">
|
||||||
{ Html::from_html_unchecked(AttrValue::from(markdown_html)) }
|
{ Html::from_html_unchecked(AttrValue::from(markdown_html)) }
|
||||||
|
|||||||
324
styles.css
324
styles.css
@@ -234,125 +234,262 @@ html {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* --- Mode Switcher (KI / RSS) --- */
|
/* --- Mode Switcher (KI / RSS) --- */
|
||||||
.mode-switch {
|
@import url("assets/home.css");
|
||||||
|
@import url("assets/news.css");
|
||||||
|
@import url("assets/greet.css");
|
||||||
|
|
||||||
|
/* --- Global & Layout --- */
|
||||||
|
body {
|
||||||
|
background-color: #0f0f13;
|
||||||
|
color: #e2e2e7;
|
||||||
|
font-family:
|
||||||
|
"Inter",
|
||||||
|
-apple-system,
|
||||||
|
sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.5;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
.feed-container {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 600px;
|
||||||
|
padding: 40px 20px 150px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- Header & Navigation --- */
|
||||||
|
.feed-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-main {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-main h1 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mode-toggle {
|
||||||
display: flex;
|
display: flex;
|
||||||
background: rgba(255, 255, 255, 0.05);
|
background: rgba(255, 255, 255, 0.05);
|
||||||
border-radius: 20px;
|
border-radius: 12px;
|
||||||
padding: 4px;
|
padding: 3px;
|
||||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
width: fit-content;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||||
}
|
}
|
||||||
|
|
||||||
.switch-btn {
|
.toggle-btn {
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 16px;
|
|
||||||
padding: 6px 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color: #a0a0b0;
|
color: #8e8e93;
|
||||||
font-weight: 700;
|
padding: 4px 12px;
|
||||||
font-size: 0.8rem;
|
border-radius: 9px;
|
||||||
}
|
|
||||||
|
|
||||||
.switch-btn.active-ai {
|
|
||||||
background: #4a90e2;
|
|
||||||
color: white;
|
|
||||||
box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
.switch-btn.active-rss {
|
|
||||||
background: #facc15;
|
|
||||||
color: #0f0f13;
|
|
||||||
box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* --- Config Panel (API Key Eingabe) --- */
|
|
||||||
.config-panel {
|
|
||||||
background: rgba(74, 144, 226, 0.05);
|
|
||||||
border: 1px solid rgba(74, 144, 226, 0.3);
|
|
||||||
border-radius: 16px;
|
|
||||||
padding: 20px;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
animation: slideIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
|
||||||
}
|
|
||||||
|
|
||||||
.config-panel h3 {
|
|
||||||
margin-top: 0;
|
|
||||||
color: #4a90e2;
|
|
||||||
font-size: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.config-input {
|
|
||||||
width: 100%;
|
|
||||||
padding: 12px;
|
|
||||||
background: rgba(0, 0, 0, 0.2);
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
||||||
color: white;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-family: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.config-input:focus {
|
|
||||||
outline: none;
|
|
||||||
border-color: #4a90e2;
|
|
||||||
background: rgba(0, 0, 0, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
.save-btn {
|
|
||||||
background: #4a90e2;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
padding: 12px;
|
|
||||||
border-radius: 10px;
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
width: 100%;
|
font-size: 0.75rem;
|
||||||
font-weight: 600;
|
font-weight: 700;
|
||||||
transition: opacity 0.2s;
|
transition: all 0.2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.save-btn:hover {
|
.toggle-btn.active {
|
||||||
opacity: 0.9;
|
background: #4a90e2;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* --- Status & Header Buttons --- */
|
.header-actions {
|
||||||
.reload-btn {
|
display: flex;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-btn {
|
||||||
background: rgba(255, 255, 255, 0.05);
|
background: rgba(255, 255, 255, 0.05);
|
||||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||||
border-radius: 10px;
|
border-radius: 12px;
|
||||||
padding: 8px 12px;
|
padding: 10px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 1.1rem;
|
font-size: 1.1rem;
|
||||||
transition: all 0.2s;
|
transition: all 0.2s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reload-btn:hover {
|
.action-btn:hover {
|
||||||
background: rgba(255, 255, 255, 0.1);
|
background: rgba(255, 255, 255, 0.1);
|
||||||
|
transform: translateY(-2px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* --- Config Panel & RSS Management --- */
|
||||||
|
.config-panel {
|
||||||
|
background: rgba(30, 30, 46, 0.6);
|
||||||
|
backdrop-filter: blur(20px);
|
||||||
|
border: 1px solid rgba(74, 144, 226, 0.3);
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 25px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
|
||||||
|
animation: slideIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||||
|
}
|
||||||
|
|
||||||
|
.config-section {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.config-section label {
|
||||||
|
display: block;
|
||||||
|
font-size: 0.7rem;
|
||||||
|
font-weight: 800;
|
||||||
|
color: #4a90e2;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
letter-spacing: 0.05rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.config-input {
|
||||||
|
width: 100%;
|
||||||
|
padding: 12px 16px;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||||
|
color: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
font-family: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rss-input-row {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
background: #4a90e2;
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
border-radius: 12px;
|
||||||
|
width: 45px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Scrollbereich für viele RSS Feeds */
|
||||||
|
.rss-list-scroll {
|
||||||
|
max-height: 150px;
|
||||||
|
overflow-y: auto;
|
||||||
|
background: rgba(0, 0, 0, 0.2);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 8px;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.rss-url-entry {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 12px;
|
||||||
|
background: rgba(255, 255, 255, 0.03);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.url-text {
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
margin-right: 10px;
|
||||||
|
color: #a0a0b0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-btn {
|
||||||
|
background: transparent;
|
||||||
|
border: none;
|
||||||
|
color: #ef4444;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 4px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.save-master-btn {
|
||||||
|
background: linear-gradient(135deg, #4a90e2, #357abd);
|
||||||
|
color: white;
|
||||||
|
border: none;
|
||||||
|
padding: 14px;
|
||||||
|
border-radius: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
width: 100%;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-top: 10px;
|
||||||
|
box-shadow: 0 4px 15px rgba(74, 144, 226, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- Post Cards & Markdown --- */
|
||||||
|
.post-card {
|
||||||
|
background: rgba(255, 255, 255, 0.03);
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||||
|
border-radius: 18px;
|
||||||
|
padding: 22px;
|
||||||
|
margin-bottom: 18px;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-card:hover {
|
||||||
|
background: rgba(255, 255, 255, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-author {
|
||||||
|
color: #4a90e2;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-date {
|
||||||
|
color: #636366;
|
||||||
|
}
|
||||||
|
|
||||||
|
.markdown-body h3 {
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 1.15rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- Status Messages --- */
|
||||||
|
.loading-spinner,
|
||||||
.status-msg {
|
.status-msg {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #a0a0b0;
|
padding: 40px;
|
||||||
margin-top: 60px;
|
color: #8e8e93;
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
animation: pulse 2s infinite;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.error-card {
|
.error-box {
|
||||||
border: 1px solid rgba(239, 68, 68, 0.4);
|
background: rgba(239, 68, 68, 0.1);
|
||||||
background: rgba(239, 68, 68, 0.05);
|
border: 1px solid rgba(239, 68, 68, 0.3);
|
||||||
|
color: #ef4444;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
color: #ef4444;
|
text-align: center;
|
||||||
font-weight: 500;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* --- Animations --- */
|
/* --- Animations --- */
|
||||||
@keyframes slideIn {
|
@keyframes slideIn {
|
||||||
from {
|
from {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY(-15px);
|
transform: translateY(-10px);
|
||||||
}
|
}
|
||||||
to {
|
to {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
@@ -360,14 +497,11 @@ html {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes pulse {
|
/* Scrollbar Styling für die RSS Liste */
|
||||||
0% {
|
.rss-list-scroll::-webkit-scrollbar {
|
||||||
opacity: 0.6;
|
width: 6px;
|
||||||
}
|
}
|
||||||
50% {
|
.rss-list-scroll::-webkit-scrollbar-thumb {
|
||||||
opacity: 1;
|
background: rgba(255, 255, 255, 0.1);
|
||||||
}
|
border-radius: 10px;
|
||||||
100% {
|
|
||||||
opacity: 0.6;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user