diff --git a/packages/skin-museum-client/src/WebampComponent.js b/packages/skin-museum-client/src/WebampComponent.js
index b52af240..47fa1c37 100644
--- a/packages/skin-museum-client/src/WebampComponent.js
+++ b/packages/skin-museum-client/src/WebampComponent.js
@@ -1,177 +1,168 @@
-import React from "react";
-import Disposable from "./Disposable";
+import React, { useEffect, useRef } from "react";
 
-class WebampComponent extends React.Component {
-  constructor(props) {
-    super(props);
-    this._disposable = new Disposable();
-  }
-  async componentDidMount() {
-    await this._loadWebamp();
-  }
+function WebampComponent({ skinUrl, closeModal, loaded }) {
+  const ref = useRef(null);
+  const webampRef = useRef(null);
 
-  componentWillUnmount() {
-    this._disposable.dispose();
-  }
+  useEffect(() => {
+    let disposed = false;
+    let cleanup = () => {};
 
-  async _loadWebamp() {
-    // TODO: Fix export
-    await import("webamp");
-    const Webamp = window.Webamp;
+    async function loadWebamp() {
+      const { default: Webamp } = await import("webamp");
 
-    if (this._disposable.disposed) {
-      return;
-    }
-    // https://freemusicarchive.org/music/netBloc_Artists/netBloc_Vol_24_tiuqottigeloot/
-    const album = "netBloc Vol. 24: tiuqottigeloot";
+      if (disposed) return;
 
-    this._webamp = new Webamp({
-      initialSkin: {
-        url: this.props.skinUrl,
-      },
-      initialTracks: [
-        {
-          metaData: {
-            artist: "DJ Mike Llama",
-            title: "Llama Whippin' Intro",
-          },
-          url: "/llama.mp3",
-          duration: 5.322286,
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Diablo_Swing_Orchestra_-_01_-_Heroines.mp3",
-          duration: 322.612245,
-          metaData: {
-            title: "Heroines",
-            artist: "Diablo Swing Orchestra",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Eclectek_-_02_-_We_Are_Going_To_Eclecfunk_Your_Ass.mp3",
-          duration: 190.093061,
-          metaData: {
-            title: "We Are Going To Eclecfunk Your Ass",
-            artist: "Eclectek",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Auto-Pilot_-_03_-_Seventeen.mp3",
-          duration: 214.622041,
-          metaData: {
-            title: "Seventeen",
-            artist: "Auto-Pilot",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Muha_-_04_-_Microphone.mp3",
-          duration: 181.838367,
-          metaData: {
-            title: "Microphone",
-            artist: "Muha",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Just_Plain_Ant_-_05_-_Stumble.mp3",
-          duration: 86.047347,
-          metaData: {
-            title: "Stumble",
-            artist: "Just Plain Ant",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Sleaze_-_06_-_God_Damn.mp3",
-          duration: 226.795102,
-          metaData: {
-            title: "God Damn",
-            artist: "Sleaze",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Juanitos_-_07_-_Hola_Hola_Bossa_Nova.mp3",
-          duration: 207.072653,
-          metaData: {
-            title: "Hola Hola Bossa Nova",
-            artist: "Juanitos",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Entertainment_for_the_Braindead_-_08_-_Resolutions_Chris_Summer_Remix.mp3",
-          duration: 314.331429,
-          metaData: {
-            title: "Resolutions (Chris Summer Remix)",
-            artist: "Entertainment for the Braindead",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Nobara_Hayakawa_-_09_-_Trail.mp3",
-          duration: 204.042449,
-          metaData: {
-            title: "Trail",
-            artist: "Nobara Hayakawa",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Paper_Navy_-_10_-_Tongue_Tied.mp3",
-          duration: 201.116735,
-          metaData: {
-            title: "Tongue Tied",
-            artist: "Paper Navy",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/60_Tigres_-_11_-_Garage.mp3",
-          duration: 245.394286,
-          metaData: {
-            title: "Garage",
-            artist: "60 Tigres",
-            album,
-          },
-        },
-        {
-          url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/CM_aka_Creative_-_12_-_The_Cycle_Featuring_Mista_Mista.mp3",
-          duration: 221.44,
-          metaData: {
-            title: "The Cycle (Featuring Mista Mista)",
-            artist: "CM aka Creative",
-            album,
-          },
-        },
-      ],
-      hotkeys: true,
-      zIndex: 1001,
-    });
-
-    this._disposable.add(this._webamp.onClose(this.props.closeModal));
-
-    await this._webamp.renderWhenReady(this._ref);
-    if (this._disposable.disposed) {
-      this._webamp.dispose();
-    } else {
-      this._disposable.add(() => {
-        this._webamp.dispose();
+      const webamp = new Webamp({
+        initialSkin: { url: skinUrl },
+        initialTracks,
+        hotkeys: true,
+        zIndex: 1001,
       });
-      this.props.loaded();
-    }
-  }
 
-  render() {
-    return (
-      <div
-        style={{ width: "100%", height: "100%", position: "absolute" }}
-        ref={(node) => (this._ref = node)}
-      />
-    );
-  }
+      webampRef.current = webamp;
+      cleanup = () => webamp.dispose();
+
+      webamp.onClose(closeModal);
+      await webamp.renderWhenReady(ref.current);
+      if (!disposed) loaded();
+    }
+
+    loadWebamp();
+
+    return () => {
+      disposed = true;
+      cleanup();
+    };
+  }, [skinUrl, closeModal, loaded]);
+
+  return (
+    <div
+      style={{ width: "100%", height: "100%", position: "absolute" }}
+      ref={ref}
+    />
+  );
 }
 
+const album = "netBloc Vol. 24: tiuqottigeloot";
+
+const initialTracks = [
+  {
+    metaData: {
+      artist: "DJ Mike Llama",
+      title: "Llama Whippin' Intro",
+    },
+    url: "/llama.mp3",
+    duration: 5.322286,
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Diablo_Swing_Orchestra_-_01_-_Heroines.mp3",
+    duration: 322.612245,
+    metaData: {
+      title: "Heroines",
+      artist: "Diablo Swing Orchestra",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Eclectek_-_02_-_We_Are_Going_To_Eclecfunk_Your_Ass.mp3",
+    duration: 190.093061,
+    metaData: {
+      title: "We Are Going To Eclecfunk Your Ass",
+      artist: "Eclectek",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Auto-Pilot_-_03_-_Seventeen.mp3",
+    duration: 214.622041,
+    metaData: {
+      title: "Seventeen",
+      artist: "Auto-Pilot",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Muha_-_04_-_Microphone.mp3",
+    duration: 181.838367,
+    metaData: {
+      title: "Microphone",
+      artist: "Muha",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Just_Plain_Ant_-_05_-_Stumble.mp3",
+    duration: 86.047347,
+    metaData: {
+      title: "Stumble",
+      artist: "Just Plain Ant",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Sleaze_-_06_-_God_Damn.mp3",
+    duration: 226.795102,
+    metaData: {
+      title: "God Damn",
+      artist: "Sleaze",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Juanitos_-_07_-_Hola_Hola_Bossa_Nova.mp3",
+    duration: 207.072653,
+    metaData: {
+      title: "Hola Hola Bossa Nova",
+      artist: "Juanitos",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Entertainment_for_the_Braindead_-_08_-_Resolutions_Chris_Summer_Remix.mp3",
+    duration: 314.331429,
+    metaData: {
+      title: "Resolutions (Chris Summer Remix)",
+      artist: "Entertainment for the Braindead",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Nobara_Hayakawa_-_09_-_Trail.mp3",
+    duration: 204.042449,
+    metaData: {
+      title: "Trail",
+      artist: "Nobara Hayakawa",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/Paper_Navy_-_10_-_Tongue_Tied.mp3",
+    duration: 201.116735,
+    metaData: {
+      title: "Tongue Tied",
+      artist: "Paper Navy",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/60_Tigres_-_11_-_Garage.mp3",
+    duration: 245.394286,
+    metaData: {
+      title: "Garage",
+      artist: "60 Tigres",
+      album,
+    },
+  },
+  {
+    url: "https://raw.githubusercontent.com/captbaritone/webamp-music/4b556fbf/CM_aka_Creative_-_12_-_The_Cycle_Featuring_Mista_Mista.mp3",
+    duration: 221.44,
+    metaData: {
+      title: "The Cycle (Featuring Mista Mista)",
+      artist: "CM aka Creative",
+      album,
+    },
+  },
+];
+
 export default WebampComponent;
diff --git a/packages/skin-museum-client/src/hooks.js b/packages/skin-museum-client/src/hooks.js
index 070ce0e3..beccc48f 100644
--- a/packages/skin-museum-client/src/hooks.js
+++ b/packages/skin-museum-client/src/hooks.js
@@ -94,11 +94,11 @@ export function useWebampAnimation({ initialPosition }) {
     }
   }, [initialPosition, setCentered, transitionBeginEvents]);
 
-  return {
-    centered,
-    loaded,
-    handleWebampLoaded: () => webampLoadedEvents.next(null),
-  };
+  const handleWebampLoaded = useCallback(() => {
+    webampLoadedEvents.next(null);
+  }, [webampLoadedEvents]);
+
+  return { centered, loaded, handleWebampLoaded };
 }
 
 export function useQuery(query, variables) {