fix(#in221): videoplayer autoquality enabled

fix(#in221): mobile auto 720 quality added

src/features/StreamPlayer/hooks/useVideoQuality.tsx

@@ -15,6 +15,7 @@ import isString from 'lodash/isString'
 import filter from 'lodash/fp/filter'
 
 import { useLocalStore } from 'hooks'
+import { isMobileDevice } from 'config/userAgent'
 
 const autoQuality = {
   label: 'Auto',
@@ -43,7 +44,7 @@ const getVideoQualities = (levels: Array<Level>) => {
     Number,
     'desc',
   )
-  return uniqBy([...sorted], 'label')
+  return uniqBy([...sorted, autoQuality], 'label')
 }
 
 export const useVideoQuality = (hls: Hls | null) => {
@@ -73,11 +74,18 @@ export const useVideoQuality = (hls: Hls | null) => {
 
     const listener = () => {
       const qualities = getVideoQualities(hls.levels)
-      const quality = find(qualities, { label: selectedQuality }) || qualities[0]
+      const quality = find(qualities, { label: selectedQuality }) || autoQuality
       // eslint-disable-next-line no-param-reassign
       hls.currentLevel = quality.level
       setSelectedQuality(quality.label)
       setVideoQualities(qualities)
+
+      if (isMobileDevice && quality.label === 'Auto') {
+        const mob720 = qualities.find((item) => item.label === '720')
+
+        // eslint-disable-next-line no-param-reassign
+        hls.autoLevelCapping = Number(mob720?.level)
+      }
     }
     hls.on(Hls.Events.MANIFEST_PARSED, listener)
     return () => {