3 files changed, 32 insertions, 5 deletions
diff --git a/src/lib/async/cancelable.ts b/src/lib/async/cancelable.ts
new file mode 100644
index 000000000..50fbcc63b
--- /dev/null
+++ b/src/lib/async/cancelable.ts
@@ -0,0 +1,20 @@
+export function cancelable<A, T>(
+  f: (args: A) => Promise<T>,
+  signal: AbortSignal,
+) {
+  return (args: A) => {
+    return new Promise<T>((resolve, reject) => {
+      signal.addEventListener('abort', () => {
+        reject(new AbortError())
+      })
+      f(args).then(resolve, reject)
+    })
+  }
+}
+
+export class AbortError extends Error {
+  constructor() {
+    super('Aborted')
+    this.name = 'AbortError'
+  }
+}
diff --git a/src/lib/media/video/compress.ts b/src/lib/media/video/compress.ts
index 60e5e94a0..957617596 100644
--- a/src/lib/media/video/compress.ts
+++ b/src/lib/media/video/compress.ts
@@ -8,19 +8,25 @@ export type CompressedVideo = {
 export async function compressVideo(
   file: string,
   opts?: {
-    getCancellationId?: (id: string) => void
+    signal?: AbortSignal
     onProgress?: (progress: number) => void
   },
 ): Promise<CompressedVideo> {
-  const {onProgress, getCancellationId} = opts || {}
+  const {onProgress, signal} = opts || {}
 
   const compressed = await Video.compress(
     file,
     {
-      getCancellationId,
       compressionMethod: 'manual',
       bitrate: 3_000_000, // 3mbps
       maxSize: 1920,
+      getCancellationId: id => {
+        if (signal) {
+          signal.addEventListener('abort', () => {
+            Video.cancelCompression(id)
+          })
+        }
+      },
     },
     onProgress,
   )
diff --git a/src/lib/media/video/compress.web.ts b/src/lib/media/video/compress.web.ts
index 968f2b157..11ccb5104 100644
--- a/src/lib/media/video/compress.web.ts
+++ b/src/lib/media/video/compress.web.ts
@@ -10,8 +10,9 @@ export type CompressedVideo = {
 // doesn't actually compress, but throws if >100MB
 export async function compressVideo(
   file: string,
-  _callbacks?: {
-    onProgress: (progress: number) => void
+  _opts?: {
+    signal?: AbortSignal
+    onProgress?: (progress: number) => void
   },
 ): Promise<CompressedVideo> {
   const blob = await fetch(file).then(res => res.blob())