1 files changed, 32 insertions, 0 deletions
diff --git a/src/apps/music.tsx b/src/apps/music.tsx
new file mode 100644
index 0000000..5b1ef27
--- /dev/null
+++ b/src/apps/music.tsx
@@ -0,0 +1,32 @@
+import { useEffect, useState } from "preact/hooks"
+import { Signal } from "@preact/signals";
+import { memo } from "preact/compat";
+
+const Iframe = memo(function Iframe() {
+    return <iframe style="border: 0; height: 30em" src="https://bandcamp.com/EmbeddedPlayer/album=3374731395/size=large/bgcol=000000/linkcol=ff0047/transparent=true/" seamless><a href="https://sunnexo.bandcamp.com/album/netpunk">Netpunk by Sunnexo</a></iframe>
+})
+
+export const Music = memo(function Music({ title }: Music.Props) {
+    const [userApproves, setUserApproves] = useState(false);
+
+    useEffect(() => {
+        title.value = "Stream on BandCamp"
+    }, [])
+
+    if (userApproves) {
+        return <Iframe />
+    } else {
+        return <div class="external_warning">
+            <div>Click here to load player from <a href="https://bandcamp.com">https://bandcamp.com</a></div>
+            <button onClick={() => setUserApproves(true)}>
+                Load player
+            </button>
+        </div>
+    }
+})
+
+namespace Music {
+    export type Props = {
+        title: Signal<string | undefined>,
+    }
+}