Add some initial code for the popover service

client/src/components/highlights/HighlightPopover.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="highlight-popover">
+    <h1>Hello</h1>
+    <button @click="emit('confirm')">Confirm</button>
+    <button @click="emit('close')">Close</button>
+  </div>
+</template>
+
+<script setup lang="ts">
+console.log('hi');
+const emit = defineEmits(['close', 'confirm']);
+</script>

client/src/helpers/popover.ts

@@ -0,0 +1,37 @@
+import HighlightPopover from '@/components/highlights/HighlightPopover.vue';
+import { createApp } from 'vue';
+
+type ResolveReject = (v?: unknown) => void;
+
+export default {
+  show() {
+    const mountEl = document.createElement('div');
+    document.body.appendChild(mountEl);
+
+    let _resolve: ResolveReject, _reject: ResolveReject;
+
+    const promise = new Promise((resolve, reject) => {
+      _resolve = resolve;
+      _reject = reject;
+    });
+
+    const cleanUp = () => {
+      mountEl?.parentNode?.removeChild(mountEl);
+      popover.unmount();
+    };
+
+    const popover = createApp(HighlightPopover, {
+      onConfirm() {
+        cleanUp();
+        _resolve();
+      },
+      onClose() {
+        cleanUp();
+        _reject();
+      },
+    });
+
+    popover.mount(mountEl);
+    return promise;
+  },
+};