From fb0da8818a90e49c951dec0b1328e6e7e42428d2 Mon Sep 17 00:00:00 2001
From: akash <akash@metatroncube.com>
Date: Tue, 7 Oct 2025 11:04:46 +0530
Subject: [PATCH] Portfolio youtube links updated

---
 src/components/isotope/CaseStudies.js |  58 ++++++++---
 utils/constant.utils.js               | 135 +++++++++++++++-----------
 2 files changed, 124 insertions(+), 69 deletions(-)

diff --git a/src/components/isotope/CaseStudies.js b/src/components/isotope/CaseStudies.js
index 27ac6d2..5d6f08f 100644
--- a/src/components/isotope/CaseStudies.js
+++ b/src/components/isotope/CaseStudies.js
@@ -52,8 +52,8 @@ const CaseStudies = () => {
             <Image
               src="/assets/images/about/3.webp"
               alt="shape2"
-              width={100}
-              height={100}
+              width={133}
+              height={283}
               priority
             />
           </div>
@@ -88,17 +88,45 @@ const CaseStudies = () => {
           >
             <div className="case-study-single-box">
               <div className="case-study-thumb2">
+                {/* ✅ Video Handling Updated */}
                 {item.video ? (
-                  <video
-                    src={item.video}
-                    controls
-                    style={{
-                      width: "100%",
-                      height: "auto",
-                      objectFit: "cover",
-                      borderRadius: "8px",
-                    }}
-                  />
+                  // If YouTube link present → show embedded video
+                  item.video.includes("youtube.com") || item.video.includes("youtu.be") ? (
+                    <iframe
+                      width="100%"
+                      height="315"
+                      src={
+                        item.video
+                          .replace("watch?v=", "embed/")
+                          .replace("youtu.be/", "youtube.com/embed/")
+                          .replace("youtube.com/shorts/", "youtube.com/embed/")
+                      }
+                      title={item.title}
+                      frameBorder="0"
+                      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                      allowFullScreen
+                      style={{
+                        width: "100%",
+                        height: "auto",
+                        aspectRatio: "16/9",
+                        borderRadius: "8px",
+                        objectFit: "cover",
+                      }}
+                    ></iframe>
+
+                  ) : (
+                    // Otherwise show normal local video
+                    <video
+                      src={item.video}
+                      controls
+                      style={{
+                        width: "100%",
+                        height: "auto",
+                        objectFit: "cover",
+                        borderRadius: "8px",
+                      }}
+                    />
+                  )
                 ) : (
                   <Image
                     src={item.image}
@@ -110,6 +138,7 @@ const CaseStudies = () => {
                     style={{ width: "100%", height: "auto", objectFit: "contain" }}
                   />
                 )}
+
                 {/* Lightbox Icon */}
                 {item.category !== "video" && item.imagePopup && (
                   <div className="single_portfolio_icon">
@@ -122,6 +151,7 @@ const CaseStudies = () => {
                     </a>
                   </div>
                 )}
+
                 {/* Title & Description */}
                 <div className="case-study-content">
                   <div className={item.contentInnerClass || "case-study-content-inner"}>
@@ -147,7 +177,7 @@ const CaseStudies = () => {
                 {/* Optional Video */}
                 {item.videoLink && !["meta", "graphic"].includes(item.category) && (
                   <div className="video-icon style-two">
-                    <a className="video-vemo-icon" href={item.videoLink}>
+                    <a className="video-vemo-icon" href={item.videoLink} target="_blank">
                       <i className="fa fa-play" />
                     </a>
                   </div>
@@ -161,4 +191,4 @@ const CaseStudies = () => {
   );
 };
 
-export default CaseStudies;
+export default CaseStudies;
\ No newline at end of file
diff --git a/utils/constant.utils.js b/utils/constant.utils.js
index 321f291..5251141 100644
--- a/utils/constant.utils.js
+++ b/utils/constant.utils.js
@@ -814,35 +814,36 @@ export const PortfolioData = [
   {
     id: 45,
     category: "video",
-    video: "/assets/video/logo Portfolio Presentation.mp4",
     colClass: "col-lg-4 col-md-6",
     alt: "metatronCube solutions",
     title: "Video Editing",
     name: "Logo Presentation",
-    link: "#",
-    videoLink: "/assets/video/logo Portfolio Presentation.mp4",
-  },
+    link: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
+    video: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
+    videoLink: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
+  }
+  ,
   {
     id: 46,
     category: "video",
-    video: "/assets/video/Main Scene.mp4",
+    video: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
     colClass: "col-lg-4 col-md-6",
     alt: "metatronCube solutions",
     title: "Video Editing",
     name: "MetatronCube Solutions",
-    link: "#",
-    videoLink: "/assets/video/Main Scene.mp4",
+    link: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
+    videoLink: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
   },
   {
     id: 47,
     category: "video",
-    video: "/assets/video/metatroncube.mp4",
+    video: "https://www.youtube.com/watch?v=4WhJFTbaCko",
     colClass: "col-lg-4 col-md-6",
     alt: "Dine360",
     title: "Video Editing",
     name: "Dine360",
-    link: "#",
-    videoLink: "/assets/video/metatroncube.mp4",
+    link: "https://www.youtube.com/watch?v=4WhJFTbaCko",
+    videoLink: "https://www.youtube.com/watch?v=4WhJFTbaCko",
   },
   {
     id: 48,
@@ -869,46 +870,101 @@ export const PortfolioData = [
   {
     id: 50,
     category: "video",
-    video: "/assets/video/5.mp4",
+    video: "https://www.youtube.com/watch?v=69dcbrCQRt4",
     colClass: "col-lg-4 col-md-6",
     alt: "metatronCube solutions",
     title: "Video Editing",
     name: "Behind The Scenes",
-    link: "#",
-    videoLink: "/assets/video/5.mp4",
+    link: "https://www.youtube.com/watch?v=69dcbrCQRt4",
+    videoLink: "https://www.youtube.com/watch?v=69dcbrCQRt4",
   },
   {
     id: 51,
     category: "video",
-    video: "/assets/video/metatron canada video 2.mp4",
+    video: "https://www.youtube.com/shorts/PqK6UwPaU2I",
     colClass: "col-lg-4 col-md-6",
     alt: "metatronCube solutions",
     title: "Video Editing",
     name: "MetatronCube Solutions",
-    link: "#",
-    videoLink: "/assets/video/metatron canada video 2.mp4",
+    link: "https://www.youtube.com/shorts/PqK6UwPaU2I",
+    videoLink: "https://www.youtube.com/shorts/PqK6UwPaU2I",
   },
   {
     id: 52,
     category: "video",
-    video: "/assets/video/metatron video one.mp4",
+    video: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
     colClass: "col-lg-4 col-md-6",
     alt: "metatronCube solutions",
     title: "Video Editing",
     name: "MetatronCube Solutions",
-    link: "#",
-    videoLink: "/assets/video/metatron video one.mp4",
+    link: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
+    videoLink: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
   },
   {
     id: 53,
     category: "video",
-    video: "/assets/video/clothing reel.mp4",
+    video: "https://www.youtube.com/shorts/YgCb5BIm93w",
     colClass: "col-lg-4 col-md-6",
     alt: "clothing",
     title: "Video Editing",
     name: "Falcon Fashions",
-    link: "#",
-    videoLink: "/assets/video/clothing reel.mp4",
+    link: "https://www.youtube.com/shorts/YgCb5BIm93w",
+    videoLink: "https://www.youtube.com/shorts/YgCb5BIm93w",
+  },
+    {
+    id: 60,
+    category: "video",
+    video: "https://www.youtube.com/shorts/Wd89RALJjJw",
+    colClass: "col-lg-4 col-md-6",
+    alt: "clothing",
+    title: "Video Editing",
+    name: "Chennora",
+    link: "https://www.youtube.com/shorts/Wd89RALJjJw",
+    videoLink: "https://www.youtube.com/shorts/Wd89RALJjJw",
+  },
+  {
+    id: 61,
+    category: "video",
+    video: "https://www.youtube.com/shorts/QUm9hHtF6z4",
+    colClass: "col-lg-4 col-md-6",
+    alt: "MetatronCube Solutions",
+    title: "Video Editing",
+    name: "MetatronCube Software Solutions",
+    link: "https://www.youtube.com/shorts/QUm9hHtF6z4",
+    videoLink: "https://www.youtube.com/shorts/QUm9hHtF6z4",
+  },
+      {
+    id: 70,
+    category: "video",
+    video: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
+    colClass: "col-lg-4 col-md-6",
+    alt: "Shiva Shakthi Restaurant",
+    title: "Video Editing",
+    name: "Shiva Shakthi Restaurant",
+    link: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
+    videoLink: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
+  },
+    {
+    id: 71,
+    category: "video",
+    video: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
+    colClass: "col-lg-4 col-md-6",
+    alt: "Race Werks",
+    title: "Video Editing",
+    name: "Race Werks",
+    link: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
+    videoLink: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
+  },
+    {
+    id: 65,
+    category: "video",
+    video: "https://www.youtube.com/shorts/rksfIUjSe-Y",
+    colClass: "col-lg-4 col-md-6",
+    alt: "MetatronCube Software Solutions",
+    title: "Video Editing",
+    name: "MetatronCube Software Solutions",
+    link: "https://www.youtube.com/shorts/rksfIUjSe-Y",
+    videoLink: "https://www.youtube.com/shorts/rksfIUjSe-Y",
   },
   {
     id: 54,
@@ -976,28 +1032,7 @@ export const PortfolioData = [
     link: "#",
     videoLink: "/assets/video/4.mp4",
   },
-  {
-    id: 60,
-    category: "video",
-    video: "/assets/video/6.mp4",
-    colClass: "col-lg-4 col-md-6",
-    alt: "clothing",
-    title: "Video Editing",
-    name: "Chennora",
-    link: "#",
-    videoLink: "/assets/video/6.mp4",
-  },
-  {
-    id: 61,
-    category: "video",
-    video: "/assets/video/7.mp4",
-    colClass: "col-lg-4 col-md-6",
-    alt: "MetatronCube Solutions",
-    title: "Video Editing",
-    name: "MetatronCube Software Solutions",
-    link: "#",
-    videoLink: "/assets/video/7.mp4",
-  },
+
   {
     id: 62,
     category: "video",
@@ -1031,17 +1066,7 @@ export const PortfolioData = [
     link: "#",
     videoLink: "/assets/video/12.mp4",
   },
-  {
-    id: 65,
-    category: "video",
-    video: "/assets/video/13.mp4",
-    colClass: "col-lg-4 col-md-6",
-    alt: "MetatronCube Software Solutions",
-    title: "Video Editing",
-    name: "MetatronCube Software Solutions",
-    link: "#",
-    videoLink: "/assets/video/13.mp4",
-  },
+
   {
     id: 66,
     category: "video",