diff --git a/components/video.tsx b/components/video.tsx index 6203e09..5d2c4a3 100644 --- a/components/video.tsx +++ b/components/video.tsx @@ -1,4 +1,5 @@ import { useLanguage } from "@/contexts/language-context" +import { toEmbedUrl } from "@/lib/embedUrl"; import { Play } from "lucide-react" export default function Video() { @@ -11,15 +12,21 @@ export default function Video() {

{t.action.subtitle}

-
-
-
-
- -
-
+ {/* YouTube video bo‘limi */} +
+
+
-
+
) diff --git a/lib/embedUrl.ts b/lib/embedUrl.ts new file mode 100644 index 0000000..9d63f31 --- /dev/null +++ b/lib/embedUrl.ts @@ -0,0 +1,22 @@ + +export function toEmbedUrl(url: string): string { + let videoId = ''; + + // watch?v=... + if (url.includes('watch?v=')) { + const params = new URL(url).searchParams; + videoId = params.get('v') || ''; + } + // youtu.be/... + else if (url.includes('youtu.be/')) { + const pathname = new URL(url).pathname; // /videoId + videoId = pathname.split('/')[1] || ''; + } + // shorts/... + else if (url.includes('youtube.com/shorts/')) { + const pathname = new URL(url).pathname; // /shorts/videoId + videoId = pathname.split('/')[2] || ''; + } + + return videoId ? `https://www.youtube.com/embed/${videoId}` : ''; +} \ No newline at end of file