Fixing Front end issues related to image loading and SEO (#219)

* Update mariadb.json

* Update vaultwarden.json

* Update vaultwarden.json

* Update keycloak.json

* Update json/keycloak.json

Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>

* Update mariadb.json

Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>

* Add canonical link to layout for improved SEO and page indexing

* Fix image source fallback for script logos to use a consistent relative path

* Fix image source for script logos across components to consistently use the "/ProxmoxVE/logo.png" path

* Update image source for script logos to use basePath for consistent paths across all components

* Fix image source for script logos to ensure leading slash is consistent for all components' paths

---------

Co-authored-by: CanbiZ <47820557+MickLesk@users.noreply.github.com>
Co-authored-by: Håvard Gjøby Thom <34199185+havardthom@users.noreply.github.com>

frontend/src/components/CommandMenu.tsx

@@ -15,6 +15,7 @@ import React from "react";
 import { Badge } from "./ui/badge";
 import { Button } from "./ui/button";
 import { DialogTitle } from "./ui/dialog";
+import { basePath } from "@/config/siteConfig";
 
 export const formattedBadge = (type: string) => {
   switch (type) {
@@ -102,10 +103,10 @@ export default function CommandMenu() {
                 >
                   <div className="flex gap-2" onClick={() => setOpen(false)}>
                     <Image
-                      src={script.logo || "/logo.png"}
+                      src={script.logo || `/${basePath}/logo.png`}
                       onError={(e) =>
                         ((e.currentTarget as HTMLImageElement).src =
-                          "/logo.png")
+                          `/${basePath}/logo.png`)
                       }
                       unoptimized
                       width={16}