diff --git a/apps/frontend/src/components/media/media.component.tsx b/apps/frontend/src/components/media/media.component.tsx
index 22769abc..9a289958 100644
--- a/apps/frontend/src/components/media/media.component.tsx
+++ b/apps/frontend/src/components/media/media.component.tsx
@@ -299,7 +299,7 @@ export const MediaBox: FC<{
         children: (
           <div className="w-full h-full p-[50px]">
             {media.path.indexOf('mp4') > -1 ? (
-              <VideoFrame url={mediaDirectory.set(media.path)} />
+              <VideoFrame autoplay={true} url={mediaDirectory.set(media.path)} />
             ) : (
               <img
                 width="100%"
diff --git a/libraries/react-shared-libraries/src/helpers/video.frame.tsx b/libraries/react-shared-libraries/src/helpers/video.frame.tsx
index ec2fbd85..06376938 100644
--- a/libraries/react-shared-libraries/src/helpers/video.frame.tsx
+++ b/libraries/react-shared-libraries/src/helpers/video.frame.tsx
@@ -3,6 +3,7 @@
 import { FC } from 'react';
 export const VideoFrame: FC<{
   url: string;
+  autoplay?: boolean;
 }> = (props) => {
   const { url } = props;
   return (
@@ -10,7 +11,7 @@ export const VideoFrame: FC<{
       className="w-full h-full object-cover rounded-[4px]"
       src={url + '#t=0.1'}
       preload="metadata"
-      autoPlay={false}
-    ></video>
+      autoPlay={!!props?.autoplay}
+    />
   );
 };