feat: updates

packages/web/pages/Artist/ArtistMVs.tsx

@@ -0,0 +1,34 @@
+import { useNavigate, useParams } from 'react-router-dom'
+import useArtistMV from '@/web/api/hooks/useArtistMV'
+import { useTranslation } from 'react-i18next'
+
+const ArtistMVs = () => {
+  const { t } = useTranslation()
+  const params = useParams()
+  const navigate = useNavigate()
+  const { data: videos } = useArtistMV({ id: Number(params.id) || 0 })
+
+  return (
+    <div>
+      <div className='mb-6 mt-10 text-12 font-medium uppercase text-neutral-300'>
+        {t`common.video_other`}
+      </div>
+
+      <div className='grid grid-cols-3 gap-6'>
+        {videos?.mvs?.slice(0, 6)?.map(video => (
+          <div key={video.id} onClick={() => navigate(`/mv/${video.id}`)}>
+            <img
+              src={video.imgurl16v9}
+              className='aspect-video w-full rounded-24 object-contain'
+            />
+            <div className='mt-2 text-12 font-medium text-neutral-600'>
+              {video.name}
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  )
+}
+
+export default ArtistMVs