update preview components

package.json

@@ -17,6 +17,7 @@
     "@headlessui/react": "^1.7.14",
     "@supabase/supabase-js": "^2.21.0",
     "@tauri-apps/api": "^1.2.0",
+    "@vidstack/react": "^0.4.5",
     "dayjs": "^1.11.7",
     "destr": "^1.2.2",
     "iconoir-react": "^6.6.0",
@@ -27,12 +28,13 @@
     "react-dom": "^18.2.0",
     "react-hook-form": "^7.43.9",
     "react-loading-skeleton": "^3.2.1",
-    "react-player": "^2.12.0",
     "react-string-replace": "^1.1.0",
     "react-virtuoso": "^4.3.1",
+    "react-youtube": "^10.1.0",
     "swr": "^2.1.4",
     "tailwind-merge": "^1.12.0",
-    "tauri-plugin-sql-api": "github:tauri-apps/tauri-plugin-sql"
+    "tauri-plugin-sql-api": "github:tauri-apps/tauri-plugin-sql",
+    "vidstack": "^0.4.5"
   },
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.9",
@@ -41,6 +43,7 @@
     "@types/node": "^18.16.0",
     "@types/react": "^18.0.38",
     "@types/react-dom": "^18.0.11",
+    "@types/youtube-player": "^5.5.7",
     "@typescript-eslint/eslint-plugin": "^5.59.0",
     "@typescript-eslint/parser": "^5.59.0",
     "@vitejs/plugin-react-swc": "^3.3.0",