✨ Add file upload support: enable image uploads, implement file validation, and integrate media handling in project-support forms. 🛠 Update Blade templates and Livewire components for improved UX.

2026-01-27 06:33:18 +00:00 · 2026-01-20 15:57:13 +01:00
parent 4a425da923
commit 5e5e211244
6 changed files with 307 additions and 43 deletions
--- a/resources/views/livewire/association/profile.blade.php
+++ b/resources/views/livewire/association/profile.blade.php
@@ -29,6 +29,12 @@ new class extends Component {

    public ?string $nip05Handle = '';

+    public bool $nip05Verified = false;
+
+    public ?string $nip05VerifiedHandle = null;
+
+    public bool $nip05HandleMismatch = false;
+
    public array $yearsPaid = [];

    public array $events = [];
@@ -63,8 +69,30 @@ new class extends Component {
            if ($this->currentPleb) {
                $this->email = $this->currentPleb->email;
                if ($this->currentPleb->nip05_handle) {
-                    $this->nip05Handle = strtolower(str_replace('@einundzwanzig.space', '',
-                        $this->currentPleb->nip05_handle));
+                    $this->nip05Handle = $this->currentPleb->nip05_handle;
+
+                    // Verify NIP-05 handle against nostr.json
+                    try {
+                        $response = \Illuminate\Support\Facades\Http::get(
+                            'https://einundzwanzig.space/.well-known/nostr.json',
+                        );
+                        $data = $response->json();
+                        if (isset($data['names'])) {
+                            foreach ($data['names'] as $handle => $pubkey) {
+                                if ($pubkey === $this->currentPubkey) {
+                                    $this->nip05Verified = true;
+                                    $this->nip05VerifiedHandle = $handle;
+                                    // Check if verified handle differs from database handle
+                                    if ($handle !== $this->nip05Handle) {
+                                        $this->nip05HandleMismatch = true;
+                                    }
+                                    break;
+                                }
+                            }
+                        }
+                    } catch (\Exception) {
+                        // Silently fail if nostr.json is not accessible
+                    }
                }
                $this->no = $this->currentPleb->no_email;
                $this->showEmail = !$this->no;
@@ -114,7 +142,7 @@ new class extends Component {
            'nip05Handle' => 'required|string|max:255|regex:/^[a-z0-9_-]+$/|unique:einundzwanzig_plebs,nip05_handle',
        ]);

-        $nip05Handle = strtolower($this->nip05Handle).'@einundzwanzig.space';
+        $nip05Handle = strtolower($this->nip05Handle);

        $this->currentPleb->update([
            'nip05_handle' => $nip05Handle,
@@ -399,6 +427,39 @@ new class extends Component {
                                            vertrauenswürdiger.
                                        </p>
                                    </div>
+
+                                    <!-- NIP-05 Verification Status -->
+                                    @if($nip05Verified)
+                                        @if($nip05HandleMismatch)
+                                            <flux:callout variant="warning" icon="exclamation-triangle" class="mt-4">
+                                                <p class="font-medium text-zinc-800 dark:text-zinc-100">
+                                                    Dein aktiviertes Handle ist <strong>{{ $nip05VerifiedHandle }}@einundzwanzig.space</strong>
+                                                </p>
+                                                <p class="text-sm text-zinc-600 dark:text-zinc-400 mt-1">
+                                                    Die Synchronisation zu <strong>{{ $nip05Handle }}@einundzwanzig.space</strong> wird automatisch im Hintergrund durchgeführt.
+                                                </p>
+                                            </flux:callout>
+                                        @else
+                                            <flux:callout variant="success" icon="check-circle" class="mt-4">
+                                                <p class="font-medium text-zinc-800 dark:text-zinc-100">
+                                                    Dein Handle <strong>{{ $nip05VerifiedHandle }}@einundzwanzig.space</strong> ist aktiv verifiziert!
+                                                </p>
+                                                <p class="text-sm text-zinc-600 dark:text-zinc-400 mt-1">
+                                                    Dein Handle ist in der NIP-05 Konfiguration eingetragen und bereit für die Verwendung.
+                                                </p>
+                                            </flux:callout>
+                                        @endif
+                                    @elseif($nip05Handle)
+                                        <flux:callout variant="secondary" icon="information-circle" class="mt-4">
+                                            <p class="font-medium text-zinc-800 dark:text-zinc-100">
+                                                Dein Handle <strong>{{ $nip05Handle }}@einundzwanzig.space</strong> ist noch nicht aktiv.
+                                            </p>
+                                            <p class="text-sm text-zinc-600 dark:text-zinc-400 mt-1">
+                                                Das Handle ist gespeichert, aber noch nicht in der NIP-05 Konfiguration veröffentlicht.
+                                                Der Vorstand wird dies bald aktivieren.
+                                            </p>
+                                        </flux:callout>
+                                    @endif
                                </div>
                            @else
                                <div class="text-xs text-zinc-500 dark:text-zinc-400 italic">
--- a/resources/views/livewire/association/project-support/form/create.blade.php
+++ b/resources/views/livewire/association/project-support/form/create.blade.php
@@ -5,12 +5,15 @@ use App\Support\NostrAuth;
 use Livewire\Attributes\Layout;
 use Livewire\Attributes\Title;
 use Livewire\Component;
+use Livewire\WithFileUploads;

 new
 #[Layout('layouts.app')]
 #[Title('Projektförderung anlegen')]
 class extends Component
 {
+    use WithFileUploads;
+
    public array $form = [
        'name' => '',
        'description' => '',
@@ -20,6 +23,8 @@ class extends Component
        'sats_paid' => 0,
    ];

+    public $file = null;
+
    public bool $isAllowed = false;

    public bool $isAdmin = false;
@@ -40,6 +45,14 @@ class extends Component
        }
    }

+    public function removeFile(): void
+    {
+        if ($this->file) {
+            $this->file->delete();
+            $this->file = null;
+        }
+    }
+
    public function save(): void
    {
        $this->validate([
@@ -47,9 +60,10 @@ class extends Component
            'form.description' => 'required|string',
            'form.support_in_sats' => 'required|integer|min:0',
            'form.website' => 'required|url|max:255',
+            'file' => 'nullable|file|mimes:jpeg,png,jpg,gif,webp|max:10240',
        ]);

-        ProjectProposal::query()->create([
+        $projectProposal = ProjectProposal::query()->create([
            'name' => $this->form['name'],
            'description' => $this->form['description'],
            'support_in_sats' => (int) $this->form['support_in_sats'],
@@ -59,6 +73,10 @@ class extends Component
            'einundzwanzig_pleb_id' => \App\Models\EinundzwanzigPleb::query()->where('pubkey', NostrAuth::pubkey())->first()->id,
        ]);

+        if ($this->file) {
+            $projectProposal->addMedia($this->file)->toMediaCollection('main');
+        }
+
        $this->redirectRoute('association.projectSupport');
    }
 };
@@ -70,8 +88,11 @@ class extends Component
                    class="flex flex-col md:flex-row items-center mb-6 space-y-4 md:space-y-0 md:space-x-4">
                    <div class="flex items-center justify-between w-full">
                        <h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold">
-                            Projektförderung anlegen
+                            Projektförderungs-Antrag anlegen
                        </h1>
+                        <flux:button :href="route('association.projectSupport')" variant="ghost" icon="arrow-left">
+                            Zurück
+                        </flux:button>
                    </div>
                </div>

@@ -97,6 +118,30 @@ class extends Component
                                        <flux:input wire:model="form.support_in_sats" type="number" placeholder="100000" />
                                        <flux:error name="form.support_in_sats" />
                                    </flux:field>
+                                    <flux:field>
+                                        <flux:label>Bild</flux:label>
+                                        <flux:file-upload wire:model="file" label="Bild hochladen">
+                                            <flux:file-upload.dropzone
+                                                heading="Bild hier ablegen oder zum Durchsuchen klicken"
+                                                text="JPG, PNG, GIF, WebP bis zu 10MB"
+                                            />
+                                        </flux:file-upload>
+                                        <flux:error name="file" />
+
+                                        @if($file)
+                                            <div class="mt-4 flex flex-col gap-2">
+                                                <flux:file-item
+                                                    :heading="$file->getClientOriginalName()"
+                                                    :image="$file->temporaryUrl()"
+                                                    :size="$file->getSize()"
+                                                >
+                                                    <x-slot name="actions">
+                                                        <flux:file-item.remove wire:click="removeFile" />
+                                                    </x-slot>
+                                                </flux:file-item>
+                                            </div>
+                                        @endif
+                                    </flux:field>
                                    <flux:editor wire:model="form.description" label="Beschreibung" description="Projektbeschreibung..." />
                                    <flux:error name="form.description" />

--- a/resources/views/livewire/association/project-support/form/edit.blade.php
+++ b/resources/views/livewire/association/project-support/form/edit.blade.php
@@ -5,12 +5,15 @@ use App\Support\NostrAuth;
 use Livewire\Attributes\Layout;
 use Livewire\Attributes\Title;
 use Livewire\Component;
+use Livewire\WithFileUploads;

 new
 #[Layout('layouts.app')]
 #[Title('Projektförderung bearbeiten')]
 class extends Component
 {
+    use WithFileUploads;
+
    public ProjectProposal $project;

    public array $form = [
@@ -22,6 +25,8 @@ class extends Component
        'sats_paid' => 0,
    ];

+    public $file = null;
+
    public bool $isAllowed = false;

    public bool $isAdmin = false;
@@ -58,6 +63,21 @@ class extends Component
        }
    }

+    public function deleteMainImage(): void
+    {
+        if ($this->project->getFirstMedia('main')) {
+            $this->project->getFirstMedia('main')->delete();
+        }
+    }
+
+    public function removeFile(): void
+    {
+        if ($this->file) {
+            $this->file->delete();
+            $this->file = null;
+        }
+    }
+
    public function update(): void
    {
        $this->validate([
@@ -65,6 +85,7 @@ class extends Component
            'form.description' => 'required|string',
            'form.support_in_sats' => 'required|integer|min:0',
            'form.website' => 'required|url|max:255',
+            'file' => 'nullable|file|mimes:jpeg,png,jpg,gif,webp|max:10240',
        ]);

        $this->project->update([
@@ -76,6 +97,10 @@ class extends Component
            'sats_paid' => $this->isAdmin ? $this->form['sats_paid'] : $this->project->sats_paid,
        ]);

+        if ($this->file) {
+            $this->project->addMedia($this->file)->toMediaCollection('main');
+        }
+
        $this->redirectRoute('association.projectSupport.item', $this->project);
    }
 };
@@ -88,8 +113,11 @@ class extends Component
                class="flex flex-col md:flex-row items-center mb-6 space-y-4 md:space-y-0 md:space-x-4">
                <div class="flex items-center justify-between w-full">
                    <h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold">
-                        Projektförderung bearbeiten
+                        Projektförderungs-Antrag bearbeiten
                    </h1>
+                    <flux:button :href="route('association.projectSupport')" variant="ghost" icon="arrow-left">
+                        Zurück
+                    </flux:button>
                </div>
            </div>

@@ -121,6 +149,46 @@ class extends Component
                                        <flux:error name="form.support_in_sats" />
                                    </flux:field>
                                </div>
+                                <div>
+                                    <flux:field>
+                                        <flux:label>Bild</flux:label>
+                                        <flux:file-upload wire:model="file" label="Bild hochladen">
+                                            <flux:file-upload.dropzone
+                                                heading="Bild hier ablegen oder zum Durchsuchen klicken"
+                                                text="JPG, PNG, GIF, WebP bis zu 10MB"
+                                            />
+                                        </flux:file-upload>
+                                        <flux:error name="file" />
+
+                                        @if($file)
+                                            <div class="mt-4 flex flex-col gap-2">
+                                                <flux:file-item
+                                                    :heading="$file->getClientOriginalName()"
+                                                    :image="$file->temporaryUrl()"
+                                                    :size="$file->getSize()"
+                                                >
+                                                    <x-slot name="actions">
+                                                        <flux:file-item.remove wire:click="removeFile" />
+                                                    </x-slot>
+                                                </flux:file-item>
+                                            </div>
+                                        @endif
+                                    </flux:field>
+
+                                    @if($project->getFirstMedia('main'))
+                                        <div class="mt-4">
+                                            <flux:file-item
+                                                :heading="$project->getFirstMedia('main')->file_name"
+                                                :image="$project->getFirstMediaUrl('main')"
+                                                :size="$project->getFirstMedia('main')->size"
+                                            >
+                                                <x-slot name="actions">
+                                                    <flux:file-item.remove wire:click="deleteMainImage" />
+                                                </x-slot>
+                                            </flux:file-item>
+                                        </div>
+                                    @endif
+                                </div>
                                <div>
                                    <flux:editor wire:model="form.description" label="Beschreibung" description="Projektbeschreibung..." />
                                    <flux:error name="form.description" />
--- a/resources/views/livewire/association/project-support/index.blade.php
+++ b/resources/views/livewire/association/project-support/index.blade.php
@@ -1,5 +1,6 @@
 <?php

+use App\Livewire\Traits\WithNostrAuth;
 use App\Models\EinundzwanzigPleb;
 use App\Models\ProjectProposal;
 use App\Support\NostrAuth;
@@ -8,6 +9,8 @@ use Illuminate\Database\Eloquent\Collection;
 use Livewire\Component;

 new class extends Component {
+    use WithNostrAuth;
+
    public string $activeFilter = 'all';

    public ?string $confirmDeleteId = null;
@@ -20,8 +23,6 @@ new class extends Component {

    public ?string $currentPubkey = null;

-    public ?EinundzwanzigPleb $currentPleb = null;
-
    public ?ProjectProposal $projectToDelete = null;

    protected $listeners = [
@@ -33,11 +34,6 @@ new class extends Component {
    public function mount(): void
    {
        $this->loadProjects();
-        if (NostrAuth::check()) {
-            $this->currentPubkey = NostrAuth::pubkey();
-            $this->currentPleb = EinundzwanzigPleb::query()->where('pubkey', $this->currentPubkey)->first();
-            $this->isAllowed = true;
-        }
    }

    public function updatedSearch(): void
@@ -134,44 +130,46 @@ new class extends Component {
                    </flux:button>
                </li>
                <li class="m-1">
-                    <flux:button wire:click="setFilter('supported')" :variant="$activeFilter === 'supported' ? 'primary' : 'ghost'">
+                    <flux:button wire:click="setFilter('supported')"
+                                 :variant="$activeFilter === 'supported' ? 'primary' : 'ghost'">
                        Unterstützt
                    </flux:button>
                </li>
                <li class="m-1">
-                    <flux:button wire:click="setFilter('rejected')" :variant="$activeFilter === 'rejected' ? 'primary' : 'ghost'">
+                    <flux:button wire:click="setFilter('rejected')"
+                                 :variant="$activeFilter === 'rejected' ? 'primary' : 'ghost'">
                        Abgelehnt
                    </flux:button>
                </li>
            </ul>
        </div>
-         <div class="text-sm text-zinc-500 dark:text-zinc-400 italic mb-4">{{ $projects->count() }} Projekte</div>
+        <div class="text-sm text-zinc-500 dark:text-zinc-400 italic mb-4">{{ $projects->count() }} Projekte</div>

-         <!-- Content -->
-         <div class="grid xl:grid-cols-2 gap-6 mb-8">
-             @foreach($this->projects as $project)
-                 <x-project-card :project="$project" :currentPleb="$currentPleb" :section="$activeFilter"/>
-             @endforeach
-         </div>
+        <!-- Content -->
+        <div class="grid xl:grid-cols-2 gap-6 mb-8">
+            @foreach($this->projects as $project)
+                <x-project-card :project="$project" :currentPleb="$currentPleb" :section="$activeFilter"/>
+            @endforeach
+        </div>

-         <!-- Delete confirmation modal -->
-         <flux:modal name="delete-project" class="min-w-88">
-             <div class="space-y-6">
-                 <div>
-                     <flux:heading size="lg">Projektunterstützung löschen?</flux:heading>
-                     <flux:text class="mt-2">
-                         <p>Du bist dabei, diese Projektunterstützung zu löschen.</p>
-                         <p>Diese Aktion kann nicht rückgängig gemacht werden.</p>
-                     </flux:text>
-                 </div>
-                 <div class="flex gap-2">
-                     <flux:spacer/>
-                     <flux:modal.close>
-                         <flux:button variant="ghost">Abbrechen</flux:button>
-                     </flux:modal.close>
-                     <flux:button wire:click="delete" variant="danger">Löschen</flux:button>
-                 </div>
-             </div>
-         </flux:modal>
-     </div>
+        <!-- Delete confirmation modal -->
+        <flux:modal name="delete-project" class="min-w-88">
+            <div class="space-y-6">
+                <div>
+                    <flux:heading size="lg">Projektunterstützung löschen?</flux:heading>
+                    <flux:text class="mt-2">
+                        <p>Du bist dabei, diese Projektunterstützung zu löschen.</p>
+                        <p>Diese Aktion kann nicht rückgängig gemacht werden.</p>
+                    </flux:text>
+                </div>
+                <div class="flex gap-2">
+                    <flux:spacer/>
+                    <flux:modal.close>
+                        <flux:button variant="ghost">Abbrechen</flux:button>
+                    </flux:modal.close>
+                    <flux:button wire:click="delete" variant="danger">Löschen</flux:button>
+                </div>
+            </div>
+        </flux:modal>
+    </div>
 </div>
--- a/resources/views/livewire/association/project-support/show.blade.php
+++ b/resources/views/livewire/association/project-support/show.blade.php
@@ -1,6 +1,7 @@
 <?php

 use App\Livewire\Traits\WithNostrAuth;
+use App\Models\ProjectProposal;
 use App\Models\Vote;
 use App\Support\NostrAuth;
 use Livewire\Component;
@@ -20,10 +21,15 @@ new class extends Component {

    public function mount($projectProposal): void
    {
-        $this->projectProposal = \App\Models\ProjectProposal::query()->where('slug', $projectProposal)->firstOrFail();
+        $this->projectProposal = ProjectProposal::query()->where('slug', $projectProposal)->firstOrFail();
        if (NostrAuth::check()) {
            $this->currentPubkey = NostrAuth::pubkey();
            $this->isAllowed = true;
+            $this->mountWithNostrAuth();
+            $this->ownVoteExists = Vote::query()
+                ->where('project_proposal_id', $this->projectProposal->id)
+                ->where('einundzwanzig_pleb_id', $this->currentPleb->id)
+                ->exists();
        }
    }

@@ -54,6 +60,10 @@ new class extends Component {
        ], [
            'value' => true,
        ]);
+        $this->ownVoteExists = Vote::query()
+            ->where('project_proposal_id', $this->projectProposal->id)
+            ->where('einundzwanzig_pleb_id', $this->currentPleb->id)
+            ->exists();
    }

    public function handleNotApprove(): void
@@ -64,6 +74,10 @@ new class extends Component {
        ], [
            'value' => false,
        ]);
+        $this->ownVoteExists = Vote::query()
+            ->where('project_proposal_id', $this->projectProposal->id)
+            ->where('einundzwanzig_pleb_id', $this->currentPleb->id)
+            ->exists();
    }
 }
 ?>