1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Update to React 18

This commit is contained in:
grafixeyehero 2024-06-02 20:58:11 +03:00
parent b5d6e37fb3
commit be891c3a98
36 changed files with 339 additions and 311 deletions

View file

@ -1,8 +1,27 @@
import escapeHTML from 'escape-html';
import React, { FunctionComponent } from 'react';
import React, { type FC } from 'react';
import globalize from '../scripts/globalize';
const createCheckBoxElement = ({ labelClassName, className, id, dataFilter, dataItemType, dataId, checkedAttribute, renderContent }: { labelClassName?: string, type?: string, className?: string, id?: string, dataFilter?: string, dataItemType?: string, dataId?: string, checkedAttribute?: string, renderContent?: string }) => ({
const createCheckBoxElement = ({
labelClassName,
className,
id,
dataFilter,
dataItemType,
dataId,
checkedAttribute,
renderContent
}: {
labelClassName?: string;
type?: string;
className?: string;
id?: string;
dataFilter?: string;
dataItemType?: string;
dataId?: string;
checkedAttribute?: string;
renderContent?: string;
}) => ({
__html: `<label ${labelClassName}>
<input
is="emby-checkbox"
@ -18,20 +37,31 @@ const createCheckBoxElement = ({ labelClassName, className, id, dataFilter, data
</label>`
});
type IProps = {
interface CheckBoxElementProps {
labelClassName?: string;
className?: string;
elementId?: string;
dataFilter?: string;
itemType?: string;
itemId?: string;
itemAppName?: string;
itemId?: string | null;
itemAppName?: string | null;
itemCheckedAttribute?: string;
itemName?: string
title?: string
};
itemName?: string | null;
title?: string;
}
const CheckBoxElement: FunctionComponent<IProps> = ({ labelClassName, className, elementId, dataFilter, itemType, itemId, itemAppName, itemCheckedAttribute, itemName, title }: IProps) => {
const CheckBoxElement: FC<CheckBoxElementProps> = ({
labelClassName,
className,
elementId,
dataFilter,
itemType,
itemId,
itemAppName,
itemCheckedAttribute,
itemName,
title
}) => {
const appName = itemAppName ? `- ${itemAppName}` : '';
const renderContent = itemName ?
`<span>${escapeHTML(itemName || '')} ${appName}</span>` :
@ -41,13 +71,17 @@ const CheckBoxElement: FunctionComponent<IProps> = ({ labelClassName, className,
<div
className='sectioncheckbox'
dangerouslySetInnerHTML={createCheckBoxElement({
labelClassName: labelClassName ? `class='${labelClassName}'` : '',
labelClassName: labelClassName ?
`class='${labelClassName}'` :
'',
className: className,
id: elementId ? `id='${elementId}'` : '',
dataFilter: dataFilter ? `data-filter='${dataFilter}'` : '',
dataItemType: itemType ? `data-itemtype='${itemType}'` : '',
dataId: itemId ? `data-id='${itemId}'` : '',
checkedAttribute: itemCheckedAttribute ? itemCheckedAttribute : '',
checkedAttribute: itemCheckedAttribute ?
itemCheckedAttribute :
'',
renderContent: renderContent
})}
/>