UI: machine details layout consistent

pkgs/webview-ui/app/src/routes/machines/details.tsx

@@ -1,6 +1,5 @@
 import { callApi, SuccessData, SuccessQuery } from "@/src/api";
 import { activeURI } from "@/src/App";
-import { BackButton } from "@/src/components/BackButton";
 import { Button } from "@/src/components/button";
 import { FileInput } from "@/src/components/FileInput";
 import Icon from "@/src/components/icon";
@@ -17,6 +16,7 @@ import { createQuery } from "@tanstack/solid-query";
 import { createSignal, For, Show } from "solid-js";
 import toast from "solid-toast";
 import { MachineAvatar } from "./avatar";
+import { Header } from "@/src/layout/header";
 
 type MachineFormInterface = MachineData & {
   sshKey?: File;
@@ -502,8 +502,9 @@ export const MachineDetails = () => {
   }));
 
   return (
+    <>
+      <Header title={`${params.id} machine`} showBack />
       <div class="card">
-      <BackButton />
         <Show
           when={genericQuery.data}
           fallback={<span class="loading loading-lg"></span>}
@@ -515,6 +516,7 @@ export const MachineDetails = () => {
           )}
         </Show>
       </div>
+    </>
   );
 };