diff --git a/src/common/Hamburger.svelte b/src/common/Hamburger.svelte
index 8acb57885..a2a08a86a 100644
--- a/src/common/Hamburger.svelte
+++ b/src/common/Hamburger.svelte
@@ -1,12 +1,12 @@
-<script>
-  import { createEventDispatcher } from "svelte";
+<script lang="ts">
   import { ThreeBars16 } from "svelte-octicons";
 
-  const dispatch = createEventDispatcher();
+  let className: string = "";
+  export { className as class };
 </script>
 
 <div class="hamburger">
-  <button class="svg buttonLike" on:click={(e) => dispatch("toggle")}>
+  <button class={`svg buttonLike ${className}`} on:click>
     <ThreeBars16 />
   </button>
 </div>
diff --git a/src/pages/app/MainContainer.svelte b/src/pages/app/MainContainer.svelte
index 1e0315c8f..b87497a8b 100644
--- a/src/pages/app/MainContainer.svelte
+++ b/src/pages/app/MainContainer.svelte
@@ -102,7 +102,10 @@
     <Modal component={UploadEmailDialog} on:close={hideMailkey} />
   {/if}
   {#if !embed}
-    <Hamburger on:toggle={emit.expandSidebar} />
+    <Hamburger
+      class="plausible-event-name=sidebar-expand"
+      on:click={emit.expandSidebar}
+    />
   {/if}
   {#if !$documents.error}
     <div
diff --git a/src/pages/app/sidebar/Sidebar.svelte b/src/pages/app/sidebar/Sidebar.svelte
index 51f447d24..79c6e4674 100644
--- a/src/pages/app/sidebar/Sidebar.svelte
+++ b/src/pages/app/sidebar/Sidebar.svelte
@@ -19,7 +19,10 @@
 
 <aside class="sidebar" class:expanded>
   <header>
-    <Hamburger on:toggle={(e) => dispatch("retractSidebar")} />
+    <Hamburger
+      class="plausible-event-name=sidebar-retract"
+      on:click={(e) => dispatch("retractSidebar")}
+    />
     <Logo />
   </header>
 
diff --git a/src/pages/viewer/Header.svelte b/src/pages/viewer/Header.svelte
index 79e2adbf5..c684ef8e0 100644
--- a/src/pages/viewer/Header.svelte
+++ b/src/pages/viewer/Header.svelte
@@ -7,7 +7,7 @@
   import Link from "../../router/Link.svelte";
 
   import Search from "./controls/Search.svelte";
-  import Hamburger from "./controls/Hamburger.svelte";
+  import Hamburger from "../../common/Hamburger.svelte";
 
   import { HEADER_HEIGHT } from "./constants.js";
 
@@ -60,7 +60,10 @@
       <Search />
     </div>
     <div class="cell">
-      <Hamburger on:click={(e) => dispatch("toggle.sidebar")} />
+      <Hamburger
+        class="plausible-event-name=viewer-hamburger"
+        on:click={(e) => dispatch("toggle.sidebar")}
+      />
     </div>
   </div>
 </header>
diff --git a/src/pages/viewer/controls/Hamburger.svelte b/src/pages/viewer/controls/Hamburger.svelte
deleted file mode 100644
index 1693ff2ac..000000000
--- a/src/pages/viewer/controls/Hamburger.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script>
-  // SVG assets
-  import { ThreeBars16 } from "svelte-octicons";
-</script>
-
-<button class="hamburger plausible-event-name=viewer-hamburger" on:click>
-  <ThreeBars16 />
-</button>
-
-<style>
-  .hamburger {
-    background: none;
-    border: none;
-    cursor: pointer;
-    margin: 0.5em;
-  }
-</style>
diff --git a/src/pages/viewer/controls/stories/Hamburger.stories.svelte b/src/pages/viewer/controls/stories/Hamburger.stories.svelte
deleted file mode 100644
index 7b9be2cbb..000000000
--- a/src/pages/viewer/controls/stories/Hamburger.stories.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script context="module">
-  import { Story } from "@storybook/addon-svelte-csf";
-  import Hamburger from "../Hamburger.svelte";
-
-  export const meta = {
-    title: "Viewer / Controls / Hamburger",
-    component: Hamburger,
-  };
-</script>
-
-<Story name="default">
-  <Hamburger on:click />
-</Story>