fix: tabs removing, state management, commands, loading animation

This commit is contained in:
Artemy Egorov 2024-07-31 16:55:14 +03:00
parent a23bead7d8
commit 1488604772
8 changed files with 112 additions and 82 deletions

View file

@ -10,13 +10,28 @@ use tauri::async_runtime::Mutex;
use types::{VigiError, VigiJsState, VigiState}; use types::{VigiError, VigiJsState, VigiState};
use utils::{read_or_create_jsonl, read_or_create_number}; use utils::{read_or_create_jsonl, read_or_create_number};
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
#[tauri::command] #[tauri::command]
async fn update_input( async fn update_input(
input: String, input: String,
state: tauri::State<'_, Mutex<VigiState>>, state: tauri::State<'_, Mutex<VigiState>>,
) -> Result<(), VigiError> { ) -> Result<(), VigiError> {
state.lock().await.update_input(input).await state.lock().await.update_input(input);
Ok(())
}
#[tauri::command]
async fn load_input(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
state.lock().await.load_input().await?;
Ok(())
}
#[tauri::command]
async fn load_input_force(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
state.lock().await.load_input_force().await?;
Ok(())
} }
#[tauri::command] #[tauri::command]
@ -29,17 +44,12 @@ async fn select_tab(
index: usize, index: usize,
state: tauri::State<'_, Mutex<VigiState>>, state: tauri::State<'_, Mutex<VigiState>>,
) -> Result<(), VigiError> { ) -> Result<(), VigiError> {
state.lock().await.select_tab(index).await state.lock().await.select_tab(index)
}
#[tauri::command]
async fn load_tab(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
state.lock().await.load_tab().await
} }
#[tauri::command] #[tauri::command]
async fn add_tab(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> { async fn add_tab(state: tauri::State<'_, Mutex<VigiState>>) -> Result<(), VigiError> {
state.lock().await.add_tab() state.lock().await.add_tab().await
} }
#[tauri::command] #[tauri::command]
@ -57,10 +67,11 @@ fn main() {
update_input, update_input,
get_js_state, get_js_state,
select_tab, select_tab,
load_tab,
add_tab, add_tab,
remove_tab, remove_tab,
setup setup,
load_input,
load_input_force
]) ])
.run(tauri::generate_context!()) .run(tauri::generate_context!())
.expect("error while running tauri application"); .expect("error while running tauri application");
@ -120,7 +131,7 @@ async fn setup(
state.current_tab_index_path = local_data_dir.join("current_tab_index"); state.current_tab_index_path = local_data_dir.join("current_tab_index");
state.current_tab_index = read_or_create_number(&state.current_tab_index_path); state.current_tab_index = read_or_create_number(&state.current_tab_index_path);
state.update_top_bar_input(); state.update_top_bar_input()?;
println!("---Setup done---"); println!("---Setup done---");

View file

@ -12,6 +12,7 @@ pub enum VigiError {
StateUpdate, StateUpdate,
Filesystem, Filesystem,
Config, Config,
GetTab,
} }
#[derive(Serialize, Debug, Clone)] #[derive(Serialize, Debug, Clone)]
@ -77,24 +78,33 @@ impl VigiState {
} }
} }
pub async fn select_tab(&mut self, new_index: usize) -> Result<(), VigiError> { pub fn select_tab(&mut self, new_index: usize) -> Result<(), VigiError> {
self.current_tab_index = new_index; self.update_current_tab_index(new_index)?;
self.write_current_tab_index()?; self.update_top_bar_input()?;
self.update_top_bar_input();
Ok(()) Ok(())
} }
pub fn update_top_bar_input(&mut self) { fn update_current_tab_index(&mut self, new_index: usize) -> Result<(), VigiError> {
self.top_bar_input = self.tabs[self.current_tab_index].url.clone(); self.current_tab_index = new_index;
}
fn write_current_tab_index(&mut self) -> Result<(), VigiError> {
fs::write( fs::write(
&self.current_tab_index_path, &self.current_tab_index_path,
self.current_tab_index.to_string(), self.current_tab_index.to_string(),
) )
.map_err(|_| VigiError::StateUpdate) .map_err(|_| VigiError::StateUpdate)?;
Ok(())
}
pub fn update_top_bar_input(&mut self) -> Result<(), VigiError> {
self.top_bar_input = self
.tabs
.get(self.current_tab_index)
.ok_or(VigiError::StateUpdate)?
.url
.clone();
Ok(())
} }
fn write_id_counter(&mut self) -> Result<(), VigiError> { fn write_id_counter(&mut self) -> Result<(), VigiError> {
@ -155,12 +165,15 @@ impl VigiState {
Ok(()) Ok(())
} }
pub async fn update_input(&mut self, input: String) -> Result<(), VigiError> { pub fn update_input(&mut self, input: String) {
self.top_bar_input = input; self.top_bar_input = input;
}
pub async fn load_input_force(&mut self) -> Result<(), VigiError> {
self.process_input(true).await self.process_input(true).await
} }
pub async fn load_tab(&mut self) -> Result<(), VigiError> { pub async fn load_input(&mut self) -> Result<(), VigiError> {
self.process_input(false).await self.process_input(false).await
} }
@ -177,7 +190,7 @@ impl VigiState {
} }
} }
pub fn add_tab(&mut self) -> Result<(), VigiError> { pub async fn add_tab(&mut self) -> Result<(), VigiError> {
self.tabs_id_counter += 1; self.tabs_id_counter += 1;
self.tabs.push(Tab::new( self.tabs.push(Tab::new(
"Home".to_string(), "Home".to_string(),
@ -188,22 +201,21 @@ impl VigiState {
self.write_id_counter()?; self.write_id_counter()?;
write_tabs(&self.local_tabs_path, &self.tabs)?; write_tabs(&self.local_tabs_path, &self.tabs)?;
self.current_tab_index = self.tabs.len() - 1; self.select_tab(self.tabs.len() - 1)?;
self.write_current_tab_index()?; self.load_input().await?;
self.update_top_bar_input();
Ok(()) Ok(())
} }
pub fn remove_tab(&mut self, index: usize) -> Result<(), VigiError> { pub fn remove_tab(&mut self, index: usize) -> Result<(), VigiError> {
if self.tabs.len() - 1 == index && self.current_tab_index == index { if self.current_tab_index >= index {
if self.current_tab_index > 0 { if self.current_tab_index > 0 {
self.current_tab_index -= 1; self.select_tab(self.current_tab_index - 1)?;
}
}
self.write_current_tab_index()?; self.cached_inputs
} .remove(&self.tabs.get(index).ok_or(VigiError::GetTab)?.url);
}
self.tabs.remove(index); self.tabs.remove(index);
write_tabs(&self.local_tabs_path, &self.tabs)?; write_tabs(&self.local_tabs_path, &self.tabs)?;

View file

@ -10,8 +10,10 @@
--min-bg: #96e28a; --min-bg: #96e28a;
--max-bg: #193815; --max-bg: #193815;
--max-text: #bef5b5; --min-text: #bef5b5;
--min-text: #fff; --max-text: #fff;
--colorspace: oklch;
/* Dark */ /* Dark */
/* --min: #818181; /* --min: #818181;

View file

@ -39,7 +39,7 @@
{/if} {/if}
<button <button
class="tab" class={`tab${loading && active ? " animate-pulse" : ""}`}
class:active class:active
transition:slide={{ duration: 100 }} transition:slide={{ duration: 100 }}
bind:this={tabElement} bind:this={tabElement}
@ -49,11 +49,11 @@
} }
}} }}
> >
<div> <!-- <div class="static right-0">
{#if loading && active} {#if loading && active}
<GooLoad /> <GooLoad />
{/if} {/if}
</div> </div> -->
<div> <div>
{tab.title} {tab.title}

View file

@ -5,7 +5,7 @@
import SidebarLeft from "$lib/icons/SidebarLeft.svelte"; import SidebarLeft from "$lib/icons/SidebarLeft.svelte";
import SidebarRight from "$lib/icons/SidebarRight.svelte"; import SidebarRight from "$lib/icons/SidebarRight.svelte";
import { state } from "$lib/stores"; import { state } from "$lib/stores";
import { updateInput } from "$lib/utils"; import { updateAndLoadInput } from "$lib/utils";
import Block from "./Block.svelte"; import Block from "./Block.svelte";
import Button from "./Button.svelte"; import Button from "./Button.svelte";
@ -36,7 +36,7 @@
</Button> </Button>
<Button onClick={onBack}><ArrowLeft /></Button> <Button onClick={onBack}><ArrowLeft /></Button>
<Button onClick={onForward}><ArrowRight /></Button> <Button onClick={onForward}><ArrowRight /></Button>
<Button onClick={() => updateInput(input)}><Reload /></Button> <Button onClick={() => updateAndLoadInput(input)}><Reload /></Button>
</Block> </Block>
<input <input
@ -47,7 +47,7 @@
bind:this={iEl} bind:this={iEl}
on:keypress={(e) => { on:keypress={(e) => {
if (e.key === "Enter") { if (e.key === "Enter") {
updateInput(currentInput); updateAndLoadInput(currentInput);
iEl.blur(); iEl.blur();
} }
}} }}

View file

@ -11,11 +11,14 @@ export async function updateVigiState() {
} }
} }
export async function updateInput(input: string) { export async function updateAndLoadInput(input: string) {
await invoke("update_input", { input });
await updateVigiState();
isLoading.set(true); isLoading.set(true);
try { try {
await invoke("update_input", { input }); await invoke("load_input_force");
await updateVigiState(); await updateVigiState();
} catch (e) { } catch (e) {
writeError(e, input); writeError(e, input);
@ -27,26 +30,25 @@ export async function updateInput(input: string) {
export async function addTab() { export async function addTab() {
await invoke("add_tab"); await invoke("add_tab");
await updateVigiState(); await updateVigiState();
await loadTab();
} }
export async function selectTab(index: number) { export async function selectTab(index: number) {
await invoke("select_tab", { index }); await invoke("select_tab", { index });
await updateVigiState(); await updateVigiState();
await loadTab(); await loadInput();
} }
export async function removeTab(index: number) { export async function removeTab(index: number) {
await invoke("remove_tab", { index }); await invoke("remove_tab", { index });
await updateVigiState(); await updateVigiState();
await loadTab(); setTimeout(loadInput, 150);
} }
export async function loadTab() { export async function loadInput() {
isLoading.set(true); isLoading.set(true);
try { try {
await invoke("load_tab"); await invoke("load_input");
await updateVigiState(); await updateVigiState();
} catch (e) { } catch (e) {
writeError(e); writeError(e);

View file

@ -6,7 +6,7 @@
import BrowserWindow from "$lib/components/BrowserWindow.svelte"; import BrowserWindow from "$lib/components/BrowserWindow.svelte";
import { invoke } from "@tauri-apps/api/tauri"; import { invoke } from "@tauri-apps/api/tauri";
import { loadTab, updateVigiState } from "$lib/utils"; import { loadInput, updateVigiState } from "$lib/utils";
import { isLoading } from "$lib/stores"; import { isLoading } from "$lib/stores";
let sidebarOpen = true; let sidebarOpen = true;
@ -15,14 +15,14 @@
isLoading.set(true); isLoading.set(true);
await invoke("setup"); await invoke("setup");
await updateVigiState(); await updateVigiState();
await loadTab(); await loadInput();
isLoading.set(false); isLoading.set(false);
})(); })();
document.addEventListener("keypress", (e: KeyboardEvent) => { document.addEventListener("keypress", (e: KeyboardEvent) => {
if ( if (
["INPUT", "TEXTAREA", "SELECT", "OPTION"].includes( ["INPUT", "TEXTAREA", "SELECT", "OPTION"].includes(
(e.target as Element).tagName (e.target as Element).tagName,
) )
) { ) {
return; return;

View file

@ -3,10 +3,10 @@ let textColors = {};
for (let i = 0; i <= 100; i += 5) { for (let i = 0; i <= 100; i += 5) {
bgColors[`vigi-${i}`] = bgColors[`vigi-${i}`] =
`color-mix(in oklch, var(--max-bg) ${i}%, var(--min-bg))`; `color-mix(in var(--colorspace), var(--max-bg) ${i}%, var(--min-bg))`;
textColors[`vigi-${i}`] = textColors[`vigi-${i}`] =
`color-mix(in oklch, var(--max-text) ${i}%, var(--min-text))`; `color-mix(in var(--colorspace), var(--min-text) ${i}%, var(--max-text))`;
} }
/** @type {import('tailwindcss').Config} */ /** @type {import('tailwindcss').Config} */
@ -16,6 +16,9 @@ export default {
extend: { extend: {
colors: bgColors, colors: bgColors,
textColor: textColors, textColor: textColors,
animation: {
pulse: "pulse 0.7s linear infinite",
},
}, },
}, },
plugins: [], plugins: [],