Show Bedrock IP button on welcome page

Fixes #398

Add a button to display and copy the Bedrock IP:Port on the welcome page.

* Add a new nullable string property `bedrock_ip_port` to the `GeneralSettings` class in `app/Settings/GeneralSettings.php`.
* Update the `home` method in `app/Http/Controllers/HomeController.php` to include `bedrock_ip_port` in the data passed to the view.
* Modify `resources/default/js/Pages/Welcome.vue` to include a button for Bedrock IP:Port and a method to copy it to the clipboard.
* Update `resources/default/js/Shared/WelcomeBox.vue` to display the Bedrock IP:Port button if `bedrock_ip_port` is set and add a method to copy it to the clipboard.

---

For more details, open the [Copilot Workspace session](https://copilot-workspace.githubnext.com/MineTrax/minetrax/issues/398?shareId=XXXX-XXXX-XXXX-XXXX).

app/Http/Controllers/HomeController.php

@@ -124,6 +124,7 @@ public function home(Request $request, GeneralSettings $generalSettings, ThemeSe
                 'show_discord_box_in_home_hero' => $themeSettings->show_discord_box_in_home_hero,
                 'home_hero_bg_particles' => $themeSettings->home_hero_bg_particles,
             ],
+            'bedrockIpPort' => $generalSettings->bedrock_ip_port,
         ]);
     }
 

app/Settings/GeneralSettings.php

@@ -50,6 +50,8 @@ class GeneralSettings extends Settings
     public ?string $header_broadcast_url;
     public bool $enable_topplayersbox;
 
+    public ?string $bedrock_ip_port;
+
     public static function group(): string
     {
         return 'general';

resources/default/js/Pages/Welcome.vue

@@ -146,6 +146,34 @@
         </div>
       </div>
     </div>
+
+    <div v-if="bedrockIpPort" class="p-6 border-t border-gray-200">
+      <div class="flex items-center">
+        <svg
+          fill="none"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          class="w-8 h-8 text-gray-400"
+        ><path d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" /></svg>
+        <div class="ml-4 text-lg text-gray-600 leading-7 font-semibold">
+          Bedrock IP:Port
+        </div>
+      </div>
+
+      <div class="ml-12">
+        <div class="mt-2 text-sm text-gray-500">
+          <button
+            @click="copyToClipboard(bedrockIpPort)"
+            class="text-indigo-700"
+          >
+            {{ bedrockIpPort }}
+          </button>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -156,5 +184,18 @@ export default {
     components: {
         JetApplicationLogo,
     },
+    props: {
+        bedrockIpPort: {
+            type: String,
+            default: null,
+        },
+    },
+    methods: {
+        copyToClipboard(text) {
+            navigator.clipboard.writeText(text).then(() => {
+                alert('Copied to clipboard');
+            });
+        },
+    },
 };
 </script>

resources/default/js/Shared/WelcomeBox.vue

@@ -7,11 +7,25 @@
       />
     </div>
   </div>
+  <div v-if="bedrockIpPort" class="mt-4 text-center">
+    <button
+      @click="copyToClipboard(bedrockIpPort)"
+      class="px-4 py-2 font-semibold text-white bg-indigo-600 rounded hover:bg-indigo-700"
+    >
+      Copy Bedrock IP:Port
+    </button>
+  </div>
 </template>
 
 <script>
-
 export default {
-    props: ['htmlData']
+  props: ['htmlData', 'bedrockIpPort'],
+  methods: {
+    copyToClipboard(text) {
+      navigator.clipboard.writeText(text).then(() => {
+        alert('Copied to clipboard');
+      });
+    },
+  },
 };
 </script>