31 lines
720 B
TypeScript
31 lines
720 B
TypeScript
import MediaQuery from 'react-responsive'
|
|
|
|
import { Book } from '../scripts/searcher';
|
|
|
|
import React from 'react';
|
|
|
|
import MobileDataList from './MobileDataList';
|
|
import DesktopDataList from './DesktopDataList';
|
|
|
|
import { MEDIA_QUERY_DESKTOP_STARTS, MEDIA_QUERY_MOBILE_ENDS } from '../constants/mediaquery';
|
|
|
|
export interface BooksViewProps {
|
|
books: Book[];
|
|
}
|
|
|
|
const BooksView: React.FC<BooksViewProps> = ({ books }) => {
|
|
|
|
return (
|
|
<>
|
|
<MediaQuery minWidth={MEDIA_QUERY_DESKTOP_STARTS}>
|
|
<DesktopDataList books={books} />
|
|
</MediaQuery>
|
|
<MediaQuery maxWidth={MEDIA_QUERY_MOBILE_ENDS}>
|
|
<MobileDataList books={books} />
|
|
</MediaQuery>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default BooksView;
|