4 files changed, 44 insertions, 12 deletions

diff --git a/pages/api/youtube/playlist.js b/pages/api/youtube/playlist.js
new file mode 100644
index 0000000..e75e00d
--- /dev/null
+++ b/pages/api/youtube/playlist.js
@@ -0,0 +1,26 @@
+import withSession from 'hocs/withSession'
+import ytpl from 'ytpl'
+
+export default withSession(async (req, res) => {
+  switch (req.method) {
+    case 'POST':
+      try {
+        const user = req.session.get('user')
+        const { id } = req.body
+
+        if (!user || !user?.isVerified || !id) {
+          throw new Error('Something went wrong')
+        }
+
+        const info = await ytpl(id, { gl: user.language || 'en' })
+
+        res.status(200).json(info)
+      } catch (error) {
+        res.status(400).json([])
+      }
+      break
+    default:
+      res.status(400).send()
+      break
+  }
+})
diff --git a/pages/api/youtube/search.js b/pages/api/youtube/search.js
index b17d008..f1b461f 100644
--- a/pages/api/youtube/search.js
+++ b/pages/api/youtube/search.js
@@ -12,9 +12,14 @@ export default withSession(async (req, res) => {
           throw new Error('Something went wrong')
         }
 
-        const video = await youtube.search(quote)
+        const results = await youtube.search(quote[0], {
+          ...quote[1],
+          requestOptions: {
+            headers: { 'Accept-Language': user.language || 'en' }
+          }
+        })
 
-        res.status(200).json(video)
+        res.status(200).json(results)
       } catch (error) {
         res.status(400).json([])
       }
diff --git a/pages/api/youtube/player.js b/pages/api/youtube/video.js
index a6d3a7e..aeb2e8b 100644
--- a/pages/api/youtube/player.js
+++ b/pages/api/youtube/video.js
@@ -1,24 +1,18 @@
 import withSession from 'hocs/withSession'
 import ytdl from 'ytdl-core'
 
-const getId = url => {
-  const regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/
-  const match = url.match(regExp)
-  return (match && match[7].length === 11) ? match[7] : false
-}
-
 export default withSession(async (req, res) => {
   switch (req.method) {
     case 'POST':
       try {
         const user = req.session.get('user')
-        const { url } = req.body
+        const { id } = req.body
 
-        if (!user || !user?.isVerified || !url) {
+        if (!user || !user?.isVerified || !id) {
           throw new Error('Something went wrong')
         }
 
-        const info = await ytdl.getInfo(getId(url))
+        const info = await ytdl.getInfo(id, { lang: user.language || 'en' })
 
         res.status(200).json(info)
       } catch (error) {
diff --git a/pages/index.js b/pages/index.js
index af25f7b..a13a840 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,4 +1,5 @@
 import styles from 'styles/Main.module.scss'
+import { useMemo } from 'react'
 import Image from 'next/image'
 import useUser from 'hooks/useUser'
 import useSettings from 'hooks/useSettings'
@@ -70,7 +71,7 @@ const Home = () => {
               app={app}
               setApps={setApps}
             >
-              <AppComponent {...app.props} />
+              <AppContainer AppComponent={AppComponent} appProps={app.props} />
             </App>
           )
         })}
@@ -79,4 +80,10 @@ const Home = () => {
   )
 }
 
+const AppContainer = ({ AppComponent, appProps }) => {
+  const Component = useMemo(() => <AppComponent {...appProps} />, [appProps])
+
+  return Component
+}
+
 export default Home