mirror of
https://github.com/sct/overseerr.git
synced 2025-09-17 17:24:35 +02:00
feat(frontend): modal component and basic request hookup (#91)
This commit is contained in:
@@ -1,8 +1,7 @@
|
||||
import React, { useRef } from 'react';
|
||||
import useSWR, { useSWRInfinite } from 'swr';
|
||||
import React from 'react';
|
||||
import useSWR from 'swr';
|
||||
import type { MovieResult, TvResult } from '../../../server/models/Search';
|
||||
import TitleCard from '../TitleCard';
|
||||
import useVerticalScroll from '../../hooks/useVerticalScroll';
|
||||
|
||||
interface MovieDiscoverResult {
|
||||
page: number;
|
||||
@@ -18,17 +17,6 @@ interface TvDiscoverResult {
|
||||
results: TvResult[];
|
||||
}
|
||||
|
||||
const getKey = (
|
||||
pageIndex: number,
|
||||
previousPageData: MovieDiscoverResult | null
|
||||
) => {
|
||||
if (previousPageData && pageIndex + 1 > previousPageData.totalPages) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return `/api/v1/discover/movies?page=${pageIndex + 1}`;
|
||||
};
|
||||
|
||||
const Discover: React.FC = () => {
|
||||
const { data: movieData, error: movieError } = useSWR<MovieDiscoverResult>(
|
||||
'/api/v1/discover/movies'
|
||||
@@ -47,12 +35,16 @@ const Discover: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="overflow-x-scroll whitespace-no-wrap hide-scrollbar scrolling-touch overscroll-x-contain -ml-2 -mr-4"
|
||||
className="overflow-x-scroll whitespace-no-wrap hide-scrollbar scrolling-touch overscroll-x-contain -ml-4 -mr-4"
|
||||
style={{ height: 295 }}
|
||||
>
|
||||
{movieData?.results.map((title) => (
|
||||
<div key={title.id} className="px-2 inline-block">
|
||||
<div
|
||||
key={title.id}
|
||||
className="first:px-4 last:px-4 px-2 inline-block"
|
||||
>
|
||||
<TitleCard
|
||||
id={title.id}
|
||||
image={title.posterPath}
|
||||
status={title.request?.status}
|
||||
summary={title.overview}
|
||||
@@ -66,7 +58,10 @@ const Discover: React.FC = () => {
|
||||
{!movieData &&
|
||||
!movieError &&
|
||||
[...Array(10)].map((_item, i) => (
|
||||
<div key={`placeholder-${i}`} className="px-2 inline-block">
|
||||
<div
|
||||
key={`placeholder-${i}`}
|
||||
className="first:px-4 last:px-4 px-2 inline-block"
|
||||
>
|
||||
<TitleCard.Placeholder />
|
||||
</div>
|
||||
))}
|
||||
@@ -79,12 +74,16 @@ const Discover: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="overflow-x-scroll whitespace-no-wrap hide-scrollbar scrolling-touch overscroll-x-contain -ml-2 -mr-4"
|
||||
className="overflow-x-scroll whitespace-no-wrap hide-scrollbar scrolling-touch overscroll-x-contain -ml-4 -mr-4"
|
||||
style={{ height: 295 }}
|
||||
>
|
||||
{tvData?.results.map((title) => (
|
||||
<div key={title.id} className="px-2 inline-block">
|
||||
<div
|
||||
key={title.id}
|
||||
className="first:px-4 last:px-4 px-2 inline-block"
|
||||
>
|
||||
<TitleCard
|
||||
id={title.id}
|
||||
image={title.posterPath}
|
||||
status={title.request?.status}
|
||||
summary={title.overview}
|
||||
@@ -98,7 +97,10 @@ const Discover: React.FC = () => {
|
||||
{!tvData &&
|
||||
!tvError &&
|
||||
[...Array(10)].map((_item, i) => (
|
||||
<div key={`placeholder-${i}`} className="px-2 inline-block">
|
||||
<div
|
||||
key={`placeholder-${i}`}
|
||||
className="first:px-4 last:px-4 px-2 inline-block"
|
||||
>
|
||||
<TitleCard.Placeholder />
|
||||
</div>
|
||||
))}
|
||||
|
Reference in New Issue
Block a user