chore(eslint): add react/self-closing-comp (#2563)

This commit is contained in:
Pierre Spring
2026-02-23 22:58:46 +01:00
committed by GitHub
parent 947f70c3d7
commit cd8b386bf8
16 changed files with 33 additions and 31 deletions

View File

@@ -45,8 +45,10 @@ module.exports = {
overrides: [
{
files: ['**/*.tsx'],
plugins: ['react'],
rules: {
'react/prop-types': 'off',
'react/self-closing-comp': 'error',
},
},
],

View File

@@ -24,13 +24,13 @@ const SlideCheckbox = ({ onClick, checked = false }: SlideCheckboxProps) => {
className={`${
checked ? 'bg-indigo-500' : 'bg-gray-700'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
checked ? 'translate-x-5' : 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
);
};

View File

@@ -508,7 +508,7 @@ const CreateSlider = ({ onCreate, slider }: CreateSliderProps) => {
typeof errors.data === 'string' && (
<div className="error">{errors.data}</div>
)}
<div className="flex-1"></div>
<div className="flex-1" />
{resultCount === 0 ? (
<Tooltip content={intl.formatMessage(messages.needresults)}>
<div>

View File

@@ -58,7 +58,7 @@ const GenreCardPlaceholder = () => {
return (
<div
className={`relative h-32 w-56 animate-pulse rounded-xl bg-gray-700 sm:h-40 sm:w-72`}
></div>
/>
);
};

View File

@@ -163,7 +163,7 @@ const Sidebar = ({
leaveTo="opacity-0"
>
<div className="fixed inset-0">
<div className="absolute inset-0 bg-gray-900 opacity-90"></div>
<div className="absolute inset-0 bg-gray-900 opacity-90" />
</div>
</Transition.Child>
<Transition.Child

View File

@@ -154,7 +154,7 @@ const JellyfinLogin: React.FC<JellyfinLoginProps> = ({
{errors.password && touched.password && (
<div className="error">{errors.password}</div>
)}
<div className="flex-grow"></div>
<div className="flex-grow" />
{baseUrl && (
<a
href={

View File

@@ -120,7 +120,7 @@ const LocalLogin = ({ revalidate }: LocalLoginProps) => {
typeof errors.password === 'string' && (
<div className="error">{errors.password}</div>
)}
<div className="flex-grow"></div>
<div className="flex-grow" />
{passwordResetEnabled && (
<Link
href="/resetpassword"

View File

@@ -241,11 +241,11 @@ const Login = () => {
{additionalLoginOptions.length > 0 &&
(loginFormVisible ? (
<div className="flex items-center py-5">
<div className="flex-grow border-t border-gray-600"></div>
<div className="flex-grow border-t border-gray-600" />
<span className="mx-2 flex-shrink text-sm text-gray-400">
{intl.formatMessage(messages.orsigninwith)}
</span>
<div className="flex-grow border-t border-gray-600"></div>
<div className="flex-grow border-t border-gray-600" />
</div>
) : (
<h2 className="mb-6 text-center text-lg font-bold text-neutral-200">

View File

@@ -340,13 +340,13 @@ const CollectionRequestModal = ({
className={`${
isAllParts() ? 'bg-indigo-500' : 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
isAllParts() ? 'translate-x-5' : 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</th>
<th className="bg-gray-700 bg-opacity-80 px-1 py-3 text-left text-xs font-medium uppercase leading-4 tracking-wider text-gray-200 md:px-6">
@@ -423,7 +423,7 @@ const CollectionRequestModal = ({
? 'bg-indigo-500'
: 'bg-gray-700'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
@@ -435,7 +435,7 @@ const CollectionRequestModal = ({
? 'translate-x-5'
: 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</td>
<td

View File

@@ -557,13 +557,13 @@ const TvRequestModal = ({
className={`${
isAllSeasons() ? 'bg-indigo-500' : 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
isAllSeasons() ? 'translate-x-5' : 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</th>
<th className="bg-gray-700 bg-opacity-80 px-1 py-3 text-left text-xs font-medium uppercase leading-4 tracking-wider text-gray-200 md:px-6">
@@ -649,7 +649,7 @@ const TvRequestModal = ({
? 'bg-indigo-500'
: 'bg-gray-700'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
@@ -662,7 +662,7 @@ const TvRequestModal = ({
? 'translate-x-5'
: 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</td>
<td className="whitespace-nowrap px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6">

View File

@@ -495,7 +495,7 @@ const SettingsJobs = () => {
<Table.TH>{intl.formatMessage(messages.jobname)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.jobtype)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.nextexecution)}</Table.TH>
<Table.TH></Table.TH>
<Table.TH />
</tr>
</thead>
<Table.TBody>
@@ -578,7 +578,7 @@ const SettingsJobs = () => {
<Table.TH>{intl.formatMessage(messages.cachekeys)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.cacheksize)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.cachevsize)}</Table.TH>
<Table.TH></Table.TH>
<Table.TH />
</tr>
</thead>
<Table.TBody>
@@ -639,7 +639,7 @@ const SettingsJobs = () => {
<Table.TH>
{intl.formatMessage(messages.dnscacheage)}
</Table.TH>
<Table.TH></Table.TH>
<Table.TH />
</tr>
</thead>
<Table.TBody>

View File

@@ -314,7 +314,7 @@ const SettingsLogs = () => {
<Table.TH>{intl.formatMessage(messages.level)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.label)}</Table.TH>
<Table.TH>{intl.formatMessage(messages.message)}</Table.TH>
<Table.TH></Table.TH>
<Table.TH />
</tr>
</thead>
<Table.TBody>

View File

@@ -186,13 +186,13 @@ const JellyfinImportModal: React.FC<JellyfinImportProps> = ({
className={`${
isAllUsers() ? 'bg-indigo-500' : 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
isAllUsers() ? 'translate-x-5' : 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 transform rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</th>
<th className="bg-gray-500 px-1 py-3 text-left text-xs font-medium uppercase leading-4 tracking-wider text-gray-200 md:px-6">
@@ -230,7 +230,7 @@ const JellyfinImportModal: React.FC<JellyfinImportProps> = ({
? 'bg-indigo-500'
: 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
@@ -238,7 +238,7 @@ const JellyfinImportModal: React.FC<JellyfinImportProps> = ({
? 'translate-x-5'
: 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 transform rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</td>
<td className="whitespace-nowrap px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6">

View File

@@ -152,13 +152,13 @@ const PlexImportModal = ({ onCancel, onComplete }: PlexImportProps) => {
className={`${
isAllUsers() ? 'bg-indigo-500' : 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
isAllUsers() ? 'translate-x-5' : 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</th>
<th className="bg-gray-500 px-1 py-3 text-left text-xs font-medium uppercase leading-4 tracking-wider text-gray-200 md:px-6">
@@ -189,7 +189,7 @@ const PlexImportModal = ({ onCancel, onComplete }: PlexImportProps) => {
? 'bg-indigo-500'
: 'bg-gray-800'
} absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out`}
></span>
/>
<span
aria-hidden="true"
className={`${
@@ -197,7 +197,7 @@ const PlexImportModal = ({ onCancel, onComplete }: PlexImportProps) => {
? 'translate-x-5'
: 'translate-x-0'
} absolute left-0 inline-block h-5 w-5 rounded-full border border-gray-200 bg-white shadow transition-transform duration-200 ease-in-out group-focus:border-blue-300 group-focus:ring`}
></span>
/>
</span>
</td>
<td className="whitespace-nowrap px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6">

View File

@@ -53,7 +53,7 @@ const ProfileHeader = ({ user, isSettingsPage }: ProfileHeaderProps) => {
<span
className="absolute inset-0 rounded-full shadow-inner"
aria-hidden="true"
></span>
/>
</div>
</div>
<div className="pt-1.5">

View File

@@ -206,7 +206,7 @@ const CoreApp: Omit<NextAppComponentType, 'origGetInitialProps'> = ({
<meta
name="viewport"
content="initial-scale=1, viewport-fit=cover, width=device-width"
></meta>
/>
<PWAHeader
applicationTitle={currentSettings.applicationTitle}
/>