Display diff stats badge in patch summary

src/components/DiffStatBadge.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   export let insertions: number;
   export let deletions: number;
+  export let hoverable: boolean = false;
 </script>
 
 <style>
@@ -14,10 +15,10 @@
     border-radius: var(--border-radius-round);
     overflow: hidden;
   }
-  .badge:hover .positive {
+  .hoverable:hover .positive {
     background-color: var(--color-fill-diff-green);
   }
-  .badge:hover .negative {
+  .hoverable:hover .negative {
     background-color: var(--color-fill-diff-red);
   }
   .positive {
@@ -36,7 +37,7 @@
   }
 </style>
 
-<div class="badge">
+<div class="badge" class:hoverable>
   <div class="positive">
     +{insertions}
   </div>

src/views/projects/Cob/Revision.svelte

@@ -304,7 +304,7 @@
               view: { name: "diff", fromCommit, toCommit: revisionOid },
             }}>
             {@const { insertions, deletions } = response.diff.stats}
-            <DiffStatBadge {insertions} {deletions} />
+            <DiffStatBadge hoverable {insertions} {deletions} />
           </Link>
         {/if}
         <Popover

src/views/projects/Patch.svelte

@@ -7,6 +7,7 @@
     LifecycleState,
     PatchState,
     Revision,
+    Diff,
   } from "@httpd-client";
 
   interface Thread {
@@ -62,6 +63,7 @@
   import CobStateButton from "@app/views/projects/Cob/CobStateButton.svelte";
   import CommentToggleInput from "@app/components/CommentToggleInput.svelte";
   import CopyableId from "@app/components/CopyableId.svelte";
+  import DiffStatBadge from "@app/components/DiffStatBadge.svelte";
   import DropdownList from "@app/components/DropdownList.svelte";
   import DropdownListItem from "@app/components/DropdownList/DropdownListItem.svelte";
   import Embeds from "@app/views/projects/Cob/Embeds.svelte";
@@ -85,6 +87,7 @@
 
   export let baseUrl: BaseUrl;
   export let patch: Patch;
+  export let stats: Diff["stats"];
   export let rawPath: (commit?: string) => string;
   export let project: Project;
   export let view: PatchView;
@@ -602,6 +605,7 @@
     ].sort((a, b) => a.timestamp - b.timestamp),
   ]);
   $: firstRevision = timelineTuple[0][0];
+  $: latestRevision = patch.revisions[patch.revisions.length - 1];
   $: session =
     $httpdStore.state === "authenticated" && utils.isLocal(baseUrl.hostname)
       ? $httpdStore.session
@@ -769,6 +773,19 @@
             <IconSmall name="patch" />
             {capitalize(patch.state.status)}
           </Badge>
+          <Link
+            route={{
+              resource: "project.patch",
+              project: project.id,
+              node: baseUrl,
+              patch: patch.id,
+              view: { name: "changes", revision: latestRevision.id },
+            }}>
+            <DiffStatBadge
+              hoverable
+              insertions={stats.insertions}
+              deletions={stats.deletions} />
+          </Link>
         </svelte:fragment>
         <svelte:fragment slot="description">
           <div class="revision-description">

src/views/projects/Patch/PatchTeaser.svelte

@@ -199,6 +199,7 @@
             },
           }}>
           <DiffStatBadge
+            hoverable
             insertions={diff.stats.insertions}
             deletions={diff.stats.deletions} />
         </Link>

src/views/projects/router.ts

@@ -188,6 +188,7 @@ export type ProjectLoadedRoute =
         project: Project;
         rawPath: (commit?: string) => string;
         patch: Patch;
+        stats: Diff["stats"];
         view: PatchView;
       };
     };
@@ -572,6 +573,11 @@ async function loadPatchView(
     api.project.getPatchById(route.project, route.patch),
   ]);
   const latestRevision = patch.revisions[patch.revisions.length - 1];
+  const { diff } = await api.project.getDiff(
+    route.project,
+    latestRevision.base,
+    latestRevision.oid,
+  );
 
   let view: PatchView;
   switch (route.view?.name) {
@@ -623,6 +629,7 @@ async function loadPatchView(
       project,
       rawPath,
       patch,
+      stats: diff.stats,
       view,
     },
   };