import { IArtist } from 'metarare';
import * as React from 'react';
import PCArtistScrollList from "@src/components/pc/ArtistScrollList";
import MobileArtistScrollList from "@src/components/mobile/ArtistScrollList";

export interface IArtistsScrollListProps {}

export default function ArtistsScrollList(props: IArtistsScrollListProps) {
  return (
    <>
      <div className={"mo_wrapper"}>
        <MobileArtistScrollList list={dataFake} />
      </div>
      <div className={"pc_wrapper"}>
        <PCArtistScrollList list={dataFake} />
      </div>
    </>
  );
}


const dataFake: IArtist[] = [
    {
        id: 1,
        name: 'John Doe',
        thumbnail_image: 'https://picsum.photos/id/20/300/300',
    },
    {
        id: 2,
        name: 'Kasper Henderson',
        thumbnail_image: 'https://picsum.photos/id/21/300/300',
    },
    {
        id: 3,
        name: 'Cooper Lynn',
        thumbnail_image: 'https://picsum.photos/id/22/300/300',
    },
    {
        id: 4,
        name: 'Iris Stein',
        thumbnail_image: 'https://picsum.photos/id/23/300/300',
    },
    {
        id: 5,
        name: 'Leland Richards',
        thumbnail_image: 'https://picsum.photos/id/24/300/300',
    },
    {
        id: 6,
        name: 'Octavia Norris',
        thumbnail_image: 'https://picsum.photos/id/25/300/300',
    },
    {
        id: 7,
        name: 'Leland Richards',
        thumbnail_image: 'https://picsum.photos/id/26/300/300',
    },
    {
        id: 8,
        name: 'Octavia Norris',
        thumbnail_image: 'https://picsum.photos/id/27/300/300',
    },
    {
        id: 9,
        name: 'Leland Richards',
        thumbnail_image: 'https://picsum.photos/id/28/300/300',
    },
    {
        id: 10,
        name: 'Octavia Norris',
        thumbnail_image: 'https://picsum.photos/id/29/300/300',
    }
]