1 files changed, 36 insertions, 0 deletions
diff --git a/frontend/app/components/GolfWatchAppWithAudioPlayRequest.client.tsx b/frontend/app/components/GolfWatchAppWithAudioPlayRequest.client.tsx
new file mode 100644
index 0000000..e299f4b
--- /dev/null
+++ b/frontend/app/components/GolfWatchAppWithAudioPlayRequest.client.tsx
@@ -0,0 +1,36 @@
+import { useState } from "react";
+import { AudioController } from "../.client/audio/AudioController";
+import GolfWatchApp, { type Props } from "./GolfWatchApp.client";
+
+export default function GolfWatchAppWithAudioPlayRequest({
+	game,
+	sockToken,
+}: Omit<Props, "audioController">) {
+	const [audioController, setAudioController] =
+		useState<AudioController | null>(null);
+	const audioPlayPermitted = audioController !== null;
+
+	if (audioPlayPermitted) {
+		return (
+			<GolfWatchApp
+				game={game}
+				sockToken={sockToken}
+				audioController={audioController}
+			/>
+		);
+	} else {
+		return (
+			<div>
+				<button
+					onClick={async () => {
+						const audioController = new AudioController();
+						await audioController.loadAll();
+						setAudioController(audioController);
+					}}
+				>
+					Enable Audio Play
+				</button>
+			</div>
+		);
+	}
+}