fix: added deep links to issues and status badges (#3065)

pull/3075/head
Brandon Cohen 2 years ago committed by GitHub
parent 1dfa9431a9
commit bfe56c3470
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -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}
/>
)}

@ -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;
Loading…
Cancel
Save