Fix HTML entities showing in support form

resources/views/livewire/customer/support/create.blade.php

@@ -35,11 +35,11 @@
 
                         <flux:radio.group wire:model.live="selectedProduct" variant="cards" class="flex-col">
                             @foreach ([
-                                'mobile' => ['label' => 'Mobile', 'desc' => 'iOS & Android apps'],
-                                'desktop' => ['label' => 'Desktop', 'desc' => 'macOS, Windows & Linux apps'],
-                                'nativephp.com' => ['label' => 'nativephp.com', 'desc' => 'Website, account & billing'],
+                                'mobile' => ['label' => 'Mobile', 'desc' => 'iOS and Android apps'],
+                                'desktop' => ['label' => 'Desktop', 'desc' => 'macOS, Windows and Linux apps'],
+                                'nativephp.com' => ['label' => 'nativephp.com', 'desc' => 'Website, account and billing'],
                             ] as $value => $product)
-                                <flux:radio value="{{ $value }}" label="{{ $product['label'] }}" description="{{ $product['desc'] }}" />
+                                <flux:radio :value="$value" :label="$product['label']" :description="$product['desc']" />
                             @endforeach
                         </flux:radio.group>
                     </div>
@@ -105,7 +105,7 @@
                                         wire:model="reproductionSteps"
                                         label="Steps to reproduce"
                                         rows="4"
-                                        placeholder="1. Open the app&#10;2. Navigate to...&#10;3. Click on..."
+                                        :placeholder="implode(PHP_EOL, ['1. Open the app', '2. Navigate to...', '3. Click on...'])"
                                     />
 
                                     <flux:field>

resources/views/livewire/customer/support/show.blade.php

@@ -133,7 +133,7 @@
                     </div>
 
                     <div class="mt-3 flex items-center justify-end gap-3">
-                        <flux:text class="text-xs">&#8984;/Ctrl + Enter to send</flux:text>
+                        <flux:text class="text-xs">⌘/Ctrl + Enter to send</flux:text>
                         <flux:button type="submit" variant="primary" icon="arrow-uturn-left">
                             Send Reply
                         </flux:button>

tests/Feature/SupportFormPlaceholderTest.php

@@ -0,0 +1,37 @@
+<?php
+
+namespace Tests\Feature;
+
+use App\Livewire\Customer\Support\Create;
+use App\Models\License;
+use App\Models\User;
+use Illuminate\Foundation\Testing\RefreshDatabase;
+use Laravel\Cashier\Subscription;
+use Livewire\Livewire;
+use PHPUnit\Framework\Attributes\Test;
+use Tests\TestCase;
+
+class SupportFormPlaceholderTest extends TestCase
+{
+    use RefreshDatabase;
+
+    #[Test]
+    public function reproduction_steps_placeholder_does_not_render_literal_html_entities(): void
+    {
+        config(['subscriptions.plans.max.stripe_price_id' => 'price_test_max_yearly']);
+        $user = User::factory()->create();
+        License::factory()->max()->active()->create(['user_id' => $user->id]);
+        Subscription::factory()->for($user)->active()->create([
+            'stripe_price' => 'price_test_max_yearly',
+        ]);
+
+        $html = Livewire::actingAs($user)
+            ->test(Create::class)
+            ->set('selectedProduct', 'mobile')
+            ->call('nextStep')
+            ->html();
+
+        $this->assertStringNotContainsString('&#10;', $html);
+        $this->assertStringContainsString("1. Open the app\n2. Navigate to...\n3. Click on...", $html);
+    }
+}