mirror of
https://github.com/sct/overseerr.git
synced 2025-09-17 17:24:35 +02:00
fix: added deep links to issues and status badges (#3065)
This commit is contained in:
@@ -7,6 +7,7 @@ import PageTitle from '@app/components/Common/PageTitle';
|
||||
import IssueComment from '@app/components/IssueDetails/IssueComment';
|
||||
import IssueDescription from '@app/components/IssueDetails/IssueDescription';
|
||||
import { issueOptions } from '@app/components/IssueModal/constants';
|
||||
import useDeepLinks from '@app/hooks/useDeepLinks';
|
||||
import { Permission, useUser } from '@app/hooks/useUser';
|
||||
import globalMessages from '@app/i18n/globalMessages';
|
||||
import Error from '@app/pages/_error';
|
||||
@@ -88,6 +89,13 @@ const IssueDetails = () => {
|
||||
: null
|
||||
);
|
||||
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: data?.mediaInfo?.plexUrl,
|
||||
plexUrl4k: data?.mediaInfo?.plexUrl4k,
|
||||
iOSPlexUrl: data?.mediaInfo?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: data?.mediaInfo?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
const CommentSchema = Yup.object().shape({
|
||||
message: Yup.string().required(),
|
||||
});
|
||||
@@ -354,7 +362,7 @@ const IssueDetails = () => {
|
||||
{issueData?.media.plexUrl && (
|
||||
<Button
|
||||
as="a"
|
||||
href={issueData?.media.plexUrl}
|
||||
href={plexUrl}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="w-full"
|
||||
@@ -387,7 +395,7 @@ const IssueDetails = () => {
|
||||
{issueData?.media.plexUrl4k && (
|
||||
<Button
|
||||
as="a"
|
||||
href={issueData?.media.plexUrl4k}
|
||||
href={plexUrl4k}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="w-full"
|
||||
@@ -590,7 +598,7 @@ const IssueDetails = () => {
|
||||
{issueData?.media.plexUrl && (
|
||||
<Button
|
||||
as="a"
|
||||
href={issueData?.media.plexUrl}
|
||||
href={plexUrl}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="w-full"
|
||||
@@ -623,7 +631,7 @@ const IssueDetails = () => {
|
||||
{issueData?.media.plexUrl4k && (
|
||||
<Button
|
||||
as="a"
|
||||
href={issueData?.media.plexUrl4k}
|
||||
href={plexUrl4k}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="w-full"
|
||||
|
@@ -18,6 +18,7 @@ import PersonCard from '@app/components/PersonCard';
|
||||
import RequestButton from '@app/components/RequestButton';
|
||||
import Slider from '@app/components/Slider';
|
||||
import StatusBadge from '@app/components/StatusBadge';
|
||||
import useDeepLinks from '@app/hooks/useDeepLinks';
|
||||
import useLocale from '@app/hooks/useLocale';
|
||||
import useSettings from '@app/hooks/useSettings';
|
||||
import { Permission, useUser } from '@app/hooks/useUser';
|
||||
@@ -123,29 +124,12 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
|
||||
setShowManager(router.query.manage == '1' ? true : false);
|
||||
}, [router.query.manage]);
|
||||
|
||||
const [plexUrl, setPlexUrl] = useState(data?.mediaInfo?.plexUrl);
|
||||
const [plexUrl4k, setPlexUrl4k] = useState(data?.mediaInfo?.plexUrl4k);
|
||||
|
||||
useEffect(() => {
|
||||
if (data) {
|
||||
if (
|
||||
/iPad|iPhone|iPod/.test(navigator.userAgent) ||
|
||||
(navigator.userAgent === 'MacIntel' && navigator.maxTouchPoints > 1)
|
||||
) {
|
||||
setPlexUrl(data.mediaInfo?.iOSPlexUrl);
|
||||
setPlexUrl4k(data.mediaInfo?.iOSPlexUrl4k);
|
||||
} else {
|
||||
setPlexUrl(data.mediaInfo?.plexUrl);
|
||||
setPlexUrl4k(data.mediaInfo?.plexUrl4k);
|
||||
}
|
||||
}
|
||||
}, [
|
||||
data,
|
||||
data?.mediaInfo?.iOSPlexUrl,
|
||||
data?.mediaInfo?.iOSPlexUrl4k,
|
||||
data?.mediaInfo?.plexUrl,
|
||||
data?.mediaInfo?.plexUrl4k,
|
||||
]);
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: data?.mediaInfo?.plexUrl,
|
||||
plexUrl4k: data?.mediaInfo?.plexUrl4k,
|
||||
iOSPlexUrl: data?.mediaInfo?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: data?.mediaInfo?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
if (!data && !error) {
|
||||
return <LoadingSpinner />;
|
||||
@@ -324,7 +308,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
|
||||
inProgress={(data.mediaInfo?.downloadStatus ?? []).length > 0}
|
||||
tmdbId={data.mediaInfo?.tmdbId}
|
||||
mediaType="movie"
|
||||
plexUrl={data.mediaInfo?.plexUrl}
|
||||
plexUrl={plexUrl}
|
||||
serviceUrl={data.mediaInfo?.serviceUrl}
|
||||
/>
|
||||
{settings.currentSettings.movie4kEnabled &&
|
||||
@@ -346,7 +330,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
|
||||
}
|
||||
tmdbId={data.mediaInfo?.tmdbId}
|
||||
mediaType="movie"
|
||||
plexUrl={data.mediaInfo?.plexUrl4k}
|
||||
plexUrl={plexUrl4k}
|
||||
serviceUrl={data.mediaInfo?.serviceUrl4k}
|
||||
/>
|
||||
)}
|
||||
|
@@ -4,6 +4,7 @@ import CachedImage from '@app/components/Common/CachedImage';
|
||||
import Tooltip from '@app/components/Common/Tooltip';
|
||||
import RequestModal from '@app/components/RequestModal';
|
||||
import StatusBadge from '@app/components/StatusBadge';
|
||||
import useDeepLinks from '@app/hooks/useDeepLinks';
|
||||
import { Permission, useUser } from '@app/hooks/useUser';
|
||||
import globalMessages from '@app/i18n/globalMessages';
|
||||
import { withProperties } from '@app/utils/typeHelpers';
|
||||
@@ -61,6 +62,13 @@ const RequestCardError = ({ requestData }: RequestCardErrorProps) => {
|
||||
const { hasPermission } = useUser();
|
||||
const intl = useIntl();
|
||||
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: requestData?.media?.plexUrl,
|
||||
plexUrl4k: requestData?.media?.plexUrl4k,
|
||||
iOSPlexUrl: requestData?.media?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: requestData?.media?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
const deleteRequest = async () => {
|
||||
await axios.delete(`/api/v1/media/${requestData?.media.id}`);
|
||||
mutate('/api/v1/media?filter=allavailable&take=20&sort=mediaAdded');
|
||||
@@ -138,11 +146,7 @@ const RequestCardError = ({ requestData }: RequestCardErrorProps) => {
|
||||
).length > 0
|
||||
}
|
||||
is4k={requestData.is4k}
|
||||
plexUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.plexUrl4k
|
||||
: requestData.media.plexUrl
|
||||
}
|
||||
plexUrl={requestData.is4k ? plexUrl4k : plexUrl}
|
||||
serviceUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.serviceUrl4k
|
||||
@@ -217,6 +221,13 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
|
||||
fallbackData: request,
|
||||
});
|
||||
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: requestData?.media?.plexUrl,
|
||||
plexUrl4k: requestData?.media?.plexUrl4k,
|
||||
iOSPlexUrl: requestData?.media?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: requestData?.media?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
const modifyRequest = async (type: 'approve' | 'decline') => {
|
||||
const response = await axios.post(`/api/v1/request/${request.id}/${type}`);
|
||||
|
||||
@@ -396,11 +407,7 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
|
||||
is4k={requestData.is4k}
|
||||
tmdbId={requestData.media.tmdbId}
|
||||
mediaType={requestData.type}
|
||||
plexUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.plexUrl4k
|
||||
: requestData.media.plexUrl
|
||||
}
|
||||
plexUrl={requestData.is4k ? plexUrl4k : plexUrl}
|
||||
serviceUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.serviceUrl4k
|
||||
|
@@ -4,6 +4,7 @@ import CachedImage from '@app/components/Common/CachedImage';
|
||||
import ConfirmButton from '@app/components/Common/ConfirmButton';
|
||||
import RequestModal from '@app/components/RequestModal';
|
||||
import StatusBadge from '@app/components/StatusBadge';
|
||||
import useDeepLinks from '@app/hooks/useDeepLinks';
|
||||
import { Permission, useUser } from '@app/hooks/useUser';
|
||||
import globalMessages from '@app/i18n/globalMessages';
|
||||
import {
|
||||
@@ -61,6 +62,13 @@ const RequestItemError = ({
|
||||
revalidateList();
|
||||
};
|
||||
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: requestData?.media?.plexUrl,
|
||||
plexUrl4k: requestData?.media?.plexUrl4k,
|
||||
iOSPlexUrl: requestData?.media?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: requestData?.media?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="flex h-64 w-full flex-col justify-center rounded-xl bg-gray-800 py-4 text-gray-400 shadow-md ring-1 ring-red-500 xl:h-28 xl:flex-row">
|
||||
<div className="flex w-full flex-col justify-between overflow-hidden sm:flex-row">
|
||||
@@ -130,11 +138,7 @@ const RequestItemError = ({
|
||||
).length > 0
|
||||
}
|
||||
is4k={requestData.is4k}
|
||||
plexUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.plexUrl4k
|
||||
: requestData.media.plexUrl
|
||||
}
|
||||
plexUrl={requestData.is4k ? plexUrl4k : plexUrl}
|
||||
serviceUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.serviceUrl4k
|
||||
@@ -316,6 +320,13 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
|
||||
}
|
||||
};
|
||||
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: requestData?.media?.plexUrl,
|
||||
plexUrl4k: requestData?.media?.plexUrl4k,
|
||||
iOSPlexUrl: requestData?.media?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: requestData?.media?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
if (!title && !error) {
|
||||
return (
|
||||
<div
|
||||
@@ -462,11 +473,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
|
||||
is4k={requestData.is4k}
|
||||
tmdbId={requestData.media.tmdbId}
|
||||
mediaType={requestData.type}
|
||||
plexUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.plexUrl4k
|
||||
: requestData.media.plexUrl
|
||||
}
|
||||
plexUrl={requestData.is4k ? plexUrl4k : plexUrl}
|
||||
serviceUrl={
|
||||
requestData.is4k
|
||||
? requestData.media.serviceUrl4k
|
||||
|
@@ -22,6 +22,7 @@ import RequestModal from '@app/components/RequestModal';
|
||||
import Slider from '@app/components/Slider';
|
||||
import StatusBadge from '@app/components/StatusBadge';
|
||||
import Season from '@app/components/TvDetails/Season';
|
||||
import useDeepLinks from '@app/hooks/useDeepLinks';
|
||||
import useLocale from '@app/hooks/useLocale';
|
||||
import useSettings from '@app/hooks/useSettings';
|
||||
import { Permission, useUser } from '@app/hooks/useUser';
|
||||
@@ -122,29 +123,12 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
|
||||
setShowManager(router.query.manage == '1' ? true : false);
|
||||
}, [router.query.manage]);
|
||||
|
||||
const [plexUrl, setPlexUrl] = useState(data?.mediaInfo?.plexUrl);
|
||||
const [plexUrl4k, setPlexUrl4k] = useState(data?.mediaInfo?.plexUrl4k);
|
||||
|
||||
useEffect(() => {
|
||||
if (data) {
|
||||
if (
|
||||
/iPad|iPhone|iPod/.test(navigator.userAgent) ||
|
||||
(navigator.userAgent === 'MacIntel' && navigator.maxTouchPoints > 1)
|
||||
) {
|
||||
setPlexUrl(data.mediaInfo?.iOSPlexUrl);
|
||||
setPlexUrl4k(data.mediaInfo?.iOSPlexUrl4k);
|
||||
} else {
|
||||
setPlexUrl(data.mediaInfo?.plexUrl);
|
||||
setPlexUrl4k(data.mediaInfo?.plexUrl4k);
|
||||
}
|
||||
}
|
||||
}, [
|
||||
data,
|
||||
data?.mediaInfo?.iOSPlexUrl,
|
||||
data?.mediaInfo?.iOSPlexUrl4k,
|
||||
data?.mediaInfo?.plexUrl,
|
||||
data?.mediaInfo?.plexUrl4k,
|
||||
]);
|
||||
const { plexUrl, plexUrl4k } = useDeepLinks({
|
||||
plexUrl: data?.mediaInfo?.plexUrl,
|
||||
plexUrl4k: data?.mediaInfo?.plexUrl4k,
|
||||
iOSPlexUrl: data?.mediaInfo?.iOSPlexUrl,
|
||||
iOSPlexUrl4k: data?.mediaInfo?.iOSPlexUrl4k,
|
||||
});
|
||||
|
||||
if (!data && !error) {
|
||||
return <LoadingSpinner />;
|
||||
@@ -337,7 +321,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
|
||||
inProgress={(data.mediaInfo?.downloadStatus ?? []).length > 0}
|
||||
tmdbId={data.mediaInfo?.tmdbId}
|
||||
mediaType="tv"
|
||||
plexUrl={data.mediaInfo?.plexUrl}
|
||||
plexUrl={plexUrl}
|
||||
serviceUrl={data.mediaInfo?.serviceUrl}
|
||||
/>
|
||||
{settings.currentSettings.series4kEnabled &&
|
||||
@@ -359,7 +343,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
|
||||
}
|
||||
tmdbId={data.mediaInfo?.tmdbId}
|
||||
mediaType="tv"
|
||||
plexUrl={data.mediaInfo?.plexUrl4k}
|
||||
plexUrl={plexUrl4k}
|
||||
serviceUrl={data.mediaInfo?.serviceUrl4k}
|
||||
/>
|
||||
)}
|
||||
|
35
src/hooks/useDeepLinks.ts
Normal file
35
src/hooks/useDeepLinks.ts
Normal file
@@ -0,0 +1,35 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
interface useDeepLinksProps {
|
||||
plexUrl?: string;
|
||||
plexUrl4k?: string;
|
||||
iOSPlexUrl?: string;
|
||||
iOSPlexUrl4k?: string;
|
||||
}
|
||||
|
||||
const useDeepLinks = ({
|
||||
plexUrl,
|
||||
plexUrl4k,
|
||||
iOSPlexUrl,
|
||||
iOSPlexUrl4k,
|
||||
}: useDeepLinksProps) => {
|
||||
const [returnedPlexUrl, setReturnedPlexUrl] = useState(plexUrl);
|
||||
const [returnedPlexUrl4k, setReturnedPlexUrl4k] = useState(plexUrl4k);
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
/iPad|iPhone|iPod/.test(navigator.userAgent) ||
|
||||
(navigator.userAgent === 'MacIntel' && navigator.maxTouchPoints > 1)
|
||||
) {
|
||||
setReturnedPlexUrl(iOSPlexUrl);
|
||||
setReturnedPlexUrl4k(iOSPlexUrl4k);
|
||||
} else {
|
||||
setReturnedPlexUrl(plexUrl);
|
||||
setReturnedPlexUrl4k(plexUrl4k);
|
||||
}
|
||||
}, [iOSPlexUrl, iOSPlexUrl4k, plexUrl, plexUrl4k]);
|
||||
|
||||
return { plexUrl: returnedPlexUrl, plexUrl4k: returnedPlexUrl4k };
|
||||
};
|
||||
|
||||
export default useDeepLinks;
|
Reference in New Issue
Block a user