Add post deletion w/ confirmation, search (broken), profile page

This commit is contained in:
yuriko 🦊 2025-05-24 19:30:44 -04:00
parent bfb497c367
commit 827d125639
21 changed files with 374 additions and 27 deletions

View file

@ -7,9 +7,7 @@
<h1>{{ config('app.name') }}</h1>
@auth
<wa-input placeholder="Search for posts, tags, users, etc.">
<wa-icon slot="prefix" name="magnifying-glass"></wa-icon>
</wa-input>
<livewire:search />
@endauth
</div>

View file

@ -35,7 +35,7 @@
@endguest
@auth
<wa-button appearance="plain">{{ Auth::user()->name }}</wa-button>
<wa-button href="{{ url('/profiles/' . Auth::id()) }}" appearance="plain" wire:navigate.hover>{{ Auth::user()->name }}</wa-button>
<wa-icon-button href="{{ route('logout') }}" appearance="plain" name="arrow-left-from-bracket"></wa-icon-button>
@endauth
</div>

View file

@ -0,0 +1,28 @@
<div class="wa-stack">
<h1>{{ $user->name }}</h1>
<div class="wa-grid">
<wa-card>
<span class="wa-heading-m">
<wa-format-number value="{{ $user->posts->count() }}"></wa-format-number> {{ Str::plural('post', $user->posts->count()) }}
</span>
<span>
<wa-format-number value="{{ $favorite_posts }}"></wa-format-number> {{ Str::plural('favorite', $favorite_posts) }}
</span>
</wa-card>
<wa-card>
<span class="wa-heading-m">
<wa-format-number value="{{ $user->comments->count() }}"></wa-format-number> {{ Str::plural('comment', $user->comments->count()) }}
</span>
</wa-card>
<wa-card>
<span class="wa-heading-m">
Last seen {{ $user->updated_at->diffForHumans() }}
</span>
</wa-card>
</div>
</div>

View file

@ -1,17 +1,12 @@
<div class="wa-flank wa-align-items-start wa-gap-3xl" style="--flank-size: 20rem;">
{{-- Sidebar --}}
<div class="wa-stack" wire:poll>
<div class="wa-stack">
<div class="wa-cluster">
<span class="wa-caption-m">Changes are automatically saved.</span>
<wa-button href="{{ url("posts/$post->id") }}" appearance="outlined" variant="neutral" size="small" wire:navigate.hover>
<wa-icon slot="prefix" name="check"></wa-icon>
<span>Finish</span>
</wa-button>
</div>
<wa-divider></wa-divider>
<wa-callout variant="brand" appearance="outlined">
<wa-icon slot="icon" name="circle-info"></wa-icon>
<span>Changes are automatically saved.</span>
</wa-callout>
<form wire:submit class="wa-stack">
<wa-select wire:model.live="rating" label="Rating" value="{{ $post->rating }}" wire:loading.attr="disabled" @error('rating') hint="{{ $message }}" @enderror>
@ -39,11 +34,46 @@
<span>Tags</span>
</div>
<wa-divider></wa-divider>
<div class="wa-split">
<wa-button href="{{ url("posts/$post->id") }}" appearance="outlined" variant="neutral" size="small" wire:navigate.hover>
<wa-icon slot="prefix" name="arrow-left"></wa-icon>
<span>Exit</span>
</wa-button>
<wa-button appearance="outlined" variant="danger" size="small" wire:click="$js.openDialog">
<wa-icon slot="prefix" name="trash"></wa-icon>
<span>Delete post</span>
</wa-button>
</div>
</div>
{{-- Main content --}}
<div class="wa-stack wa-gap-2xl" wire:poll>
<div class="wa-stack wa-gap-2xl">
<livewire:posts.image :$post lazy />
</div>
{{-- Confirm deletion dialog --}}
<wa-dialog label="Confirm post deletion" without-header light-dismiss id="modal-confirm-post-delete" style="--width: 360px;">
<div class="wa-stack wa-align-items-center">
<span>Are you sure you want to delete this post?</span>
<div class="wa-split">
<wa-button variant="neutral" appearance="outlined" data-dialog="close">
No, go back
</wa-button>
<wa-button href="{{ url("delete/post/$post->id") }}" appearance="outlined" variant="danger" wire:navigate>
Yes, delete it
</wa-button>
</div>
</div>
</wa-dialog>
@script
<script>
const dialog = document.querySelector('#modal-confirm-post-delete');
$js('openDialog', () => { dialog.open = true})
</script>
@endscript
</div>

View file

@ -0,0 +1,19 @@
<form wire:submit>
<wa-input wire:model.live="searchText" type="text" placeholder="Search for posts, tags, users, etc.">
<wa-icon slot="prefix" name="magnifying-glass"></wa-icon>
</wa-input>
<wa-popup
placement="bottom-end"
distance="10"
sync="width"
auto-size="vertical"
auto-size-padding="10"
{{ $searchResults ? 'active' : '' }}>
<wa-card>
@isset($searchResults)
<pre><code>{{ var_dump($searchResults) }}</code></pre>
@endisset
</wa-card>
</wa-popup>
</form>