open-source-mirrors
/
overseerr
mirror of https://github.com/sct/overseerr
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(ui): hide advanced request options when there is only one choice (#1591)

Browse Source 
* refactor: remove unnecessary elements/indentation

* fix(ui): hide advanced request options when there is only one choice
pull/1595/head
TheCatLady 4 years ago committed by GitHub
parent 9749d723fc
commit 6b26188d88
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 150 additions and 144 deletions
Show Stats Download Patch File Download Diff File

56
src/components/RequestModal/AdvancedRequester/index.tsx
Unescape View File

@ -26,7 +26,7 @@ type OptionType = {
const Select = dynamic(() => import('react-select'), { ssr: false });
const messages = defineMessages({
advancedoptions: 'Advanced Options',
advancedoptions: 'Advanced',
destinationserver: 'Destination Server',
qualityprofile: 'Quality Profile',
rootfolder: 'Root Folder',
@ -276,9 +276,9 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
</div>
<div className="p-4 bg-gray-600 rounded-md shadow">
{!!data && selectedServer !== null && (
<>
<div className="flex flex-col items-center justify-between md:flex-row">
<div className="flex-grow flex-shrink-0 w-full mb-2 md:w-1/4 md:pr-4 md:mb-0">
<div className="flex flex-col md:flex-row">
{data.filter((server) => server.is4k === is4k).length > 1 && (
<div className="flex-grow flex-shrink-0 w-full mb-3 md:w-1/4 md:pr-4 last:pr-0">
<label htmlFor="server">
{intl.formatMessage(messages.destinationserver)}
</label>
@ -288,7 +288,7 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
value={selectedServer}
onChange={(e) => setSelectedServer(Number(e.target.value))}
onBlur={(e) => setSelectedServer(Number(e.target.value))}
className="block w-full py-2 pl-3 pr-10 mt-1 text-base leading-6 text-white transition duration-150 ease-in-out bg-gray-800 border-gray-700 rounded-md form-select focus:outline-none focus:ring-blue focus:border-blue-300 sm:text-sm sm:leading-5"
className="bg-gray-800 border-gray-700"
>
{data
.filter((server) => server.is4k === is4k)
@ -306,7 +306,11 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
))}
</select>
</div>
<div className="flex-grow flex-shrink-0 w-full mb-2 md:w-1/4 md:pr-4 md:mb-0">
)}
{(isValidating ||
!serverData ||
serverData.profiles.length > 1) && (
<div className="flex-grow flex-shrink-0 w-full mb-3 md:w-1/4 md:pr-4 last:pr-0">
<label htmlFor="profile">
{intl.formatMessage(messages.qualityprofile)}
</label>
@ -316,7 +320,7 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
value={selectedProfile}
onChange={(e) => setSelectedProfile(Number(e.target.value))}
onBlur={(e) => setSelectedProfile(Number(e.target.value))}
className="block w-full py-2 pl-3 pr-10 mt-1 text-base leading-6 text-white transition duration-150 ease-in-out bg-gray-800 border-gray-700 rounded-md form-select focus:outline-none focus:ring-blue focus:border-blue-300 sm:text-sm sm:leading-5"
className="bg-gray-800 border-gray-700"
disabled={isValidating || !serverData}
>
{(isValidating || !serverData) && (
@ -346,11 +350,11 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
))}
</select>
</div>
<div
className={`flex-grow flex-shrink-0 w-full mb-2 md:w-1/4 md:mb-0 ${
type === 'tv' ? 'md:pr-4' : ''
}`}
>
)}
{(isValidating ||
!serverData ||
serverData.rootFolders.length > 1) && (
<div className="flex-grow flex-shrink-0 w-full mb-3 md:w-1/4 md:pr-4 last:pr-0">
<label htmlFor="folder">
{intl.formatMessage(messages.rootfolder)}
</label>
@ -360,7 +364,7 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
value={selectedFolder}
onChange={(e) => setSelectedFolder(e.target.value)}
onBlur={(e) => setSelectedFolder(e.target.value)}
className="block w-full py-2 pl-3 pr-10 mt-1 text-base leading-6 text-white transition duration-150 ease-in-out bg-gray-800 border-gray-700 rounded-md form-select focus:outline-none focus:ring-blue focus:border-blue-300 sm:text-sm sm:leading-5"
className="bg-gray-800 border-gray-700"
disabled={isValidating || !serverData}
>
{(isValidating || !serverData) && (
@ -399,8 +403,12 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
))}
</select>
</div>
{type === 'tv' && (
<div className="flex-grow flex-shrink-0 w-full mb-2 md:w-1/4 md:mb-0">
)}
{type === 'tv' &&
(isValidating ||
!serverData ||
(serverData.languageProfiles ?? []).length > 1) && (
<div className="flex-grow flex-shrink-0 w-full mb-3 md:w-1/4 md:pr-4 last:pr-0">
<label htmlFor="language">
{intl.formatMessage(messages.languageprofile)}
</label>
@ -414,7 +422,7 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
onBlur={(e) =>
setSelectedLanguage(parseInt(e.target.value))
}
className="block w-full py-2 pl-3 pr-10 mt-1 text-base leading-6 text-white transition duration-150 ease-in-out bg-gray-800 border-gray-700 rounded-md form-select focus:outline-none focus:ring-blue focus:border-blue-300 sm:text-sm sm:leading-5"
className="bg-gray-800 border-gray-700"
disabled={isValidating || !serverData}
>
{(isValidating || !serverData) && (
@ -448,10 +456,10 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
</div>
)}
</div>
</>
)}
{!!data && selectedServer !== null && (
<div className="mt-0 sm:mt-2">
{selectedServer !== null &&
(isValidating || !serverData || !!serverData?.tags?.length) && (
<div className="mb-2">
<label htmlFor="tags">{intl.formatMessage(messages.tags)}</label>
<Select
name="tags"
@ -485,13 +493,14 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
}
setSelectedTags(value?.map((option) => option.value));
}}
noOptionsMessage={() => intl.formatMessage(messages.notagoptions)}
noOptionsMessage={() =>
intl.formatMessage(messages.notagoptions)
}
/>
</div>
)}
{hasPermission([Permission.MANAGE_REQUESTS, Permission.MANAGE_USERS]) &&
selectedUser && (
<div className="mt-2 first:mt-0">
<Listbox
as="div"
value={selectedUser}
@ -569,9 +578,7 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
{selected && (
<span
className={`${
active
? 'text-white'
: 'text-indigo-600'
active ? 'text-white' : 'text-indigo-600'
} absolute inset-y-0 left-0 flex items-center pl-1.5`}
>
<CheckIcon className="w-5 h-5" />
@ -587,7 +594,6 @@ const AdvancedRequester: React.FC<AdvancedRequesterProps> = ({
</>
)}
</Listbox>
</div>
)}
{isAnime && (
<div className="mt-4 italic">

2
src/i18n/locale/en.json
Unescape View File

@ -183,7 +183,7 @@
"components.RequestList.showallrequests": "Show All Requests",
"components.RequestList.sortAdded": "Request Date",
"components.RequestList.sortModified": "Last Modified",
"components.RequestModal.AdvancedRequester.advancedoptions": "Advanced Options",
"components.RequestModal.AdvancedRequester.advancedoptions": "Advanced",
"components.RequestModal.AdvancedRequester.animenote": "* This series is an anime.",
"components.RequestModal.AdvancedRequester.default": "{name} (Default)",
"components.RequestModal.AdvancedRequester.destinationserver": "Destination Server",

Write Preview
Loading…
Cancel
Save