From acfba694f97519b4dcae20252482e28896855c83 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Mon, 9 Sep 2024 21:27:03 +0300
Subject: [PATCH] Add video tutorial

---
 apps/showcase/doc/vite/VideoDoc.vue            |  8 ++++++++
 apps/showcase/doc/vite/videos/CreateVueDoc.vue | 11 -----------
 apps/showcase/pages/vite/index.vue             |  6 ++++++
 3 files changed, 14 insertions(+), 11 deletions(-)
 create mode 100644 apps/showcase/doc/vite/VideoDoc.vue
 delete mode 100644 apps/showcase/doc/vite/videos/CreateVueDoc.vue

diff --git a/apps/showcase/doc/vite/VideoDoc.vue b/apps/showcase/doc/vite/VideoDoc.vue
new file mode 100644
index 000000000..056d2d0d0
--- /dev/null
+++ b/apps/showcase/doc/vite/VideoDoc.vue
@@ -0,0 +1,8 @@
+<template>
+    <DocSectionText v-bind="$attrs">
+        <p>Watch the short video tutorial from Çağatay Çivici to setup PrimeVue in styled mode with <a alt="Create Vue App" href="https://github.com/vuejs/create-vue">Create-Vue</a>.</p>
+    </DocSectionText>
+    <div class="video-container">
+        <iframe width="560" height="315" src="https://www.youtube.com/embed/xW8EFqalm4I" frameborder="0" allowfullscreen></iframe>
+    </div>
+</template>
diff --git a/apps/showcase/doc/vite/videos/CreateVueDoc.vue b/apps/showcase/doc/vite/videos/CreateVueDoc.vue
deleted file mode 100644
index cd2836e41..000000000
--- a/apps/showcase/doc/vite/videos/CreateVueDoc.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<template>
-    <DocSectionText v-bind="$attrs">
-        <p>
-            <a alt="Create Vue App" href="https://github.com/vuejs/create-vue">Create-Vue</a>
-            is the recommended way to start a Vite-powered Vue project.
-        </p>
-    </DocSectionText>
-    <div class="video-container">
-        <iframe width="560" height="315" src="https://www.youtube.com/embed/FjYesOz95MM" frameborder="0" allowfullscreen></iframe>
-    </div>
-</template>
diff --git a/apps/showcase/pages/vite/index.vue b/apps/showcase/pages/vite/index.vue
index 55801b50a..a78e018d4 100644
--- a/apps/showcase/pages/vite/index.vue
+++ b/apps/showcase/pages/vite/index.vue
@@ -21,6 +21,7 @@ import ExamplesDoc from '@/doc/vite/ExamplesDoc.vue';
 import StyledModeDoc from '@/doc/vite/StyledModeDoc.vue';
 import UnstyledModeDoc from '@/doc/vite/UnstyledModeDoc.vue';
 import UsageDoc from '@/doc/vite/UsageDoc.vue';
+import VideoDoc from '@/doc/vite/VideoDoc.vue';
 
 export default {
     data() {
@@ -58,6 +59,11 @@ export default {
                     id: 'examples',
                     label: 'Examples',
                     component: ExamplesDoc
+                },
+                {
+                    id: 'video',
+                    label: 'Video',
+                    component: VideoDoc
                 }
             ]
         };