From 1827d10bf4318235eee67abfc091bbd84ea513b1 Mon Sep 17 00:00:00 2001
From: Adam Goldsmith <adam@adamgoldsmith.name>
Date: Fri, 9 Aug 2024 01:47:07 -0400
Subject: [PATCH] membershipworks: Fix script in upcoming events post generator

---
 .../upcoming_events_post_generator.entry.ts   | 19 +++++++++++++
 .../membershipworks/upcoming_events.dj.html   | 27 ++++---------------
 2 files changed, 24 insertions(+), 22 deletions(-)
 create mode 100644 membershipworks/js/upcoming_events_post_generator.entry.ts

diff --git a/membershipworks/js/upcoming_events_post_generator.entry.ts b/membershipworks/js/upcoming_events_post_generator.entry.ts
new file mode 100644
index 0000000..c9161cb
--- /dev/null
+++ b/membershipworks/js/upcoming_events_post_generator.entry.ts
@@ -0,0 +1,19 @@
+import { Popover } from "bootstrap";
+
+async function copyToClipboard(event: MouseEvent) {
+  // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API
+  const data = new ClipboardItem({
+    "text/plain": new Blob([document.getElementById("preview")!.innerHTML], {
+      type: "text/plain",
+    }),
+  });
+  await navigator.clipboard.write([data]);
+
+  let popover = Popover.getInstance(event.target as Element)!;
+  popover.show();
+  setTimeout(() => popover.hide(), 1000);
+}
+
+const button = document.getElementById("copy-button")!;
+new Popover(button, { trigger: "manual" });
+button.addEventListener("click", copyToClipboard);
diff --git a/membershipworks/templates/membershipworks/upcoming_events.dj.html b/membershipworks/templates/membershipworks/upcoming_events.dj.html
index 7524215..5a42a29 100644
--- a/membershipworks/templates/membershipworks/upcoming_events.dj.html
+++ b/membershipworks/templates/membershipworks/upcoming_events.dj.html
@@ -1,6 +1,11 @@
 {% extends "base.dj.html" %}
 
 {% load nh3_tags %}
+{% load django_vite %}
+
+{% block vite_extra_assets %}
+  {% vite_asset 'membershipworks/js/upcoming_events_post_generator.entry.ts' %}
+{% endblock %}
 
 {% block title %}Upcoming Events{% endblock %}
 {% block content %}
@@ -136,25 +141,3 @@
     </button>
   </div>
 {% endblock %}
-{% block script %}
-  <script>
-    async function copyToClipboard(event) {
-      // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API
-      const data = new ClipboardItem({
-        "text/plain": new Blob(
-          [document.getElementById("preview").innerHTML], {
-            type: "text/plain"
-          })
-      });
-      await navigator.clipboard.write([data]);
-
-      bootstrap.Popover.getInstance(event.target).show();
-      setTimeout(() => bootstrap.Popover.getInstance(event.target).hide(), 1000);
-    }
-    const button = document.getElementById("copy-button");
-    const popover = new bootstrap.Popover(button, {
-      trigger: "manual"
-    })
-    button.addEventListener("click", copyToClipboard);
-  </script>
-{% endblock %}