Add Slug population up to blade itself

resources/views/games/create.blade.php

@@ -13,6 +13,7 @@
                 // Update the form fields with game details
                 console.log(game);
                 document.getElementById("game_name").value = game['name'];
+                document.getElementById("game_slug").value = game['slug'];
                 document.getElementById("category").value = formatCategoryToHumanReadable(game.category);
                 document.getElementById("summary").value = game.summary;
                 //document.getElementById("summary").value = "php translate(':summary', 'de') ".replace(':summary', game.summary);
@@ -118,6 +119,10 @@
                                 <div>
                                     <img x-bind:src="gameDetails.cover_image_path" alt="Game Cover " class="mt-2">
                                 </div>
+                                <div>
+                                    <label for="game_slug" class="block text-sm font-medium text-gray-700 dark:text-gray-400">IGDB Slug</label>
+                                    <input type="text" name="game_slug" id="game_slug" x-model="gameDetails.slug" readonly class="w-full p-2 border-gray-300 rounded-md focus:border-blue-500 focus:outline-none focus:shadow-outline-blue dark:bg-gray-700 dark:text-gray-100 dark:border-gray-600">
+                                </div>
                                 <div>
                                     <label for="category" class="block text-sm font-medium text-gray-700 dark:text-gray-400">Category</label>
                                     <textarea name="category" id="category" placeholder="" x-model="gameDetails.category" readonly rows="3" class="w-full p-2 border-gray-300 rounded-md focus:border-blue-500 focus:outline-none focus:shadow-outline-blue dark:bg-gray-700 dark:text-gray-100 dark:border-gray-600"></textarea>