refactor: tüm bileşenler leptos-shadcn-ui'ye dönüştürüldü
All checks were successful
Build MIPS Binary / build (push) Successful in 5m16s

- login.rs: Card, Input, Button, Label, Alert
- setup.rs: Card, Input, Button, Label, Alert
- add_torrent.rs: Dialog, Input, Button, Alert
- toast.rs: Alert bileşeni ile
- Cargo.toml: dialog, label, alert, toast, dropdown-menu, tooltip eklendi
This commit is contained in:
spinline
2026-02-11 00:17:22 +03:00
parent ad336789d9
commit ca1dd0caac
6 changed files with 252 additions and 148 deletions

View File

@@ -1,5 +1,10 @@
use leptos::prelude::*;
use leptos::task::spawn_local;
use leptos_shadcn_card::{Card, CardHeader, CardContent};
use leptos_shadcn_input::Input;
use leptos_shadcn_button::Button;
use leptos_shadcn_label::Label;
use leptos_shadcn_alert::{Alert, AlertDescription, AlertVariant};
#[component]
pub fn Login() -> impl IntoView {
@@ -32,8 +37,8 @@ pub fn Login() -> impl IntoView {
view! {
<div class="flex items-center justify-center min-h-screen bg-muted/40 px-4">
<div class="w-full max-w-sm rounded-xl border border-border bg-card text-card-foreground shadow-lg">
<div class="flex flex-col space-y-1.5 p-6 pb-2 items-center">
<Card class="w-full max-w-sm shadow-lg">
<CardHeader class="pb-2 items-center">
<div class="w-12 h-12 bg-primary rounded-xl flex items-center justify-center text-primary-foreground shadow-sm mb-4">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.362 5.214A8.252 8.252 0 0112 21 8.25 8.25 0 016.038 7.048 8.287 8.287 0 009 9.6a8.983 8.983 0 013.361-6.867 8.21 8.25 0 003 2.48z" />
@@ -42,56 +47,53 @@ pub fn Login() -> impl IntoView {
</div>
<h3 class="font-semibold tracking-tight text-2xl">"VibeTorrent"</h3>
<p class="text-sm text-muted-foreground">"Hesabınıza giriş yapın"</p>
</div>
</CardHeader>
<div class="p-6 pt-4">
<CardContent class="pt-4">
<form on:submit=handle_login class="space-y-4">
<div class="space-y-2">
<label class="text-sm font-medium leading-none">"Kullanıcı Adı"</label>
<input
type="text"
placeholder="Kullanıcı adınız"
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
prop:value=move || username.0.get()
on:input=move |ev| username.1.set(event_target_value(&ev))
disabled=move || loading.0.get()
required
<Label>"Kullanıcı Adı"</Label>
<Input
input_type="text"
placeholder="Kullanıcı adınız"
value=MaybeProp::derive(move || Some(username.0.get()))
on_change=Callback::new(move |val: String| username.1.set(val))
disabled=Signal::derive(move || loading.0.get())
/>
</div>
<div class="space-y-2">
<label class="text-sm font-medium leading-none">"Şifre"</label>
<input
type="password"
placeholder="******"
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
prop:value=move || password.0.get()
on:input=move |ev| password.1.set(event_target_value(&ev))
disabled=move || loading.0.get()
required
<Label>"Şifre"</Label>
<Input
input_type="password"
placeholder="******"
value=MaybeProp::derive(move || Some(password.0.get()))
on_change=Callback::new(move |val: String| password.1.set(val))
disabled=Signal::derive(move || loading.0.get())
/>
</div>
<Show when=move || error.0.get().is_some()>
<div class="rounded-md border border-destructive/50 bg-destructive/10 p-3 text-sm text-destructive">
{move || error.0.get().unwrap_or_default()}
</div>
<Alert variant=AlertVariant::Destructive>
<AlertDescription>
{move || error.0.get().unwrap_or_default()}
</AlertDescription>
</Alert>
</Show>
<div class="pt-2">
<button
class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground shadow hover:bg-primary/90 h-9 px-4 py-2 w-full"
type="submit"
disabled=move || loading.0.get()
<Button
class="w-full"
disabled=Signal::derive(move || loading.0.get())
>
<Show when=move || loading.0.get() fallback=|| "Giriş Yap">
<span class="animate-spin mr-2 h-4 w-4 border-2 border-current border-t-transparent rounded-full"></span>
"Giriş Yapılıyor..."
</Show>
</button>
</Button>
</div>
</form>
</div>
</div>
</CardContent>
</Card>
</div>
}
}

View File

@@ -1,5 +1,10 @@
use leptos::prelude::*;
use leptos::task::spawn_local;
use leptos_shadcn_card::{Card, CardHeader, CardContent};
use leptos_shadcn_input::Input;
use leptos_shadcn_button::Button;
use leptos_shadcn_label::Label;
use leptos_shadcn_alert::{Alert, AlertDescription, AlertVariant};
#[component]
pub fn Setup() -> impl IntoView {
@@ -48,8 +53,8 @@ pub fn Setup() -> impl IntoView {
view! {
<div class="flex items-center justify-center min-h-screen bg-muted/40 px-4">
<div class="w-full max-w-md rounded-xl border border-border bg-card text-card-foreground shadow-lg overflow-hidden">
<div class="flex flex-col space-y-1.5 p-6 pb-2 items-center text-center">
<Card class="w-full max-w-md shadow-lg overflow-hidden">
<CardHeader class="pb-2 items-center text-center">
<div class="w-12 h-12 bg-primary rounded-xl flex items-center justify-center text-primary-foreground shadow-sm mb-4">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.42 15.17L17.25 21A2.652 2.652 0 0021 17.25l-5.877-5.877M11.42 15.17l2.496-3.03c.317-.384.74-.626 1.208-.766M11.42 15.17l-4.655 5.653a2.548 2.548 0 11-3.586-3.586l6.837-5.63m5.108-3.497a2.548 2.548 0 113.586 3.586l-6.837 5.63m-5.108 3.497l2.496-3.03c.317-.384.74-.626 1.208-.766M15.75 9.25a2.548 2.548 0 11-5.096 0 2.548 2.548 0 015.096 0z" />
@@ -57,74 +62,63 @@ pub fn Setup() -> impl IntoView {
</div>
<h3 class="font-semibold tracking-tight text-2xl">"VibeTorrent Kurulumu"</h3>
<p class="text-sm text-muted-foreground">"Yönetici hesabınızı oluşturun"</p>
</div>
</CardHeader>
<div class="p-6 pt-4">
<CardContent class="pt-4">
<form on:submit=handle_setup class="space-y-4">
<div class="space-y-2">
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
"Yönetici Kullanıcı Adı"
</label>
<input
type="text"
placeholder="admin"
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
prop:value=move || username.0.get()
on:input=move |ev| username.1.set(event_target_value(&ev))
disabled=move || loading.0.get()
required
<Label>"Yönetici Kullanıcı Adı"</Label>
<Input
input_type="text"
placeholder="admin"
value=MaybeProp::derive(move || Some(username.0.get()))
on_change=Callback::new(move |val: String| username.1.set(val))
disabled=Signal::derive(move || loading.0.get())
/>
</div>
<div class="space-y-2">
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
"Şifre"
</label>
<input
type="password"
placeholder="******"
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
prop:value=move || password.0.get()
on:input=move |ev| password.1.set(event_target_value(&ev))
disabled=move || loading.0.get()
required
<Label>"Şifre"</Label>
<Input
input_type="password"
placeholder="******"
value=MaybeProp::derive(move || Some(password.0.get()))
on_change=Callback::new(move |val: String| password.1.set(val))
disabled=Signal::derive(move || loading.0.get())
/>
</div>
<div class="space-y-2">
<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
"Şifre Onay"
</label>
<input
type="password"
placeholder="******"
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:opacity-50"
prop:value=move || confirm_password.0.get()
on:input=move |ev| confirm_password.1.set(event_target_value(&ev))
disabled=move || loading.0.get()
required
<Label>"Şifre Onay"</Label>
<Input
input_type="password"
placeholder="******"
value=MaybeProp::derive(move || Some(confirm_password.0.get()))
on_change=Callback::new(move |val: String| confirm_password.1.set(val))
disabled=Signal::derive(move || loading.0.get())
/>
</div>
<Show when=move || error.0.get().is_some() fallback=|| ()>
<div class="rounded-md border border-destructive/50 bg-destructive/10 p-3 text-sm text-destructive dark:border-destructive dark:bg-destructive/50 dark:text-destructive-foreground">
<span>{move || error.0.get().unwrap_or_default()}</span>
</div>
<Alert variant=AlertVariant::Destructive>
<AlertDescription>
<span>{move || error.0.get().unwrap_or_default()}</span>
</AlertDescription>
</Alert>
</Show>
<div class="pt-2">
<button
class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground shadow hover:bg-primary/90 h-9 px-4 py-2 w-full"
type="submit"
disabled=move || loading.0.get()
<Button
class="w-full"
disabled=Signal::derive(move || loading.0.get())
>
<Show when=move || loading.0.get() fallback=|| "Kurulumu Tamamla">
<span class="animate-spin mr-2 h-4 w-4 border-2 border-current border-t-transparent rounded-full"></span>
"Kuruluyor..."
</Show>
</button>
</Button>
</div>
</form>
</div>
</div>
</CardContent>
</Card>
</div>
}
}