fix(web): Add and update Indexer tooltips (#1111)

fix tooltips in IndexerForms.tsx
linting
This commit is contained in:
martylukyy 2023-09-11 13:33:38 +02:00 committed by GitHub
parent 3c030dc0ce
commit 041ca5ba34
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -19,7 +19,6 @@ import { PasswordFieldWide, SwitchGroupWide, TextFieldWide } from "@components/i
import { SlideOver } from "@components/panels"; import { SlideOver } from "@components/panels";
import Toast from "@components/notifications/Toast"; import Toast from "@components/notifications/Toast";
import { SelectFieldBasic, SelectFieldCreatable } from "@components/inputs/select_wide"; import { SelectFieldBasic, SelectFieldCreatable } from "@components/inputs/select_wide";
import { CustomTooltip } from "@components/tooltips/CustomTooltip";
import { FeedDownloadTypeOptions } from "@domain/constants"; import { FeedDownloadTypeOptions } from "@domain/constants";
import { feedKeys } from "@screens/settings/Feed"; import { feedKeys } from "@screens/settings/Feed";
import { indexerKeys } from "@screens/settings/Indexer"; import { indexerKeys } from "@screens/settings/Indexer";
@ -87,13 +86,13 @@ const IrcSettingFields = (ind: IndexerDefinition, indexer: string) => {
{ind.irc.settings.map((f: IndexerSetting, idx: number) => { {ind.irc.settings.map((f: IndexerSetting, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return <TextFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} tooltip={<div><p>Please read our IRC guide if you are unfamiliar with IRC.</p><a href='https://autobrr.com/configuration/irc' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/configuration/irc</a></div>} />; return <TextFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} tooltip={<div><p>Please read our IRC guide if you are unfamiliar with IRC.</p><a href='https://autobrr.com/configuration/irc' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/configuration/irc</a></div>} />;
case "secret": case "secret":
if (f.name === "invite_command") { if (f.name === "invite_command") {
return <PasswordFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultVisible={true} defaultValue={f.default} validate={validateField(f)} />; return <PasswordFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultVisible={true} defaultValue={f.default} validate={validateField(f)} />;
} }
return <PasswordFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />; return <PasswordFieldWide name={`irc.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />;
} }
return null; return null;
})} })}
@ -121,10 +120,10 @@ const TorznabFeedSettingFields = (ind: IndexerDefinition, indexer: string) => {
{ind.torznab.settings.map((f: IndexerSetting, idx: number) => { {ind.torznab.settings.map((f: IndexerSetting, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />; return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />;
case "secret": case "secret":
return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />; return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />;
} }
return null; return null;
})} })}
@ -160,10 +159,10 @@ const NewznabFeedSettingFields = (ind: IndexerDefinition, indexer: string) => {
{ind.newznab.settings.map((f: IndexerSetting, idx: number) => { {ind.newznab.settings.map((f: IndexerSetting, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />; return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />;
case "secret": case "secret":
return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />; return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />;
} }
return null; return null;
})} })}
@ -191,10 +190,10 @@ const RSSFeedSettingFields = (ind: IndexerDefinition, indexer: string) => {
{ind.rss.settings.map((f: IndexerSetting, idx: number) => { {ind.rss.settings.map((f: IndexerSetting, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />; return <TextFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />;
case "secret": case "secret":
return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />; return <PasswordFieldWide name={`feed.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} defaultValue={f.default} validate={validateField(f)} />;
} }
return null; return null;
})} })}
@ -219,14 +218,14 @@ const SettingFields = (ind: IndexerDefinition, indexer: string) => {
<div key="opt"> <div key="opt">
{ind && ind.settings && ind.settings.map((f, idx: number) => { {ind && ind.settings && ind.settings.map((f, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return ( return (
<TextFieldWide name={`settings.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} /> <TextFieldWide name={`settings.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} autoComplete="off" validate={validateField(f)} />
); );
case "secret": case "secret":
return ( return (
<PasswordFieldWide name={`settings.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} validate={validateField(f)} tooltip={<CustomTooltip anchorId={`settings.${f.name}`} clickable={true}><div><p>This field does not take a full URL. Only use alphanumeric strings like <code>uqcdi67cibkx3an8cmdm</code>.</p><br /><a href='https://autobrr.com/faqs#common-action-rejections' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/faqs#common-action-rejections</a></div></CustomTooltip>} /> <PasswordFieldWide name={`settings.${f.name}`} label={f.label} required={f.required} key={idx} help={f.help} validate={validateField(f)} tooltip={<div><p>This field does not take a full URL. Only use alphanumeric strings like <code>uqcdi67cibkx3an8cmdm</code>.</p><br /><a href='https://autobrr.com/faqs#common-action-rejections' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/faqs#common-action-rejections</a></div>} />
); );
} }
return null; return null;
})} })}
@ -753,14 +752,14 @@ export function IndexerUpdateForm({ isOpen, toggle, indexer }: UpdateProps) {
<div key="opt"> <div key="opt">
{settings.map((f: IndexerSetting, idx: number) => { {settings.map((f: IndexerSetting, idx: number) => {
switch (f.type) { switch (f.type) {
case "text": case "text":
return ( return (
<TextFieldWide name={`settings.${f.name}`} label={f.label} key={idx} help={f.help} /> <TextFieldWide name={`settings.${f.name}`} label={f.label} key={idx} help={f.help} />
); );
case "secret": case "secret":
return ( return (
<PasswordFieldWide name={`settings.${f.name}`} label={f.label} key={idx} help={f.help} tooltip={<CustomTooltip anchorId={`settings.${f.name}`} clickable={true}><div><p>This field does not take a full URL. Only use alphanumeric strings like <code>uqcdi67cibkx3an8cmdm</code>.</p><br /><a href='https://autobrr.com/faqs#common-action-rejections' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/faqs#common-action-rejections</a></div></CustomTooltip>} /> <PasswordFieldWide name={`settings.${f.name}`} label={f.label} key={idx} help={f.help} tooltip={<div><p>This field does not take a full URL. Only use alphanumeric strings like <code>uqcdi67cibkx3an8cmdm</code>.</p><br /><a href='https://autobrr.com/faqs#common-action-rejections' className='text-blue-400 visited:text-blue-400' target='_blank'>https://autobrr.com/faqs#common-action-rejections</a></div>} />
); );
} }
return null; return null;
})} })}