import { CheckIcon, PencilIcon, RefreshIcon, TrashIcon, XIcon, } from '@heroicons/react/solid'; import axios from 'axios'; import Link from 'next/link'; import React, { useEffect, useState } from 'react'; import { useInView } from 'react-intersection-observer'; import { defineMessages, useIntl } from 'react-intl'; import { useToasts } from 'react-toast-notifications'; import useSWR, { mutate } from 'swr'; import { MediaRequestStatus, MediaStatus, } from '../../../server/constants/media'; import type { MediaRequest } from '../../../server/entity/MediaRequest'; import type { MovieDetails } from '../../../server/models/Movie'; import type { TvDetails } from '../../../server/models/Tv'; import { Permission, useUser } from '../../hooks/useUser'; import globalMessages from '../../i18n/globalMessages'; import { withProperties } from '../../utils/typeHelpers'; import Badge from '../Common/Badge'; import Button from '../Common/Button'; import CachedImage from '../Common/CachedImage'; import RequestModal from '../RequestModal'; import StatusBadge from '../StatusBadge'; const messages = defineMessages({ seasons: '{seasonCount, plural, one {Season} other {Seasons}}', failedretry: 'Something went wrong while retrying the request.', mediaerror: 'The associated title for this request is no longer available.', deleterequest: 'Delete Request', }); const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => { return (movie as MovieDetails).title !== undefined; }; const RequestCardPlaceholder: React.FC = () => { return (