= ({
title={intl.formatMessage(
is4k ? messages.requestcollection4k : messages.requestcollection
)}
- iconSvg={
-
- }
+ iconSvg={}
>
{intl.formatMessage(
@@ -355,20 +341,7 @@ const CollectionDetails: React.FC = ({
}}
text={
<>
-
+
{intl.formatMessage(
hasRequestable
@@ -393,20 +366,7 @@ const CollectionDetails: React.FC = ({
setIs4k(true);
}}
>
-
+
{intl.formatMessage(messages.requestcollection4k)}
diff --git a/src/components/Common/Alert/index.tsx b/src/components/Common/Alert/index.tsx
index b29513cc6..9f62131a3 100644
--- a/src/components/Common/Alert/index.tsx
+++ b/src/components/Common/Alert/index.tsx
@@ -1,3 +1,8 @@
+import {
+ ExclamationIcon,
+ InformationCircleIcon,
+ XCircleIcon,
+} from '@heroicons/react/solid';
import React from 'react';
interface AlertProps {
@@ -10,21 +15,7 @@ const Alert: React.FC = ({ title, children, type }) => {
bgColor: 'bg-yellow-600',
titleColor: 'text-yellow-200',
textColor: 'text-yellow-300',
- svg: (
-
- ),
+ svg: ,
};
switch (type) {
@@ -33,22 +24,7 @@ const Alert: React.FC = ({ title, children, type }) => {
bgColor: 'bg-indigo-600',
titleColor: 'text-indigo-200',
textColor: 'text-indigo-300',
- svg: (
-
- ),
+ svg: ,
};
break;
case 'error':
@@ -56,22 +32,7 @@ const Alert: React.FC = ({ title, children, type }) => {
bgColor: 'bg-red-600',
titleColor: 'text-red-200',
textColor: 'text-red-300',
- svg: (
-
- ),
+ svg: ,
};
break;
}
diff --git a/src/components/Common/ButtonWithDropdown/index.tsx b/src/components/Common/ButtonWithDropdown/index.tsx
index d429e1148..65a8c7417 100644
--- a/src/components/Common/ButtonWithDropdown/index.tsx
+++ b/src/components/Common/ButtonWithDropdown/index.tsx
@@ -1,13 +1,14 @@
+import { ChevronDownIcon } from '@heroicons/react/solid';
import React, {
- useState,
- useRef,
AnchorHTMLAttributes,
- ReactNode,
ButtonHTMLAttributes,
+ ReactNode,
+ useRef,
+ useState,
} from 'react';
import useClickOutside from '../../../hooks/useClickOutside';
-import Transition from '../../Transition';
import { withProperties } from '../../../utils/typeHelpers';
+import Transition from '../../Transition';
interface DropdownItemProps extends AnchorHTMLAttributes {
buttonType?: 'primary' | 'ghost';
@@ -102,18 +103,7 @@ const ButtonWithDropdown: React.FC = ({
{dropdownIcon ? (
dropdownIcon
) : (
-
+
)}
= ({ links }) => {
@@ -20,27 +21,8 @@ const PlayButton: React.FC = ({ links }) => {
buttonType="ghost"
text={
<>
-
- {links[0].text}
+ {links[0].svg}
+ {links[0].text}
>
}
onClick={() => {
@@ -57,6 +39,7 @@ const PlayButton: React.FC = ({ links }) => {
}}
buttonType="ghost"
>
+ {link.svg}
{link.text}
);
diff --git a/src/components/Common/SlideOver/index.tsx b/src/components/Common/SlideOver/index.tsx
index 79a9a0bb7..4dac751a7 100644
--- a/src/components/Common/SlideOver/index.tsx
+++ b/src/components/Common/SlideOver/index.tsx
@@ -1,4 +1,5 @@
/* eslint-disable jsx-a11y/click-events-have-key-events */
+import { XIcon } from '@heroicons/react/outline';
import React, { useEffect, useRef, useState } from 'react';
import ReactDOM from 'react-dom';
import { useLockBodyScroll } from '../../../hooks/useLockBodyScroll';
@@ -81,20 +82,7 @@ const SlideOver: React.FC = ({
className="text-indigo-200 transition duration-150 ease-in-out hover:text-white"
onClick={() => onClose()}
>
-
+
diff --git a/src/components/Discover/MovieGenreSlider/index.tsx b/src/components/Discover/MovieGenreSlider/index.tsx
index 6ebbed11e..56abf7d9a 100644
--- a/src/components/Discover/MovieGenreSlider/index.tsx
+++ b/src/components/Discover/MovieGenreSlider/index.tsx
@@ -1,12 +1,13 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
+import Link from 'next/link';
import React, { useContext } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import useSWR from 'swr';
-import GenreCard from '../../GenreCard';
-import Slider from '../../Slider';
import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
import { LanguageContext } from '../../../context/LanguageContext';
+import GenreCard from '../../GenreCard';
+import Slider from '../../Slider';
import { genreColorMap } from '../constants';
-import Link from 'next/link';
const messages = defineMessages({
moviegenres: 'Movie Genres',
@@ -29,20 +30,7 @@ const MovieGenreSlider: React.FC = () => {
{intl.formatMessage(messages.moviegenres)}
-
+
diff --git a/src/components/Discover/TvGenreSlider/index.tsx b/src/components/Discover/TvGenreSlider/index.tsx
index 20b1b1e26..37f1ee18b 100644
--- a/src/components/Discover/TvGenreSlider/index.tsx
+++ b/src/components/Discover/TvGenreSlider/index.tsx
@@ -1,12 +1,13 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
+import Link from 'next/link';
import React, { useContext } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import useSWR from 'swr';
-import GenreCard from '../../GenreCard';
-import Slider from '../../Slider';
import { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
import { LanguageContext } from '../../../context/LanguageContext';
+import GenreCard from '../../GenreCard';
+import Slider from '../../Slider';
import { genreColorMap } from '../constants';
-import Link from 'next/link';
const messages = defineMessages({
tvgenres: 'Series Genres',
@@ -29,20 +30,7 @@ const TvGenreSlider: React.FC = () => {
{intl.formatMessage(messages.tvgenres)}
-
+
diff --git a/src/components/Discover/index.tsx b/src/components/Discover/index.tsx
index 8560a5353..bb80d08b8 100644
--- a/src/components/Discover/index.tsx
+++ b/src/components/Discover/index.tsx
@@ -1,3 +1,4 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
import Link from 'next/link';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -66,20 +67,7 @@ const Discover: React.FC = () => {
{intl.formatMessage(messages.recentrequests)}
-
+
diff --git a/src/components/Layout/LanguagePicker/index.tsx b/src/components/Layout/LanguagePicker/index.tsx
index 25111f302..683fe5f43 100644
--- a/src/components/Layout/LanguagePicker/index.tsx
+++ b/src/components/Layout/LanguagePicker/index.tsx
@@ -1,3 +1,4 @@
+import { TranslateIcon } from '@heroicons/react/solid';
import React, { useContext, useRef, useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import {
@@ -100,18 +101,7 @@ const LanguagePicker: React.FC = () => {
aria-label="Language Picker"
onClick={() => setDropdownOpen(true)}
>
-
+
{
@@ -6,19 +7,7 @@ const Notifications: React.FC = () => {
className="p-1 text-gray-400 rounded-full hover:bg-gray-500 hover:text-white focus:outline-none focus:ring focus:text-white"
aria-label="Notifications"
>
-
+
);
};
diff --git a/src/components/Layout/SearchInput/index.tsx b/src/components/Layout/SearchInput/index.tsx
index 9d0aa6348..9042ef45c 100644
--- a/src/components/Layout/SearchInput/index.tsx
+++ b/src/components/Layout/SearchInput/index.tsx
@@ -1,7 +1,8 @@
+import { XCircleIcon } from '@heroicons/react/outline';
+import { SearchIcon } from '@heroicons/react/solid';
import React from 'react';
-import useSearchInput from '../../../hooks/useSearchInput';
import { defineMessages, useIntl } from 'react-intl';
-import ClearButton from '../../../assets/xcircle.svg';
+import useSearchInput from '../../../hooks/useSearchInput';
const messages = defineMessages({
searchPlaceholder: 'Search Movies & TV',
@@ -18,13 +19,7 @@ const SearchInput: React.FC = () => {
{
className="absolute inset-y-0 p-1 m-auto text-gray-400 transition border-none outline-none right-2 h-7 w-7 focus:outline-none focus:border-none hover:text-white"
onClick={() => clear()}
>
-
+
)}
diff --git a/src/components/Layout/Sidebar/index.tsx b/src/components/Layout/Sidebar/index.tsx
index 7558b95ba..dbd156252 100644
--- a/src/components/Layout/Sidebar/index.tsx
+++ b/src/components/Layout/Sidebar/index.tsx
@@ -1,3 +1,10 @@
+import {
+ ClockIcon,
+ CogIcon,
+ SparklesIcon,
+ XIcon,
+} from '@heroicons/react/outline';
+import { UsersIcon } from '@heroicons/react/solid';
import Link from 'next/link';
import { useRouter } from 'next/router';
import React, { ReactNode, useRef } from 'react';
@@ -33,20 +40,7 @@ const SidebarLinks: SidebarLinkProps[] = [
href: '/',
messagesKey: 'dashboard',
svgIcon: (
-
+
),
activeRegExp: /^\/(discover\/?(movies|tv)?)?$/,
},
@@ -54,20 +48,7 @@ const SidebarLinks: SidebarLinkProps[] = [
href: '/requests',
messagesKey: 'requests',
svgIcon: (
-
+
),
activeRegExp: /^\/requests/,
},
@@ -75,14 +56,7 @@ const SidebarLinks: SidebarLinkProps[] = [
href: '/users',
messagesKey: 'users',
svgIcon: (
-
+
),
activeRegExp: /^\/users/,
requiredPermission: Permission.MANAGE_USERS,
@@ -91,26 +65,7 @@ const SidebarLinks: SidebarLinkProps[] = [
href: '/settings',
messagesKey: 'settings',
svgIcon: (
-
+
),
activeRegExp: /^\/settings/,
requiredPermission: Permission.MANAGE_SETTINGS,
@@ -157,19 +112,7 @@ const Sidebar: React.FC = ({ open, setClosed }) => {
aria-label="Close sidebar"
onClick={() => setClosed()}
>
-
+
diff --git a/src/components/Layout/VersionStatus/index.tsx b/src/components/Layout/VersionStatus/index.tsx
index e5e07869c..0a2ac43c8 100644
--- a/src/components/Layout/VersionStatus/index.tsx
+++ b/src/components/Layout/VersionStatus/index.tsx
@@ -1,3 +1,9 @@
+import {
+ ArrowCircleUpIcon,
+ BeakerIcon,
+ CodeIcon,
+ ServerIcon,
+} from '@heroicons/react/outline';
import Link from 'next/link';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -51,50 +57,11 @@ const VersionStatus: React.FC = ({ onClick }) => {
}`}
>
{data.commitTag === 'local' ? (
-
+
) : data.version.startsWith('develop-') ? (
-
+
) : (
-
+
)}
{versionStream}
@@ -114,22 +81,7 @@ const VersionStatus: React.FC = ({ onClick }) => {
)}
- {data.updateAvailable && (
-
- )}
+ {data.updateAvailable && }
);
diff --git a/src/components/Layout/index.tsx b/src/components/Layout/index.tsx
index 18519734b..7ea9ac64d 100644
--- a/src/components/Layout/index.tsx
+++ b/src/components/Layout/index.tsx
@@ -1,3 +1,5 @@
+import { MenuAlt2Icon } from '@heroicons/react/outline';
+import { InformationCircleIcon } from '@heroicons/react/solid';
import { useRouter } from 'next/router';
import React, { useEffect, useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -57,19 +59,7 @@ const Layout: React.FC = ({ children }) => {
aria-label="Open sidebar"
onClick={() => setSidebarOpen(true)}
>
-
+
@@ -87,18 +77,7 @@ const Layout: React.FC = ({ children }) => {
diff --git a/src/components/Login/LocalLogin.tsx b/src/components/Login/LocalLogin.tsx
index 4216bf4a3..6444635f2 100644
--- a/src/components/Login/LocalLogin.tsx
+++ b/src/components/Login/LocalLogin.tsx
@@ -1,3 +1,4 @@
+import { LoginIcon, SupportIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import Link from 'next/link';
@@ -12,7 +13,7 @@ const messages = defineMessages({
validationemailrequired: 'You must provide a valid email address',
validationpasswordrequired: 'You must provide a password',
loginerror: 'Something went wrong while trying to sign in.',
- signingin: 'Signing in…',
+ signingin: 'Signing In…',
signin: 'Sign In',
forgotpassword: 'Forgot Password?',
});
@@ -103,6 +104,7 @@ const LocalLogin: React.FC = ({ revalidate }) => {
@@ -113,6 +115,7 @@ const LocalLogin: React.FC = ({ revalidate }) => {
type="submit"
disabled={isSubmitting || !isValid}
>
+
{isSubmitting
? intl.formatMessage(messages.signingin)
: intl.formatMessage(messages.signin)}
diff --git a/src/components/Login/index.tsx b/src/components/Login/index.tsx
index 0474b9da1..d877e1605 100644
--- a/src/components/Login/index.tsx
+++ b/src/components/Login/index.tsx
@@ -1,3 +1,4 @@
+import { XCircleIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { useRouter } from 'next/dist/client/router';
import React, { useEffect, useState } from 'react';
@@ -100,19 +101,7 @@ const Login: React.FC = () => {
diff --git a/src/components/MediaSlider/ShowMoreCard/index.tsx b/src/components/MediaSlider/ShowMoreCard/index.tsx
index e229ad7ef..c42909669 100644
--- a/src/components/MediaSlider/ShowMoreCard/index.tsx
+++ b/src/components/MediaSlider/ShowMoreCard/index.tsx
@@ -1,3 +1,4 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/solid';
import Link from 'next/link';
import React, { useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -79,18 +80,7 @@ const ShowMoreCard: React.FC = ({ url, posters }) => {
)}
-
+
{intl.formatMessage(messages.seemore)}
diff --git a/src/components/MediaSlider/index.tsx b/src/components/MediaSlider/index.tsx
index c46e16bcf..64aa79153 100644
--- a/src/components/MediaSlider/index.tsx
+++ b/src/components/MediaSlider/index.tsx
@@ -1,3 +1,4 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
import Link from 'next/link';
import React, { useContext, useEffect } from 'react';
import { useSWRInfinite } from 'swr';
@@ -140,20 +141,7 @@ const MediaSlider: React.FC
= ({
{title}
-
+
) : (
diff --git a/src/components/MovieDetails/index.tsx b/src/components/MovieDetails/index.tsx
index dadd9c1ad..7db6b9465 100644
--- a/src/components/MovieDetails/index.tsx
+++ b/src/components/MovieDetails/index.tsx
@@ -1,3 +1,14 @@
+import {
+ ArrowCircleRightIcon,
+ CogIcon,
+ FilmIcon,
+ PlayIcon,
+} from '@heroicons/react/outline';
+import {
+ CheckCircleIcon,
+ DocumentRemoveIcon,
+ ExternalLinkIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
import Link from 'next/link';
import { useRouter } from 'next/router';
@@ -50,7 +61,7 @@ const messages = defineMessages({
manageModalTitle: 'Manage Movie',
manageModalRequests: 'Requests',
manageModalNoRequests: 'No requests.',
- manageModalClearMedia: 'Clear All Media Data',
+ manageModalClearMedia: 'Clear Media Data',
manageModalClearMediaWarning:
'* This will irreversibly remove all data for this movie, including any requests. If this item exists in your Plex library, the media information will be recreated during the next scan.',
studio: '{studioCount, plural, one {Studio} other {Studios}}',
@@ -105,6 +116,7 @@ const MovieDetails: React.FC = ({ movie }) => {
mediaLinks.push({
text: intl.formatMessage(messages.playonplex),
url: data.mediaInfo?.plexUrl,
+ svg: ,
});
}
@@ -117,6 +129,7 @@ const MovieDetails: React.FC = ({ movie }) => {
mediaLinks.push({
text: intl.formatMessage(messages.play4konplex),
url: data.mediaInfo?.plexUrl4k,
+ svg: ,
});
}
@@ -129,6 +142,7 @@ const MovieDetails: React.FC = ({ movie }) => {
mediaLinks.push({
text: intl.formatMessage(messages.watchtrailer),
url: trailerUrl,
+ svg: ,
});
}
@@ -266,18 +280,7 @@ const MovieDetails: React.FC = ({ movie }) => {
className="w-full sm:mb-0"
buttonType="success"
>
-
+
{intl.formatMessage(messages.markavailable)}
@@ -291,18 +294,7 @@ const MovieDetails: React.FC
= ({ movie }) => {
className="w-full sm:mb-0"
buttonType="success"
>
-
+
{intl.formatMessage(messages.mark4kavailable)}
@@ -341,15 +333,7 @@ const MovieDetails: React.FC = ({ movie }) => {
className="block mb-2 last:mb-0"
>
@@ -361,15 +345,7 @@ const MovieDetails: React.FC = ({ movie }) => {
rel="noreferrer"
>
@@ -383,6 +359,7 @@ const MovieDetails: React.FC = ({ movie }) => {
confirmText={intl.formatMessage(globalMessages.areyousure)}
className="w-full"
>
+
{intl.formatMessage(messages.manageModalClearMedia)}
@@ -463,27 +440,7 @@ const MovieDetails: React.FC
= ({ movie }) => {
className="ml-2 first:ml-0"
onClick={() => setShowManager(true)}
>
-
+
)}
@@ -513,20 +470,7 @@ const MovieDetails: React.FC = ({ movie }) => {
{intl.formatMessage(messages.viewfullcrew)}
-
+
@@ -709,20 +653,7 @@ const MovieDetails: React.FC
= ({ movie }) => {
{intl.formatMessage(messages.cast)}
-
+
diff --git a/src/components/PersonCard/index.tsx b/src/components/PersonCard/index.tsx
index 67cdf43ff..85e41ff33 100644
--- a/src/components/PersonCard/index.tsx
+++ b/src/components/PersonCard/index.tsx
@@ -1,3 +1,4 @@
+import { UserCircleIcon } from '@heroicons/react/solid';
import Link from 'next/link';
import React, { useState } from 'react';
import CachedImage from '../Common/CachedImage';
@@ -57,18 +58,7 @@ const PersonCard: React.FC = ({
/>
) : (
-
+
)}
{name}
diff --git a/src/components/PlexLoginButton/index.tsx b/src/components/PlexLoginButton/index.tsx
index f6bbb5b79..c85fa78c6 100644
--- a/src/components/PlexLoginButton/index.tsx
+++ b/src/components/PlexLoginButton/index.tsx
@@ -1,3 +1,4 @@
+import { LoginIcon } from '@heroicons/react/outline';
import React, { useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import globalMessages from '../../i18n/globalMessages';
@@ -5,7 +6,7 @@ import PlexOAuth from '../../utils/plex';
const messages = defineMessages({
signinwithplex: 'Sign In',
- signingin: 'Signing in…',
+ signingin: 'Signing In…',
});
const plexOAuth = new PlexOAuth();
@@ -48,6 +49,7 @@ const PlexLoginButton: React.FC
= ({
disabled={loading || isProcessing}
className="plex-button"
>
+
{loading
? intl.formatMessage(globalMessages.loading)
: isProcessing
diff --git a/src/components/RegionSelector/index.tsx b/src/components/RegionSelector/index.tsx
index 2cbdc4351..dbbae3f93 100644
--- a/src/components/RegionSelector/index.tsx
+++ b/src/components/RegionSelector/index.tsx
@@ -1,11 +1,12 @@
-import React, { useEffect, useMemo, useState } from 'react';
import { Listbox, Transition } from '@headlessui/react';
+import { CheckIcon, ChevronDownIcon } from '@heroicons/react/solid';
+import { hasFlag } from 'country-flag-icons';
+import 'country-flag-icons/3x2/flags.css';
+import React, { useEffect, useMemo, useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
import useSWR from 'swr';
import type { Region } from '../../../server/lib/settings';
-import { defineMessages, useIntl } from 'react-intl';
import useSettings from '../../hooks/useSettings';
-import { hasFlag } from 'country-flag-icons';
-import 'country-flag-icons/3x2/flags.css';
const messages = defineMessages({
regionDefault: 'All Regions',
@@ -125,20 +126,7 @@ const RegionSelector: React.FC = ({
: intl.formatMessage(messages.regionDefault)}
-
+
@@ -196,18 +184,7 @@ const RegionSelector: React.FC = ({
active ? 'text-white' : 'text-indigo-600'
} absolute inset-y-0 left-0 flex items-center pl-1.5`}
>
-
+
)}
@@ -234,18 +211,7 @@ const RegionSelector: React.FC
= ({
active ? 'text-white' : 'text-indigo-600'
} absolute inset-y-0 left-0 flex items-center pl-1.5`}
>
-
+
)}
@@ -286,18 +252,7 @@ const RegionSelector: React.FC = ({
active ? 'text-white' : 'text-indigo-600'
} absolute inset-y-0 left-0 flex items-center pl-1.5`}
>
-
+
)}
diff --git a/src/components/RequestBlock/index.tsx b/src/components/RequestBlock/index.tsx
index c23370e94..d003bcf72 100644
--- a/src/components/RequestBlock/index.tsx
+++ b/src/components/RequestBlock/index.tsx
@@ -1,3 +1,12 @@
+import {
+ CalendarIcon,
+ CheckIcon,
+ EyeIcon,
+ PencilIcon,
+ TrashIcon,
+ UserIcon,
+ XIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
import React, { useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -69,37 +78,14 @@ const RequestBlock: React.FC = ({ request, onUpdate }) => {
-
+
{request.requestedBy.displayName}
{request.modifiedBy && (
-
+
{request.modifiedBy?.displayName}
@@ -115,18 +101,7 @@ const RequestBlock: React.FC
= ({ request, onUpdate }) => {
onClick={() => updateRequest('approve')}
disabled={isUpdating}
>
-
+
@@ -135,18 +110,7 @@ const RequestBlock: React.FC = ({ request, onUpdate }) => {
onClick={() => updateRequest('decline')}
disabled={isUpdating}
>
-
+
@@ -155,14 +119,7 @@ const RequestBlock: React.FC = ({ request, onUpdate }) => {
onClick={() => setShowEditModal(true)}
disabled={isUpdating}
>
-
+
>
@@ -173,18 +130,7 @@ const RequestBlock: React.FC = ({ request, onUpdate }) => {
onClick={() => deleteRequest()}
disabled={isUpdating}
>
-
+
)}
@@ -215,18 +161,7 @@ const RequestBlock: React.FC
= ({ request, onUpdate }) => {
-
+
{intl.formatDate(request.createdAt, {
year: 'numeric',
diff --git a/src/components/RequestButton/index.tsx b/src/components/RequestButton/index.tsx
index 2c26c694f..a528bba43 100644
--- a/src/components/RequestButton/index.tsx
+++ b/src/components/RequestButton/index.tsx
@@ -1,5 +1,11 @@
+import { DownloadIcon } from '@heroicons/react/outline';
+import {
+ CheckIcon,
+ InformationCircleIcon,
+ XIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
-import React, { useState } from 'react';
+import React, { useMemo, useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import {
MediaRequestStatus,
@@ -17,19 +23,19 @@ const messages = defineMessages({
viewrequest: 'View Request',
viewrequest4k: 'View 4K Request',
requestmore: 'Request More',
- requestmore4k: 'Request More 4K',
+ requestmore4k: 'Request More in 4K',
approverequest: 'Approve Request',
approverequest4k: 'Approve 4K Request',
declinerequest: 'Decline Request',
declinerequest4k: 'Decline 4K Request',
approverequests:
- 'Approve {requestCount} {requestCount, plural, one {Request} other {Requests}}',
+ 'Approve {requestCount, plural, one {Request} other {{requestCount} Requests}}',
declinerequests:
- 'Decline {requestCount} {requestCount, plural, one {Request} other {Requests}}',
+ 'Decline {requestCount, plural, one {Request} other {{requestCount} Requests}}',
approve4krequests:
- 'Approve {requestCount} 4K {requestCount, plural, one {Request} other {Requests}}',
+ 'Approve {requestCount, plural, one {4K Request} other {{requestCount} 4K Requests}}',
decline4krequests:
- 'Decline {requestCount} 4K {requestCount, plural, one {Request} other {Requests}}',
+ 'Decline {requestCount, plural, one {4K Request} other {{requestCount} 4K Requests}}',
});
interface ButtonOption {
@@ -58,26 +64,34 @@ const RequestButton: React.FC = ({
}) => {
const intl = useIntl();
const settings = useSettings();
- const { hasPermission } = useUser();
+ const { user, hasPermission } = useUser();
const [showRequestModal, setShowRequestModal] = useState(false);
const [showRequest4kModal, setShowRequest4kModal] = useState(false);
+ const [editRequest, setEditRequest] = useState(false);
- const activeRequest = media?.requests.find(
- (request) => request.status === MediaRequestStatus.PENDING && !request.is4k
- );
- const active4kRequest = media?.requests.find(
- (request) => request.status === MediaRequestStatus.PENDING && request.is4k
- );
-
- // All pending
+ // All pending requests
const activeRequests = media?.requests.filter(
(request) => request.status === MediaRequestStatus.PENDING && !request.is4k
);
-
const active4kRequests = media?.requests.filter(
(request) => request.status === MediaRequestStatus.PENDING && request.is4k
);
+ const activeRequest = useMemo(() => {
+ return activeRequests && activeRequests.length > 0
+ ? activeRequests.find((request) => request.requestedBy.id === user?.id) ??
+ activeRequests[0]
+ : undefined;
+ }, [activeRequests, user]);
+
+ const active4kRequest = useMemo(() => {
+ return active4kRequests && active4kRequests.length > 0
+ ? active4kRequests.find(
+ (request) => request.requestedBy.id === user?.id
+ ) ?? active4kRequests[0]
+ : undefined;
+ }, [active4kRequests, user]);
+
const modifyRequest = async (
request: MediaRequest,
type: 'approve' | 'decline'
@@ -115,57 +129,10 @@ const RequestButton: React.FC = ({
id: 'request',
text: intl.formatMessage(globalMessages.request),
action: () => {
+ setEditRequest(false);
setShowRequestModal(true);
},
- svg: (
-
- ),
- });
- }
-
- if (
- hasPermission(Permission.REQUEST) &&
- mediaType === 'tv' &&
- media &&
- media.status !== MediaStatus.AVAILABLE &&
- media.status !== MediaStatus.UNKNOWN &&
- !isShowComplete
- ) {
- buttons.push({
- id: 'request-more',
- text: intl.formatMessage(messages.requestmore),
- action: () => {
- setShowRequestModal(true);
- },
- svg: (
-
- ),
+ svg: ,
});
}
@@ -181,112 +148,44 @@ const RequestButton: React.FC = ({
id: 'request4k',
text: intl.formatMessage(globalMessages.request4k),
action: () => {
+ setEditRequest(false);
setShowRequest4kModal(true);
},
- svg: (
-
- ),
- });
- }
-
- if (
- mediaType === 'tv' &&
- (hasPermission(Permission.REQUEST_4K) ||
- (mediaType === 'tv' && hasPermission(Permission.REQUEST_4K_TV))) &&
- media &&
- media.status4k !== MediaStatus.AVAILABLE &&
- media.status4k !== MediaStatus.UNKNOWN &&
- !is4kShowComplete &&
- settings.currentSettings.series4kEnabled
- ) {
- buttons.push({
- id: 'request-more-4k',
- text: intl.formatMessage(messages.requestmore4k),
- action: () => {
- setShowRequest4kModal(true);
- },
- svg: (
-
- ),
+ svg: ,
});
}
if (
activeRequest &&
- mediaType === 'movie' &&
- hasPermission(Permission.REQUEST)
+ (activeRequest.requestedBy.id === user?.id ||
+ (activeRequests?.length === 1 &&
+ hasPermission(Permission.MANAGE_REQUESTS)))
) {
buttons.push({
id: 'active-request',
text: intl.formatMessage(messages.viewrequest),
- action: () => setShowRequestModal(true),
- svg: (
-
- ),
+ action: () => {
+ setEditRequest(true);
+ setShowRequestModal(true);
+ },
+ svg: ,
});
}
if (
active4kRequest &&
- mediaType === 'movie' &&
- (hasPermission(Permission.REQUEST_4K) ||
- hasPermission(Permission.REQUEST_4K_MOVIE))
+ (active4kRequest.requestedBy.id === user?.id ||
+ (active4kRequests?.length === 1 &&
+ hasPermission(Permission.MANAGE_REQUESTS)))
) {
buttons.push({
id: 'active-4k-request',
text: intl.formatMessage(messages.viewrequest4k),
- action: () => setShowRequest4kModal(true),
- svg: (
-
- ),
+ action: () => {
+ setEditRequest(true);
+ setShowRequest4kModal(true);
+ },
+ svg: ,
});
}
@@ -302,20 +201,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequest(activeRequest, 'approve');
},
- svg: (
-
- ),
+ svg: ,
},
{
id: 'decline-request',
@@ -323,20 +209,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequest(activeRequest, 'decline');
},
- svg: (
-
- ),
+ svg: ,
}
);
}
@@ -356,20 +229,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequests(activeRequests, 'approve');
},
- svg: (
-
- ),
+ svg: ,
},
{
id: 'decline-request-batch',
@@ -379,20 +239,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequests(activeRequests, 'decline');
},
- svg: (
-
- ),
+ svg: ,
}
);
}
@@ -409,20 +256,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequest(active4kRequest, 'approve');
},
- svg: (
-
- ),
+ svg: ,
},
{
id: 'decline-4k-request',
@@ -430,20 +264,7 @@ const RequestButton: React.FC = ({
action: () => {
modifyRequest(active4kRequest, 'decline');
},
- svg: (
-
- ),
+ svg: ,
}
);
}
@@ -456,54 +277,71 @@ const RequestButton: React.FC = ({
) {
buttons.push(
{
- id: 'approve-request-batch',
+ id: 'approve-4k-request-batch',
text: intl.formatMessage(messages.approve4krequests, {
requestCount: active4kRequests.length,
}),
action: () => {
modifyRequests(active4kRequests, 'approve');
},
- svg: (
-
- ),
+ svg: ,
},
{
- id: 'decline-request-batch',
+ id: 'decline-4k-request-batch',
text: intl.formatMessage(messages.decline4krequests, {
requestCount: active4kRequests.length,
}),
action: () => {
modifyRequests(active4kRequests, 'decline');
},
- svg: (
-
- ),
+ svg: ,
}
);
}
+ if (
+ mediaType === 'tv' &&
+ (!activeRequest || activeRequest.requestedBy.id !== user?.id) &&
+ hasPermission(Permission.REQUEST) &&
+ media &&
+ media.status !== MediaStatus.AVAILABLE &&
+ media.status !== MediaStatus.UNKNOWN &&
+ !isShowComplete
+ ) {
+ buttons.push({
+ id: 'request-more',
+ text: intl.formatMessage(messages.requestmore),
+ action: () => {
+ setEditRequest(false);
+ setShowRequestModal(true);
+ },
+ svg: ,
+ });
+ }
+
+ if (
+ mediaType === 'tv' &&
+ (!active4kRequest || active4kRequest.requestedBy.id !== user?.id) &&
+ hasPermission([Permission.REQUEST_4K, Permission.REQUEST_4K_TV], {
+ type: 'or',
+ }) &&
+ media &&
+ media.status4k !== MediaStatus.AVAILABLE &&
+ media.status4k !== MediaStatus.UNKNOWN &&
+ !is4kShowComplete &&
+ settings.currentSettings.series4kEnabled
+ ) {
+ buttons.push({
+ id: 'request-more-4k',
+ text: intl.formatMessage(messages.requestmore4k),
+ action: () => {
+ setEditRequest(false);
+ setShowRequest4kModal(true);
+ },
+ svg: ,
+ });
+ }
+
const [buttonOne, ...others] = buttons;
if (!buttonOne) {
@@ -516,6 +354,7 @@ const RequestButton: React.FC = ({
tmdbId={tmdbId}
show={showRequestModal}
type={mediaType}
+ editRequest={editRequest ? activeRequest : undefined}
onComplete={() => {
onUpdate();
setShowRequestModal(false);
@@ -526,6 +365,7 @@ const RequestButton: React.FC = ({
tmdbId={tmdbId}
show={showRequest4kModal}
type={mediaType}
+ editRequest={editRequest ? active4kRequest : undefined}
is4k
onComplete={() => {
onUpdate();
diff --git a/src/components/RequestCard/index.tsx b/src/components/RequestCard/index.tsx
index e6baf6b1b..7e71813e3 100644
--- a/src/components/RequestCard/index.tsx
+++ b/src/components/RequestCard/index.tsx
@@ -1,3 +1,4 @@
+import { CheckIcon, TrashIcon, XIcon } from '@heroicons/react/solid';
import axios from 'axios';
import Link from 'next/link';
import React, { useContext, useEffect } from 'react';
@@ -68,20 +69,7 @@ const RequestCardError: React.FC = ({ mediaId }) => {
buttonSize="sm"
onClick={() => deleteRequest()}
>
-
+
{intl.formatMessage(messages.deleterequest)}
@@ -261,18 +249,7 @@ const RequestCard: React.FC = ({ request, onTitleData }) => {
buttonSize="sm"
onClick={() => modifyRequest('approve')}
>
-
+
{intl.formatMessage(globalMessages.approve)}
@@ -284,18 +261,7 @@ const RequestCard: React.FC = ({ request, onTitleData }) => {
buttonSize="sm"
onClick={() => modifyRequest('decline')}
>
-
+
{intl.formatMessage(globalMessages.decline)}
diff --git a/src/components/RequestList/RequestItem/index.tsx b/src/components/RequestList/RequestItem/index.tsx
index f9f512c96..01fb1ddc1 100644
--- a/src/components/RequestList/RequestItem/index.tsx
+++ b/src/components/RequestList/RequestItem/index.tsx
@@ -1,3 +1,10 @@
+import {
+ CheckIcon,
+ PencilIcon,
+ RefreshIcon,
+ TrashIcon,
+ XIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
import Link from 'next/link';
import React, { useContext, useState } from 'react';
@@ -29,6 +36,7 @@ const messages = defineMessages({
modified: 'Modified',
modifieduserdate: '{date} by {user}',
mediaerror: 'The associated title for this request is no longer available.',
+ editrequest: 'Edit Request',
deleterequest: 'Delete Request',
cancelRequest: 'Cancel Request',
});
@@ -66,20 +74,7 @@ const RequestItemError: React.FC = ({
buttonSize="sm"
onClick={() => deleteRequest()}
>
-
+
{intl.formatMessage(messages.deleterequest)}
@@ -369,31 +364,6 @@ const RequestItem: React.FC = ({
- {requestData.status === MediaRequestStatus.PENDING &&
- !hasPermission(Permission.MANAGE_REQUESTS) &&
- requestData.requestedBy.id === user?.id && (
-
deleteRequest()}
- confirmText={intl.formatMessage(globalMessages.areyousure)}
- className="w-full"
- >
-
-
- {intl.formatMessage(messages.cancelRequest)}
-
-
- )}
{requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
MediaStatus.UNKNOWN &&
requestData.status !== MediaRequestStatus.DECLINED &&
@@ -404,19 +374,14 @@ const RequestItem: React.FC
= ({
disabled={isRetrying}
onClick={() => retryRequest()}
>
-
+
- {intl.formatMessage(globalMessages.retry)}
+ {intl.formatMessage(
+ isRetrying ? globalMessages.retrying : globalMessages.retry
+ )}
)}
@@ -427,94 +392,72 @@ const RequestItem: React.FC = ({
confirmText={intl.formatMessage(globalMessages.areyousure)}
className="w-full"
>
-
+
- {intl.formatMessage(globalMessages.delete)}
+ {intl.formatMessage(messages.deleterequest)}
)}
{requestData.status === MediaRequestStatus.PENDING &&
hasPermission(Permission.MANAGE_REQUESTS) && (
- <>
-
-
-
-
-
-
-
-
+
+
+
+
- >
+
+ )}
+ {requestData.status === MediaRequestStatus.PENDING &&
+ (hasPermission(Permission.MANAGE_REQUESTS) ||
+ (requestData.requestedBy.id === user?.id &&
+ (requestData.type === 'tv' ||
+ hasPermission(Permission.REQUEST_ADVANCED)))) && (
+
+
+
+ )}
+ {requestData.status === MediaRequestStatus.PENDING &&
+ !hasPermission(Permission.MANAGE_REQUESTS) &&
+ requestData.requestedBy.id === user?.id && (
+ deleteRequest()}
+ confirmText={intl.formatMessage(globalMessages.areyousure)}
+ className="w-full"
+ >
+
+
+ {intl.formatMessage(messages.cancelRequest)}
+
+
)}
diff --git a/src/components/RequestList/index.tsx b/src/components/RequestList/index.tsx
index d0177e641..fd3281015 100644
--- a/src/components/RequestList/index.tsx
+++ b/src/components/RequestList/index.tsx
@@ -1,3 +1,4 @@
+import { FilterIcon, SortDescendingIcon } from '@heroicons/react/solid';
import Link from 'next/link';
import { useRouter } from 'next/router';
import React, { useEffect, useState } from 'react';
@@ -119,18 +120,7 @@ const RequestList: React.FC = () => {
-
+
diff --git a/src/components/RequestModal/SearchByNameModal/index.tsx b/src/components/RequestModal/SearchByNameModal/index.tsx
index 50df04691..111d6137f 100644
--- a/src/components/RequestModal/SearchByNameModal/index.tsx
+++ b/src/components/RequestModal/SearchByNameModal/index.tsx
@@ -1,3 +1,4 @@
+import { DownloadIcon } from '@heroicons/react/outline';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import useSWR from 'swr';
@@ -51,22 +52,7 @@ const SearchByNameModal: React.FC
= ({
okText={intl.formatMessage(globalMessages.next)}
okDisabled={!tvdbId}
okButtonType="primary"
- iconSvg={
-
- }
+ iconSvg={}
>
{title} requested successfully!',
requesttitle: 'Request {title}',
request4ktitle: 'Request {title} in 4K',
+ edit: 'Edit Request',
+ cancel: 'Cancel Request',
+ pendingrequest: 'Pending Request for {title}',
+ pending4krequest: 'Pending 4K Request for {title}',
+ requestfrom: "{username}'s request is pending approval.",
requestseasons:
'Request {seasonCount} {seasonCount, plural, one {Season} other {Seasons}}',
requestall: 'Request All Seasons',
@@ -42,6 +48,7 @@ const messages = defineMessages({
requestcancelled: 'Request for {title} canceled.',
autoapproval: 'Automatic Approval',
requesterror: 'Something went wrong while submitting the request.',
+ pendingapproval: 'Your request is pending approval.',
});
interface RequestModalProps extends React.HTMLAttributes {
@@ -341,6 +348,8 @@ const TvRequestModal: React.FC = ({
return seasonRequest;
};
+ const isOwner = editRequest && editRequest.requestedBy.id === user?.id;
+
return !data?.externalIds.tvdbId && searchModal.show ? (
= ({
onCancel={tvdbId ? () => setSearchModal({ show: true }) : onCancel}
onOk={() => (editRequest ? updateRequest() : sendRequest())}
title={intl.formatMessage(
- is4k ? messages.request4ktitle : messages.requesttitle,
+ editRequest
+ ? is4k
+ ? messages.pending4krequest
+ : messages.pendingrequest
+ : is4k
+ ? messages.request4ktitle
+ : messages.requesttitle,
{ title: data?.name }
)}
okText={
- editRequest && selectedSeasons.length === 0
- ? 'Cancel Request'
+ editRequest
+ ? selectedSeasons.length === 0
+ ? intl.formatMessage(messages.cancel)
+ : intl.formatMessage(messages.edit)
: getAllRequestedSeasons().length >= getAllSeasons().length
? intl.formatMessage(messages.alreadyrequested)
: !settings.currentSettings.partialRequestsEnabled
@@ -396,27 +413,21 @@ const TvRequestModal: React.FC = ({
: `primary`
}
cancelText={
- tvdbId
+ editRequest
+ ? intl.formatMessage(globalMessages.close)
+ : tvdbId
? intl.formatMessage(globalMessages.back)
: intl.formatMessage(globalMessages.cancel)
}
- iconSvg={
-
- }
+ iconSvg={}
>
+ {editRequest
+ ? isOwner
+ ? intl.formatMessage(messages.pendingapproval)
+ : intl.formatMessage(messages.requestfrom, {
+ username: editRequest?.requestedBy.displayName,
+ })
+ : null}
{hasPermission(
[
Permission.MANAGE_REQUESTS,
diff --git a/src/components/ResetPassword/RequestResetLink.tsx b/src/components/ResetPassword/RequestResetLink.tsx
index f9359772d..74c342fa2 100644
--- a/src/components/ResetPassword/RequestResetLink.tsx
+++ b/src/components/ResetPassword/RequestResetLink.tsx
@@ -1,3 +1,4 @@
+import { AtSymbolIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import Link from 'next/link';
@@ -123,6 +124,7 @@ const ResetPassword: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
+
{intl.formatMessage(messages.emailresetlink)}
diff --git a/src/components/Settings/CopyButton.tsx b/src/components/Settings/CopyButton.tsx
index abc5d09de..4ae21190a 100644
--- a/src/components/Settings/CopyButton.tsx
+++ b/src/components/Settings/CopyButton.tsx
@@ -1,7 +1,8 @@
+import { ClipboardCopyIcon } from '@heroicons/react/solid';
import React, { useEffect } from 'react';
-import useClipboard from 'react-use-clipboard';
-import { useToasts } from 'react-toast-notifications';
import { defineMessages, useIntl } from 'react-intl';
+import { useToasts } from 'react-toast-notifications';
+import useClipboard from 'react-use-clipboard';
const messages = defineMessages({
copied: 'Copied API key to clipboard.',
@@ -29,17 +30,9 @@ const CopyButton: React.FC<{ textToCopy: string }> = ({ textToCopy }) => {
e.preventDefault();
setCopied();
}}
- className="-ml-px relative inline-flex items-center px-4 py-2 border border-gray-500 text-sm leading-5 font-medium text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:ring-blue focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"
+ className="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium leading-5 text-white transition duration-150 ease-in-out bg-indigo-600 border border-gray-500 hover:bg-indigo-500 focus:outline-none focus:ring-blue focus:border-blue-300 active:bg-gray-100 active:text-gray-700"
>
-
+
);
};
diff --git a/src/components/Settings/LibraryItem.tsx b/src/components/Settings/LibraryItem.tsx
index d75864542..a1accde47 100644
--- a/src/components/Settings/LibraryItem.tsx
+++ b/src/components/Settings/LibraryItem.tsx
@@ -1,3 +1,4 @@
+import { CheckIcon, XIcon } from '@heroicons/react/solid';
import React from 'react';
interface LibraryItemProps {
@@ -12,8 +13,8 @@ const LibraryItem: React.FC = ({
onToggle,
}) => {
return (
-
-
+
+
{name}
@@ -45,19 +46,7 @@ const LibraryItem: React.FC
= ({
: 'opacity-100 ease-in duration-200'
} absolute inset-0 h-full w-full flex items-center justify-center transition-opacity`}
>
-
+
= ({
: 'opacity-0 ease-out duration-100'
} absolute inset-0 h-full w-full flex items-center justify-center transition-opacity`}
>
-
+
diff --git a/src/components/Settings/Notifications/NotificationsDiscord.tsx b/src/components/Settings/Notifications/NotificationsDiscord.tsx
index ecaff4b05..b70baf286 100644
--- a/src/components/Settings/Notifications/NotificationsDiscord.tsx
+++ b/src/components/Settings/Notifications/NotificationsDiscord.tsx
@@ -18,7 +18,7 @@ const messages = defineMessages({
webhookUrlPlaceholder: 'Server Settings → Integrations → Webhooks',
discordsettingssaved: 'Discord notification settings saved successfully!',
discordsettingsfailed: 'Discord notification settings failed to save.',
- testsent: 'Discord test notification sent!',
+ discordtestsent: 'Discord test notification sent!',
validationUrl: 'You must provide a valid URL',
});
@@ -96,7 +96,7 @@ const NotificationsDiscord: React.FC = () => {
},
});
- addToast(intl.formatMessage(messages.testsent), {
+ addToast(intl.formatMessage(messages.discordtestsent), {
appearance: 'info',
autoDismiss: true,
});
diff --git a/src/components/Settings/Notifications/NotificationsEmail.tsx b/src/components/Settings/Notifications/NotificationsEmail.tsx
index 1daca614f..ac45e3e6b 100644
--- a/src/components/Settings/Notifications/NotificationsEmail.tsx
+++ b/src/components/Settings/Notifications/NotificationsEmail.tsx
@@ -24,7 +24,7 @@ const messages = defineMessages({
authPass: 'SMTP Password',
emailsettingssaved: 'Email notification settings saved successfully!',
emailsettingsfailed: 'Email notification settings failed to save.',
- testsent: 'Email test notification sent!',
+ emailtestsent: 'Email test notification sent!',
allowselfsigned: 'Allow Self-Signed Certificates',
ssldisabletip:
'SSL should be disabled on standard TLS connections (port 587)',
@@ -188,7 +188,7 @@ const NotificationsEmail: React.FC = () => {
},
});
- addToast(intl.formatMessage(messages.testsent), {
+ addToast(intl.formatMessage(messages.emailtestsent), {
appearance: 'info',
autoDismiss: true,
});
diff --git a/src/components/Settings/Notifications/NotificationsTelegram.tsx b/src/components/Settings/Notifications/NotificationsTelegram.tsx
index 72b8d4dda..6f8c230be 100644
--- a/src/components/Settings/Notifications/NotificationsTelegram.tsx
+++ b/src/components/Settings/Notifications/NotificationsTelegram.tsx
@@ -22,7 +22,7 @@ const messages = defineMessages({
validationChatIdRequired: 'You must provide a valid chat ID',
telegramsettingssaved: 'Telegram notification settings saved successfully!',
telegramsettingsfailed: 'Telegram notification settings failed to save.',
- testsent: 'Telegram test notification sent!',
+ telegramtestsent: 'Telegram test notification sent!',
settinguptelegramDescription:
'To configure Telegram notifications, you will need to create a bot and get the bot API key. Additionally, you will need the chat ID for the chat to which you would like to send notifications. You can find this by adding @get_id_bot to the chat and issuing the /my_id
command.',
sendSilently: 'Send Silently',
@@ -113,7 +113,7 @@ const NotificationsTelegram: React.FC = () => {
},
});
- addToast(intl.formatMessage(messages.testsent), {
+ addToast(intl.formatMessage(messages.telegramtestsent), {
appearance: 'info',
autoDismiss: true,
});
diff --git a/src/components/Settings/Notifications/NotificationsWebhook/index.tsx b/src/components/Settings/Notifications/NotificationsWebhook/index.tsx
index 5ad3bacf4..8b6dffad7 100644
--- a/src/components/Settings/Notifications/NotificationsWebhook/index.tsx
+++ b/src/components/Settings/Notifications/NotificationsWebhook/index.tsx
@@ -1,3 +1,4 @@
+import { QuestionMarkCircleIcon, RefreshIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import dynamic from 'next/dynamic';
@@ -232,18 +233,7 @@ const NotificationsWebhook: React.FC = () => {
}}
className="mr-2"
>
-
+
{intl.formatMessage(messages.resetPayload)}
{
rel="noreferrer"
className="inline-flex items-center justify-center font-medium leading-5 text-white transition duration-150 ease-in-out bg-indigo-600 border border-transparent rounded-md focus:outline-none hover:bg-indigo-500 focus:border-indigo-700 focus:ring-indigo active:bg-indigo-700 disabled:opacity-50 px-2.5 py-1.5 text-xs"
>
-
+
{intl.formatMessage(messages.templatevariablehelp)}
diff --git a/src/components/Settings/RadarrModal/index.tsx b/src/components/Settings/RadarrModal/index.tsx
index bf3b0f20d..5ff9b711f 100644
--- a/src/components/Settings/RadarrModal/index.tsx
+++ b/src/components/Settings/RadarrModal/index.tsx
@@ -1,3 +1,4 @@
+import { PencilIcon, PlusIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Formik } from 'formik';
import dynamic from 'next/dynamic';
@@ -62,7 +63,7 @@ const messages = defineMessages({
loadingTags: 'Loading tags…',
testFirstTags: 'Test connection to load tags',
tags: 'Tags',
- preventSearch: 'Disable Auto-Search',
+ enableSearch: 'Enable Automatic Search',
validationApplicationUrl: 'You must provide a valid URL',
validationApplicationUrlTrailingSlash: 'URL must not end in a trailing slash',
validationBaseUrlLeadingSlash: 'Base URL must have a leading slash',
@@ -256,8 +257,8 @@ const RadarrModal: React.FC = ({
isDefault: radarr?.isDefault ?? false,
is4k: radarr?.is4k ?? false,
externalUrl: radarr?.externalUrl,
- syncEnabled: radarr?.syncEnabled,
- preventSearch: radarr?.preventSearch,
+ syncEnabled: radarr?.syncEnabled ?? false,
+ enableSearch: !radarr?.preventSearch,
}}
validationSchema={RadarrSettingsSchema}
onSubmit={async (values) => {
@@ -282,7 +283,7 @@ const RadarrModal: React.FC = ({
isDefault: values.isDefault,
externalUrl: values.externalUrl,
syncEnabled: values.syncEnabled,
- preventSearch: values.preventSearch,
+ preventSearch: !values.enableSearch,
};
if (!radarr) {
await axios.post('/api/v1/settings/radarr', submission);
@@ -356,6 +357,13 @@ const RadarrModal: React.FC = ({
values.is4k ? messages.edit4kradarr : messages.editradarr
)
}
+ iconSvg={
+ !radarr ? (
+
+ ) : (
+
+ )
+ }
>
@@ -701,14 +709,14 @@ const RadarrModal: React.FC = ({
-
diff --git a/src/components/Settings/SettingsAbout/Releases/index.tsx b/src/components/Settings/SettingsAbout/Releases/index.tsx
index 1230185e3..49a0c88b9 100644
--- a/src/components/Settings/SettingsAbout/Releases/index.tsx
+++ b/src/components/Settings/SettingsAbout/Releases/index.tsx
@@ -1,3 +1,4 @@
+import { DocumentTextIcon } from '@heroicons/react/outline';
import React, { useState } from 'react';
import { defineMessages, FormattedRelativeTime, useIntl } from 'react-intl';
import ReactMarkdown from 'react-markdown';
@@ -70,22 +71,7 @@ const Release: React.FC = ({
>
setModalOpen(false)}
- iconSvg={
-
- }
+ iconSvg={}
title={intl.formatMessage(messages.versionChangelog)}
cancelText={intl.formatMessage(globalMessages.close)}
okText={intl.formatMessage(messages.viewongithub)}
@@ -126,6 +112,7 @@ const Release: React.FC = ({
diff --git a/src/components/Settings/SettingsJobsCache/index.tsx b/src/components/Settings/SettingsJobsCache/index.tsx
index 46d0cd9d7..992e3ac47 100644
--- a/src/components/Settings/SettingsJobsCache/index.tsx
+++ b/src/components/Settings/SettingsJobsCache/index.tsx
@@ -1,3 +1,4 @@
+import { PlayIcon, StopIcon, TrashIcon } from '@heroicons/react/outline';
import axios from 'axios';
import React from 'react';
import {
@@ -146,12 +147,12 @@ const SettingsJobs: React.FC = () => {
- {job.running && }
{intl.formatMessage(
messages[job.id] ?? messages.unknownJob
)}
+ {job.running && }
@@ -180,10 +181,12 @@ const SettingsJobs: React.FC = () => {
{job.running ? (
) : (
)}
@@ -223,6 +226,7 @@ const SettingsJobs: React.FC = () => {
{formatBytes(cache.stats.vsize)}
diff --git a/src/components/Settings/SettingsLogs/index.tsx b/src/components/Settings/SettingsLogs/index.tsx
index fe1845c27..a4aaf755e 100644
--- a/src/components/Settings/SettingsLogs/index.tsx
+++ b/src/components/Settings/SettingsLogs/index.tsx
@@ -1,3 +1,10 @@
+import {
+ ClipboardCopyIcon,
+ DocumentSearchIcon,
+ FilterIcon,
+ PauseIcon,
+ PlayIcon,
+} from '@heroicons/react/solid';
import copy from 'copy-to-clipboard';
import { useRouter } from 'next/router';
import React, { useEffect, useState } from 'react';
@@ -135,6 +142,7 @@ const SettingsLogs: React.FC = () => {
>
}
onCancel={() => setActiveLog(null)}
cancelText={intl.formatMessage(globalMessages.close)}
onOk={() => (activeLog ? copyLogString(activeLog) : undefined)}
@@ -237,31 +245,9 @@ const SettingsLogs: React.FC = () => {
>
{refreshInterval ? (
-
+
) : (
-
+
)}
@@ -273,18 +259,7 @@ const SettingsLogs: React.FC = () => {
-
+
diff --git a/src/components/Settings/SettingsMain.tsx b/src/components/Settings/SettingsMain.tsx
index 177efd53f..d3a669317 100644
--- a/src/components/Settings/SettingsMain.tsx
+++ b/src/components/Settings/SettingsMain.tsx
@@ -1,3 +1,4 @@
+import { RefreshIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useMemo } from 'react';
@@ -204,18 +205,7 @@ const SettingsMain: React.FC = () => {
}}
className="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium leading-5 text-white transition duration-150 ease-in-out bg-indigo-600 border border-gray-500 rounded-r-md hover:bg-indigo-500 focus:outline-none focus:ring-blue focus:border-blue-300 active:bg-gray-100 active:text-gray-700"
>
-
+
diff --git a/src/components/Settings/SettingsNotifications.tsx b/src/components/Settings/SettingsNotifications.tsx
index e5a3bf9aa..3c73c001b 100644
--- a/src/components/Settings/SettingsNotifications.tsx
+++ b/src/components/Settings/SettingsNotifications.tsx
@@ -1,6 +1,7 @@
+import { AtSymbolIcon } from '@heroicons/react/outline';
+import { LightningBoltIcon } from '@heroicons/react/solid';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
-import Bolt from '../../assets/bolt.svg';
import DiscordLogo from '../../assets/extlogos/discord.svg';
import PushbulletLogo from '../../assets/extlogos/pushbullet.svg';
import PushoverLogo from '../../assets/extlogos/pushover.svg';
@@ -27,20 +28,7 @@ const SettingsNotifications: React.FC = ({ children }) => {
text: intl.formatMessage(messages.email),
content: (
-
+
{intl.formatMessage(messages.email)}
),
@@ -106,7 +94,7 @@ const SettingsNotifications: React.FC = ({ children }) => {
text: intl.formatMessage(messages.webhook),
content: (
-
+
{intl.formatMessage(messages.webhook)}
),
diff --git a/src/components/Settings/SettingsPlex.tsx b/src/components/Settings/SettingsPlex.tsx
index d410bb493..59ba75af4 100644
--- a/src/components/Settings/SettingsPlex.tsx
+++ b/src/components/Settings/SettingsPlex.tsx
@@ -1,5 +1,7 @@
+import { RefreshIcon, SearchIcon, XIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Formik } from 'formik';
+import { orderBy } from 'lodash';
import React, { useMemo, useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { useToasts } from 'react-toast-notifications';
@@ -7,7 +9,6 @@ import useSWR from 'swr';
import * as Yup from 'yup';
import type { PlexDevice } from '../../../server/interfaces/api/plexInterfaces';
import type { PlexSettings } from '../../../server/lib/settings';
-import Spinner from '../../assets/spinner.svg';
import globalMessages from '../../i18n/globalMessages';
import Alert from '../Common/Alert';
import Badge from '../Common/Badge';
@@ -28,7 +29,7 @@ const messages = defineMessages({
serverpresetPlaceholder: 'Plex Server',
serverLocal: 'local',
serverRemote: 'remote',
- serverConnected: 'connected',
+ serverSecure: 'secure',
serverpresetManualMessage: 'Manual configuration',
serverpresetRefreshing: 'Retrieving servers…',
serverpresetLoad: 'Press the button to load available servers',
@@ -131,7 +132,7 @@ const SettingsPlex: React.FC = ({ onComplete }) => {
dev.connection.forEach((conn) =>
finalPresets.push({
name: dev.name,
- ssl: !conn.local && conn.protocol === 'https',
+ ssl: conn.protocol === 'https',
uri: conn.uri,
address: conn.address,
port: conn.port,
@@ -141,14 +142,8 @@ const SettingsPlex: React.FC = ({ onComplete }) => {
})
);
});
- finalPresets.sort((a, b) => {
- if (a.status && !b.status) {
- return -1;
- } else {
- return 1;
- }
- });
- return finalPresets;
+
+ return orderBy(finalPresets, ['status', 'ssl'], ['desc', 'desc']);
}, [availableServers]);
const syncLibraries = async () => {
@@ -420,7 +415,13 @@ const SettingsPlex: React.FC = ({ onComplete }) => {
server.local
? intl.formatMessage(messages.serverLocal)
: intl.formatMessage(messages.serverRemote)
- }]
+ }]${
+ server.ssl
+ ? ` [${intl.formatMessage(
+ messages.serverSecure
+ )}]`
+ : ''
+ }
${server.status ? '' : '(' + server.message + ')'}
`}
@@ -433,22 +434,12 @@ const SettingsPlex: React.FC = ({ onComplete }) => {
}}
className="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium leading-5 text-white transition duration-150 ease-in-out bg-indigo-600 border border-gray-500 rounded-r-md hover:bg-indigo-500 focus:outline-none focus:ring-blue focus:border-blue-300 active:bg-gray-100 active:text-gray-700"
>
- {isRefreshingPresets ? (
-
- ) : (
-
- )}
+
@@ -538,18 +529,10 @@ const SettingsPlex: React.FC = ({ onComplete }) => {
@@ -278,6 +257,7 @@ const SettingsServices: React.FC = () => {
})
}
title="Delete Server"
+ iconSvg={}
>
{intl.formatMessage(messages.deleteserverconfirm)}
@@ -343,18 +323,7 @@ const SettingsServices: React.FC = () => {
setEditRadarrModal({ open: true, radarr: null })
}
>
-
+
{intl.formatMessage(messages.addradarr)}
@@ -434,18 +403,7 @@ const SettingsServices: React.FC = () => {
setEditSonarrModal({ open: true, sonarr: null })
}
>
-
+
{intl.formatMessage(messages.addsonarr)}
diff --git a/src/components/Settings/SonarrModal/index.tsx b/src/components/Settings/SonarrModal/index.tsx
index 429a0fb62..02c8b0c3a 100644
--- a/src/components/Settings/SonarrModal/index.tsx
+++ b/src/components/Settings/SonarrModal/index.tsx
@@ -1,3 +1,4 @@
+import { PencilIcon, PlusIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Formik } from 'formik';
import dynamic from 'next/dynamic';
@@ -66,7 +67,7 @@ const messages = defineMessages({
syncEnabled: 'Enable Scan',
externalUrl: 'External URL',
externalUrlPlaceholder: 'External URL pointing to your Sonarr server',
- preventSearch: 'Disable Auto-Search',
+ enableSearch: 'Enable Automatic Search',
validationApplicationUrl: 'You must provide a valid URL',
validationApplicationUrlTrailingSlash: 'URL must not end in a trailing slash',
validationBaseUrlLeadingSlash: 'Base URL must have a leading slash',
@@ -273,7 +274,7 @@ const SonarrModal: React.FC = ({
enableSeasonFolders: sonarr?.enableSeasonFolders ?? false,
externalUrl: sonarr?.externalUrl,
syncEnabled: sonarr?.syncEnabled ?? false,
- preventSearch: sonarr?.preventSearch ?? false,
+ enableSearch: !sonarr?.preventSearch,
}}
validationSchema={SonarrSettingsSchema}
onSubmit={async (values) => {
@@ -313,7 +314,7 @@ const SonarrModal: React.FC = ({
enableSeasonFolders: values.enableSeasonFolders,
externalUrl: values.externalUrl,
syncEnabled: values.syncEnabled,
- preventSearch: values.preventSearch,
+ preventSearch: !values.enableSearch,
};
if (!sonarr) {
await axios.post('/api/v1/settings/sonarr', submission);
@@ -387,6 +388,13 @@ const SonarrModal: React.FC = ({
values.is4k ? messages.edit4ksonarr : messages.editsonarr
)
}
+ iconSvg={
+ !sonarr ? (
+
+ ) : (
+
+ )
+ }
>
@@ -953,14 +961,14 @@ const SonarrModal: React.FC = ({
-
- {intl.formatMessage(messages.preventSearch)}
+
+ {intl.formatMessage(messages.enableSearch)}
-
diff --git a/src/components/Setup/SetupSteps.tsx b/src/components/Setup/SetupSteps.tsx
index 2429e3ca2..df65f56b4 100644
--- a/src/components/Setup/SetupSteps.tsx
+++ b/src/components/Setup/SetupSteps.tsx
@@ -1,3 +1,4 @@
+import { CheckIcon } from '@heroicons/react/solid';
import React from 'react';
interface CurrentStep {
@@ -17,26 +18,13 @@ const SetupSteps: React.FC = ({
}) => {
return (
-
+
- {completed && (
-
- )}
+ {completed &&
}
{!completed && (
{stepNumber}
@@ -53,9 +41,9 @@ const SetupSteps: React.FC = ({
{!isLastStep && (
-
+
{
show={data.commitTag !== process.env.commitTag}
>
-
-
- }
+ iconSvg={}
title={intl.formatMessage(messages.newversionavailable)}
onOk={() => location.reload()}
okText={intl.formatMessage(messages.reloadOverseerr)}
diff --git a/src/components/TitleCard/index.tsx b/src/components/TitleCard/index.tsx
index d009d6fe8..a99dee1d8 100644
--- a/src/components/TitleCard/index.tsx
+++ b/src/components/TitleCard/index.tsx
@@ -1,3 +1,5 @@
+import { DownloadIcon } from '@heroicons/react/outline';
+import { BellIcon, CheckIcon, ClockIcon } from '@heroicons/react/solid';
import Link from 'next/link';
import React, { useCallback, useEffect, useState } from 'react';
import { useIntl } from 'react-intl';
@@ -128,32 +130,12 @@ const TitleCard: React.FC = ({
{(currentStatus === MediaStatus.AVAILABLE ||
currentStatus === MediaStatus.PARTIALLY_AVAILABLE) && (
)}
{currentStatus === MediaStatus.PENDING && (
)}
{currentStatus === MediaStatus.PROCESSING && (
@@ -161,18 +143,7 @@ const TitleCard: React.FC = ({
{inProgress ? (
) : (
-
-
-
+
)}
)}
@@ -265,20 +236,7 @@ const TitleCard: React.FC
= ({
}}
className="flex items-center justify-center w-full text-white transition duration-150 ease-in-out bg-indigo-600 rounded-md h-7 hover:bg-indigo-500 focus:border-indigo-700 focus:ring-indigo active:bg-indigo-700"
>
-
-
-
+
{intl.formatMessage(globalMessages.request)}
diff --git a/src/components/Toast/index.tsx b/src/components/Toast/index.tsx
index 5e94e3e14..aaad91a33 100644
--- a/src/components/Toast/index.tsx
+++ b/src/components/Toast/index.tsx
@@ -1,98 +1,41 @@
+import {
+ CheckCircleIcon,
+ ExclamationCircleIcon,
+ ExclamationIcon,
+ InformationCircleIcon,
+} from '@heroicons/react/outline';
+import { XIcon } from '@heroicons/react/solid';
import React from 'react';
import type { ToastProps } from 'react-toast-notifications';
const Toast: React.FC = ({ appearance, children, onDismiss }) => {
return (
-
-
-
+
+
+
{appearance === 'success' && (
-
-
-
+
)}
-
{appearance === 'error' && (
-
-
-
+
)}
-
{appearance === 'info' && (
-
-
-
+
)}
-
{appearance === 'warning' && (
-
-
-
+
)}
-
{children}
-
+
{children}
+
onDismiss()}
- className="inline-flex text-gray-400 focus:outline-none focus:text-gray-500 transition ease-in-out duration-150"
+ className="inline-flex text-gray-400 transition duration-150 ease-in-out focus:outline-none focus:text-gray-500"
>
-
-
-
+
diff --git a/src/components/TvDetails/index.tsx b/src/components/TvDetails/index.tsx
index 9632c56b5..69c0e9c39 100644
--- a/src/components/TvDetails/index.tsx
+++ b/src/components/TvDetails/index.tsx
@@ -1,3 +1,14 @@
+import {
+ ArrowCircleRightIcon,
+ CogIcon,
+ FilmIcon,
+ PlayIcon,
+} from '@heroicons/react/outline';
+import {
+ CheckCircleIcon,
+ DocumentRemoveIcon,
+ ExternalLinkIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
import Link from 'next/link';
import { useRouter } from 'next/router';
@@ -50,7 +61,7 @@ const messages = defineMessages({
manageModalTitle: 'Manage Series',
manageModalRequests: 'Requests',
manageModalNoRequests: 'No requests.',
- manageModalClearMedia: 'Clear All Media Data',
+ manageModalClearMedia: 'Clear Media Data',
manageModalClearMediaWarning:
'* This will irreversibly remove all data for this TV series, including any requests. If this item exists in your Plex library, the media information will be recreated during the next scan.',
originaltitle: 'Original Title',
@@ -113,6 +124,7 @@ const TvDetails: React.FC
= ({ tv }) => {
mediaLinks.push({
text: intl.formatMessage(messages.playonplex),
url: data.mediaInfo?.plexUrl,
+ svg: ,
});
}
@@ -125,6 +137,7 @@ const TvDetails: React.FC = ({ tv }) => {
mediaLinks.push({
text: intl.formatMessage(messages.play4konplex),
url: data.mediaInfo?.plexUrl4k,
+ svg: ,
});
}
@@ -137,6 +150,7 @@ const TvDetails: React.FC = ({ tv }) => {
mediaLinks.push({
text: intl.formatMessage(messages.watchtrailer),
url: trailerUrl,
+ svg: ,
});
}
@@ -302,18 +316,7 @@ const TvDetails: React.FC = ({ tv }) => {
className="w-full sm:mb-0"
buttonType="success"
>
-
-
-
+
{intl.formatMessage(messages.markavailable)}
@@ -327,18 +330,7 @@ const TvDetails: React.FC
= ({ tv }) => {
className="w-full sm:mb-0"
buttonType="success"
>
-
-
-
+
{intl.formatMessage(messages.mark4kavailable)}
@@ -380,15 +372,7 @@ const TvDetails: React.FC = ({ tv }) => {
className="block mb-2 last:mb-0"
>
-
-
-
-
+
{intl.formatMessage(messages.opensonarr)}
@@ -400,15 +384,7 @@ const TvDetails: React.FC = ({ tv }) => {
rel="noreferrer"
>
-
-
-
-
+
{intl.formatMessage(messages.opensonarr4k)}
@@ -422,6 +398,7 @@ const TvDetails: React.FC = ({ tv }) => {
confirmText={intl.formatMessage(globalMessages.areyousure)}
className="w-full"
>
+
{intl.formatMessage(messages.manageModalClearMedia)}
@@ -501,26 +478,7 @@ const TvDetails: React.FC
= ({ tv }) => {
className="ml-2 first:ml-0"
onClick={() => setShowManager(true)}
>
-
-
-
-
+
)}
@@ -564,20 +522,7 @@ const TvDetails: React.FC = ({ tv }) => {
{intl.formatMessage(messages.viewfullcrew)}
-
-
-
+
@@ -734,20 +679,7 @@ const TvDetails: React.FC
= ({ tv }) => {
{intl.formatMessage(messages.cast)}
-
-
-
+
diff --git a/src/components/UserList/BulkEditModal.tsx b/src/components/UserList/BulkEditModal.tsx
index 96e80524a..17473ec6b 100644
--- a/src/components/UserList/BulkEditModal.tsx
+++ b/src/components/UserList/BulkEditModal.tsx
@@ -1,3 +1,4 @@
+import { PencilIcon } from '@heroicons/react/solid';
import axios from 'axios';
import React, { useEffect, useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -84,6 +85,7 @@ const BulkEditModal: React.FC
= ({
return (
}
onOk={() => {
updateUsers();
}}
diff --git a/src/components/UserList/index.tsx b/src/components/UserList/index.tsx
index 50f10d70a..a0a667582 100644
--- a/src/components/UserList/index.tsx
+++ b/src/components/UserList/index.tsx
@@ -1,3 +1,10 @@
+import { TrashIcon } from '@heroicons/react/outline';
+import {
+ InboxInIcon,
+ PencilIcon,
+ SortDescendingIcon,
+ UserAddIcon,
+} from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import Link from 'next/link';
@@ -10,7 +17,6 @@ import * as Yup from 'yup';
import type { UserResultsResponse } from '../../../server/interfaces/api/userInterfaces';
import { UserSettingsNotificationsResponse } from '../../../server/interfaces/api/userSettingsInterfaces';
import { hasPermission } from '../../../server/lib/permissions';
-import AddUserIcon from '../../assets/useradd.svg';
import { useUpdateQueryParams } from '../../hooks/useUpdateQueryParams';
import { Permission, User, UserType, useUser } from '../../hooks/useUser';
import globalMessages from '../../i18n/globalMessages';
@@ -56,6 +62,8 @@ const messages = defineMessages({
validationpasswordminchars:
'Password is too short; should be a minimum of 8 characters',
usercreatedfailed: 'Something went wrong while creating the user.',
+ usercreatedfailedexisting:
+ 'The provided email address is already in use by another user.',
usercreatedsuccess: 'User created successfully!',
email: 'Email Address',
password: 'Password',
@@ -265,22 +273,7 @@ const UserList: React.FC = () => {
okButtonType="danger"
onCancel={() => setDeleteModal({ isOpen: false })}
title={intl.formatMessage(messages.deleteuser)}
- iconSvg={
-
-
-
- }
+ iconSvg={}
>
{intl.formatMessage(messages.deleteconfirm)}
@@ -314,10 +307,17 @@ const UserList: React.FC = () => {
});
setCreateModal({ isOpen: false });
} catch (e) {
- addToast(intl.formatMessage(messages.usercreatedfailed), {
- appearance: 'error',
- autoDismiss: true,
- });
+ addToast(
+ intl.formatMessage(
+ e.response.data.errors?.includes('USER_EXISTS')
+ ? messages.usercreatedfailedexisting
+ : messages.usercreatedfailed
+ ),
+ {
+ appearance: 'error',
+ autoDismiss: true,
+ }
+ );
} finally {
revalidate();
}
@@ -335,7 +335,7 @@ const UserList: React.FC = () => {
return (
}
+ iconSvg={}
onOk={() => handleSubmit()}
okText={
isSubmitting
@@ -445,12 +445,13 @@ const UserList: React.FC = () => {
{intl.formatMessage(messages.userlist)}
-
+
setCreateModal({ isOpen: true })}
>
+
{intl.formatMessage(messages.createlocaluser)}
{
disabled={isImporting}
onClick={() => importFromPlex()}
>
+
{intl.formatMessage(messages.importfromplex)}
-
-
-
+
diff --git a/src/i18n/globalMessages.ts b/src/i18n/globalMessages.ts
index 884acc4ad..4c0ef7905 100644
--- a/src/i18n/globalMessages.ts
+++ b/src/i18n/globalMessages.ts
@@ -9,7 +9,7 @@ const globalMessages = defineMessages({
requested: 'Requested',
requesting: 'Requesting…',
request: 'Request',
- request4k: 'Request 4K',
+ request4k: 'Request in 4K',
failed: 'Failed',
pending: 'Pending',
declined: 'Declined',
@@ -24,6 +24,7 @@ const globalMessages = defineMessages({
decline: 'Decline',
delete: 'Delete',
retry: 'Retry',
+ retrying: 'Retrying…',
view: 'View',
deleting: 'Deleting…',
test: 'Test',
diff --git a/src/i18n/locale/en.json b/src/i18n/locale/en.json
index 60c7ce3e5..c095ced79 100644
--- a/src/i18n/locale/en.json
+++ b/src/i18n/locale/en.json
@@ -52,7 +52,7 @@
"components.Login.loginerror": "Something went wrong while trying to sign in.",
"components.Login.password": "Password",
"components.Login.signin": "Sign In",
- "components.Login.signingin": "Signing in…",
+ "components.Login.signingin": "Signing In…",
"components.Login.signinheader": "Sign in to continue",
"components.Login.signinwithoverseerr": "Use your {applicationTitle} account",
"components.Login.signinwithplex": "Use your Plex account",
@@ -64,7 +64,7 @@
"components.MovieDetails.budget": "Budget",
"components.MovieDetails.cast": "Cast",
"components.MovieDetails.downloadstatus": "Download Status",
- "components.MovieDetails.manageModalClearMedia": "Clear All Media Data",
+ "components.MovieDetails.manageModalClearMedia": "Clear Media Data",
"components.MovieDetails.manageModalClearMediaWarning": "* This will irreversibly remove all data for this movie, including any requests. If this item exists in your Plex library, the media information will be recreated during the next scan.",
"components.MovieDetails.manageModalNoRequests": "No requests.",
"components.MovieDetails.manageModalRequests": "Requests",
@@ -140,7 +140,7 @@
"components.PersonDetails.birthdate": "Born {birthdate}",
"components.PersonDetails.crewmember": "Crew",
"components.PersonDetails.lifespan": "{birthdate} – {deathdate}",
- "components.PlexLoginButton.signingin": "Signing in…",
+ "components.PlexLoginButton.signingin": "Signing In…",
"components.PlexLoginButton.signinwithplex": "Sign In",
"components.QuotaSelector.movieRequestLimit": "{quotaLimit} movie(s) per {quotaDays} day(s)",
"components.QuotaSelector.tvRequestLimit": "{quotaLimit} season(s) per {quotaDays} day(s)",
@@ -152,16 +152,16 @@
"components.RequestBlock.rootfolder": "Root Folder",
"components.RequestBlock.seasons": "{seasonCount, plural, one {Season} other {Seasons}}",
"components.RequestBlock.server": "Destination Server",
- "components.RequestButton.approve4krequests": "Approve {requestCount} 4K {requestCount, plural, one {Request} other {Requests}}",
+ "components.RequestButton.approve4krequests": "Approve {requestCount, plural, one {4K Request} other {{requestCount} 4K Requests}}",
"components.RequestButton.approverequest": "Approve Request",
"components.RequestButton.approverequest4k": "Approve 4K Request",
- "components.RequestButton.approverequests": "Approve {requestCount} {requestCount, plural, one {Request} other {Requests}}",
- "components.RequestButton.decline4krequests": "Decline {requestCount} 4K {requestCount, plural, one {Request} other {Requests}}",
+ "components.RequestButton.approverequests": "Approve {requestCount, plural, one {Request} other {{requestCount} Requests}}",
+ "components.RequestButton.decline4krequests": "Decline {requestCount, plural, one {4K Request} other {{requestCount} 4K Requests}}",
"components.RequestButton.declinerequest": "Decline Request",
"components.RequestButton.declinerequest4k": "Decline 4K Request",
- "components.RequestButton.declinerequests": "Decline {requestCount} {requestCount, plural, one {Request} other {Requests}}",
+ "components.RequestButton.declinerequests": "Decline {requestCount, plural, one {Request} other {{requestCount} Requests}}",
"components.RequestButton.requestmore": "Request More",
- "components.RequestButton.requestmore4k": "Request More 4K",
+ "components.RequestButton.requestmore4k": "Request More in 4K",
"components.RequestButton.viewrequest": "View Request",
"components.RequestButton.viewrequest4k": "View 4K Request",
"components.RequestCard.deleterequest": "Delete Request",
@@ -169,6 +169,7 @@
"components.RequestCard.seasons": "{seasonCount, plural, one {Season} other {Seasons}}",
"components.RequestList.RequestItem.cancelRequest": "Cancel Request",
"components.RequestList.RequestItem.deleterequest": "Delete Request",
+ "components.RequestList.RequestItem.editrequest": "Edit Request",
"components.RequestList.RequestItem.failedretry": "Something went wrong while retrying the request.",
"components.RequestList.RequestItem.mediaerror": "The associated title for this request is no longer available.",
"components.RequestList.RequestItem.modified": "Modified",
@@ -208,13 +209,13 @@
"components.RequestModal.alreadyrequested": "Already Requested",
"components.RequestModal.autoapproval": "Automatic Approval",
"components.RequestModal.cancel": "Cancel Request",
+ "components.RequestModal.edit": "Edit Request",
"components.RequestModal.errorediting": "Something went wrong while editing the request.",
"components.RequestModal.extras": "Extras",
"components.RequestModal.numberofepisodes": "# of Episodes",
- "components.RequestModal.pending4krequest": "Pending Request for {title} in 4K",
+ "components.RequestModal.pending4krequest": "Pending 4K Request for {title}",
"components.RequestModal.pendingapproval": "Your request is pending approval.",
"components.RequestModal.pendingrequest": "Pending Request for {title}",
- "components.RequestModal.request4kfrom": "There is currently a pending 4K request from {username}.",
"components.RequestModal.request4ktitle": "Request {title} in 4K",
"components.RequestModal.requestCancel": "Request for
{title} canceled.",
"components.RequestModal.requestSuccess": "
{title} requested successfully!",
@@ -223,7 +224,7 @@
"components.RequestModal.requestcancelled": "Request for
{title} canceled.",
"components.RequestModal.requestedited": "Request for
{title} edited successfully!",
"components.RequestModal.requesterror": "Something went wrong while submitting the request.",
- "components.RequestModal.requestfrom": "There is currently a pending request from {username}.",
+ "components.RequestModal.requestfrom": "{username}'s request is pending approval.",
"components.RequestModal.requestseasons": "Request {seasonCount} {seasonCount, plural, one {Season} other {Seasons}}",
"components.RequestModal.requesttitle": "Request {title}",
"components.RequestModal.season": "Season",
@@ -290,11 +291,13 @@
"components.Settings.Notifications.chatId": "Chat ID",
"components.Settings.Notifications.discordsettingsfailed": "Discord notification settings failed to save.",
"components.Settings.Notifications.discordsettingssaved": "Discord notification settings saved successfully!",
+ "components.Settings.Notifications.discordtestsent": "Discord test notification sent!",
"components.Settings.Notifications.emailNotificationTypesAlertDescription": "
Media Requested,
Media Automatically Approved, and
Media Failed email notifications are sent to all users with the
Manage Requests permission.",
"components.Settings.Notifications.emailNotificationTypesAlertDescriptionPt2": "
Media Approved,
Media Declined, and
Media Available email notifications are sent to the user who submitted the request.",
"components.Settings.Notifications.emailsender": "Sender Address",
"components.Settings.Notifications.emailsettingsfailed": "Email notification settings failed to save.",
"components.Settings.Notifications.emailsettingssaved": "Email notification settings saved successfully!",
+ "components.Settings.Notifications.emailtestsent": "Email test notification sent!",
"components.Settings.Notifications.enableSsl": "Enable SSL",
"components.Settings.Notifications.pgpPassword": "PGP Password",
"components.Settings.Notifications.pgpPasswordTip": "Sign encrypted email messages using
OpenPGP",
@@ -309,7 +312,7 @@
"components.Settings.Notifications.ssldisabletip": "SSL should be disabled on standard TLS connections (port 587)",
"components.Settings.Notifications.telegramsettingsfailed": "Telegram notification settings failed to save.",
"components.Settings.Notifications.telegramsettingssaved": "Telegram notification settings saved successfully!",
- "components.Settings.Notifications.testsent": "Telegram test notification sent!",
+ "components.Settings.Notifications.telegramtestsent": "Telegram test notification sent!",
"components.Settings.Notifications.validationBotAPIRequired": "You must provide a bot authentication token",
"components.Settings.Notifications.validationChatIdRequired": "You must provide a valid chat ID",
"components.Settings.Notifications.validationEmail": "You must provide a valid email address",
@@ -331,6 +334,7 @@
"components.Settings.RadarrModal.defaultserver": "Default Server",
"components.Settings.RadarrModal.edit4kradarr": "Edit 4K Radarr Server",
"components.Settings.RadarrModal.editradarr": "Edit Radarr Server",
+ "components.Settings.RadarrModal.enableSearch": "Enable Automatic Search",
"components.Settings.RadarrModal.externalUrl": "External URL",
"components.Settings.RadarrModal.externalUrlPlaceholder": "External URL pointing to your Radarr server",
"components.Settings.RadarrModal.hostname": "Hostname or IP Address",
@@ -340,7 +344,6 @@
"components.Settings.RadarrModal.minimumAvailability": "Minimum Availability",
"components.Settings.RadarrModal.notagoptions": "No tags.",
"components.Settings.RadarrModal.port": "Port",
- "components.Settings.RadarrModal.preventSearch": "Disable Auto-Search",
"components.Settings.RadarrModal.qualityprofile": "Quality Profile",
"components.Settings.RadarrModal.rootfolder": "Root Folder",
"components.Settings.RadarrModal.selectMinimumAvailability": "Select minimum availability",
@@ -461,6 +464,7 @@
"components.Settings.SonarrModal.defaultserver": "Default Server",
"components.Settings.SonarrModal.edit4ksonarr": "Edit 4K Sonarr Server",
"components.Settings.SonarrModal.editsonarr": "Edit Sonarr Server",
+ "components.Settings.SonarrModal.enableSearch": "Enable Automatic Search",
"components.Settings.SonarrModal.externalUrl": "External URL",
"components.Settings.SonarrModal.externalUrlPlaceholder": "External URL pointing to your Sonarr server",
"components.Settings.SonarrModal.hostname": "Hostname or IP Address",
@@ -471,7 +475,6 @@
"components.Settings.SonarrModal.loadingrootfolders": "Loading root folders…",
"components.Settings.SonarrModal.notagoptions": "No tags.",
"components.Settings.SonarrModal.port": "Port",
- "components.Settings.SonarrModal.preventSearch": "Disable Auto-Search",
"components.Settings.SonarrModal.qualityprofile": "Quality Profile",
"components.Settings.SonarrModal.rootfolder": "Root Folder",
"components.Settings.SonarrModal.seasonfolders": "Season Folders",
@@ -560,9 +563,9 @@
"components.Settings.regionTip": "Filter content by regional availability",
"components.Settings.scan": "Sync Libraries",
"components.Settings.scanning": "Syncing…",
- "components.Settings.serverConnected": "connected",
"components.Settings.serverLocal": "local",
"components.Settings.serverRemote": "remote",
+ "components.Settings.serverSecure": "secure",
"components.Settings.servername": "Server Name",
"components.Settings.servernamePlaceholder": "Plex Server Name",
"components.Settings.servernameTip": "Automatically retrieved from Plex after saving",
@@ -620,7 +623,7 @@
"components.TvDetails.episodeRuntime": "Episode Runtime",
"components.TvDetails.episodeRuntimeMinutes": "{runtime} minutes",
"components.TvDetails.firstAirDate": "First Air Date",
- "components.TvDetails.manageModalClearMedia": "Clear All Media Data",
+ "components.TvDetails.manageModalClearMedia": "Clear Media Data",
"components.TvDetails.manageModalClearMediaWarning": "* This will irreversibly remove all data for this TV series, including any requests. If this item exists in your Plex library, the media information will be recreated during the next scan.",
"components.TvDetails.manageModalNoRequests": "No requests.",
"components.TvDetails.manageModalRequests": "Requests",
@@ -675,6 +678,7 @@
"components.UserList.totalrequests": "Total Requests",
"components.UserList.user": "User",
"components.UserList.usercreatedfailed": "Something went wrong while creating the user.",
+ "components.UserList.usercreatedfailedexisting": "The provided email address is already in use by another user.",
"components.UserList.usercreatedsuccess": "User created successfully!",
"components.UserList.userdeleted": "User deleted successfully!",
"components.UserList.userdeleteerror": "Something went wrong while deleting the user.",
@@ -794,11 +798,12 @@
"i18n.previous": "Previous",
"i18n.processing": "Processing",
"i18n.request": "Request",
- "i18n.request4k": "Request 4K",
+ "i18n.request4k": "Request in 4K",
"i18n.requested": "Requested",
"i18n.requesting": "Requesting…",
"i18n.resultsperpage": "Display {pageSize} results per page",
"i18n.retry": "Retry",
+ "i18n.retrying": "Retrying…",
"i18n.save": "Save Changes",
"i18n.saving": "Saving…",
"i18n.settings": "Settings",
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index 900f17af3..da7507505 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -1,3 +1,4 @@
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
import Link from 'next/link';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -22,22 +23,9 @@ const Custom404: React.FC = () => {
})}
-
+
{intl.formatMessage(messages.returnHome)}
-
-
-
+
diff --git a/src/pages/_error.tsx b/src/pages/_error.tsx
index bb24b57fb..c1960638c 100644
--- a/src/pages/_error.tsx
+++ b/src/pages/_error.tsx
@@ -1,9 +1,10 @@
-import React from 'react';
+import { ArrowCircleRightIcon } from '@heroicons/react/outline';
import type { NextPage } from 'next';
import Link from 'next/link';
-import type { Undefinable } from '../utils/typeHelpers';
+import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import PageTitle from '../components/Common/PageTitle';
+import type { Undefinable } from '../utils/typeHelpers';
interface ErrorProps {
statusCode?: number;
@@ -45,22 +46,9 @@ const Error: NextPage
= ({ statusCode }) => {
: getErrorMessage(statusCode)}
-
+
{intl.formatMessage(messages.returnHome)}
-
-
-
+
diff --git a/yarn.lock b/yarn.lock
index 91f368f1b..333bc2430 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1533,6 +1533,11 @@
resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-1.0.0.tgz#661b50ebfd25041abb45d8eedd85e7559056bcaf"
integrity sha512-mjqRJrgkbcHQBfAHnqH0yRxO/y/22jYrdltpE7WkurafREKZ+pj5bPBwYHMt935Sdz/n16yRcVmsSCqDFHee9A==
+"@heroicons/react@^1.0.1":
+ version "1.0.1"
+ resolved "https://registry.yarnpkg.com/@heroicons/react/-/react-1.0.1.tgz#66d25f6441920bd5c2146ea27fd33995885452dd"
+ integrity sha512-uikw2gKCmqnvjVxitecWfFLMOKyL9BTFcU4VM3hHj9OMwpkCr5Ke+MRMyY2/aQVmsYs4VTq7NCFX05MYwAHi3g==
+
"@iarna/cli@^1.2.0":
version "1.2.0"
resolved "https://registry.yarnpkg.com/@iarna/cli/-/cli-1.2.0.tgz#0f7af5e851afe895104583c4ca07377a8094d641"