From fb305e55094bfed37567ce5bdd8baff7b62d9ae1 Mon Sep 17 00:00:00 2001
From: Lucas Jensen <lucas@lucasjensen.me>
Date: Wed, 15 Jan 2025 17:50:44 -0800
Subject: [PATCH] minor cleanup and tested with actual livestream

---
 client/src/Forms/Bio/BioForm.tsx              | 23 +++++++++++--------
 .../src/LivestreamPlayer/LivestreamPlayer.tsx |  2 +-
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/client/src/Forms/Bio/BioForm.tsx b/client/src/Forms/Bio/BioForm.tsx
index 0e4dba5..e84d579 100644
--- a/client/src/Forms/Bio/BioForm.tsx
+++ b/client/src/Forms/Bio/BioForm.tsx
@@ -16,7 +16,9 @@ interface EditBioFormProps {
 
 function EditBioForm(props: EditBioFormProps) {
   const [formBio, setFormBio] = useState<string>(props.entity.bio);
-  const [formLivestreamId, setFormLivestreamId] = useState<string | undefined>(props.livestream_id)
+  const [formLivestreamId, setFormLivestreamId] = useState<string | undefined>(
+    props.livestream_id,
+  );
   const [canSubmit, setCanSubmit] = useState<boolean>(false);
   const [error, setError] = useState<string>("");
 
@@ -25,10 +27,12 @@ function EditBioForm(props: EditBioFormProps) {
     setCanSubmit(true);
   };
 
-  const handleLivestreamChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
+  const handleLivestreamChange = (
+    event: React.ChangeEvent<HTMLTextAreaElement>,
+  ) => {
     setFormLivestreamId(event.target.value);
     setCanSubmit(true);
-  }
+  };
 
   const handleSubmit = async (event: React.FormEvent) => {
     event.preventDefault();
@@ -97,10 +101,12 @@ function EditBioForm(props: EditBioFormProps) {
       {props.livestream_id != undefined && (
         <Form.Group controlId="formLivestreamId">
           <p className="text-muted">
-            A livestream id is the part of a youtube url following "v=".
-            For example, "ncyl7cTU9k8" but without the quotations.
-            Don't mess it up. <br></br>
-            To remove an embedded livestream, just clear this field and submit the form.
+            A livestream id is part of a youtube url. Either
+            ".../v=[livestream_id]" or ".../live/[livestream_id]". For example,
+            "ncyl7cTU9k8" but without the quotations. Don't mess it up.{" "}
+            <br></br>
+            To remove an embedded livestream, just clear this field and submit
+            the form.
           </p>
           <Form.Label>Livestream ID:</Form.Label>
           <Form.Control
@@ -108,9 +114,8 @@ function EditBioForm(props: EditBioFormProps) {
             value={formLivestreamId}
             rows={1}
             onChange={handleLivestreamChange}
-            placeholder="ncyl7cTU9k8"
+            placeholder=""
           />
-
         </Form.Group>
       )}
       <Form.Group controlId="formBio">
diff --git a/client/src/LivestreamPlayer/LivestreamPlayer.tsx b/client/src/LivestreamPlayer/LivestreamPlayer.tsx
index 35c3d6a..c8e22c3 100644
--- a/client/src/LivestreamPlayer/LivestreamPlayer.tsx
+++ b/client/src/LivestreamPlayer/LivestreamPlayer.tsx
@@ -5,7 +5,7 @@ interface LivestreamPlayerProps {
 }
 
 const LivestreamPlayer = (props: LivestreamPlayerProps) => {
-  const iframeSrc = `https://www.youtube.com/embed/${props.livestreamId}`;
+  const iframeSrc = `https://www.youtube.com/embed/${props.livestreamId}?autoplay=1`;
 
   return (
     <Container className="d-flex justify-content-center my-3">