mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-04-21 07:32:02 +00:00
refactor: imports resolutions
This commit is contained in:
parent
b6b9128fcd
commit
dc5f90b2e8
3 changed files with 25 additions and 23 deletions
|
|
@ -11,27 +11,27 @@ import Icon from '@stremio/stremio-icons/react';
|
||||||
import styles from './Item.less';
|
import styles from './Item.less';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import Checkbox from 'stremio/common/Checkbox';
|
import Checkbox from 'stremio/common/Checkbox';
|
||||||
|
import useStreamingServerUrls from '../useStreamingServerUrls';
|
||||||
|
|
||||||
type ViewModeProps = {
|
type ViewModeProps = {
|
||||||
url: string;
|
url: string;
|
||||||
onDelete?: (url: string) => void;
|
}
|
||||||
onSelect?: (url: string) => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
const ViewMode = ({ url, onDelete, onSelect }: ViewModeProps) => {
|
const ViewMode = ({ url }: ViewModeProps) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const streamingServer = useStreamingServer();
|
const streamingServer = useStreamingServer();
|
||||||
|
const { deleteServerUrl, selectServerUrl } = useStreamingServerUrls();
|
||||||
const profile = useProfile();
|
const profile = useProfile();
|
||||||
const selected = useMemo(() => profile.settings.streamingServerUrl === url, [url, profile.settings]);
|
const selected = useMemo(() => profile.settings.streamingServerUrl === url, [url, profile.settings]);
|
||||||
const defaultUrl = useMemo(() => url === DEFAULT_STREAMING_SERVER_URL, [url]);
|
const defaultUrl = useMemo(() => url === DEFAULT_STREAMING_SERVER_URL, [url]);
|
||||||
|
|
||||||
const handleDelete = useCallback(() => {
|
const handleDelete = useCallback(() => {
|
||||||
onDelete?.(url);
|
deleteServerUrl?.(url);
|
||||||
onSelect?.(DEFAULT_STREAMING_SERVER_URL);
|
selectServerUrl?.(DEFAULT_STREAMING_SERVER_URL);
|
||||||
}, [url]);
|
}, [url]);
|
||||||
|
|
||||||
const handleSelect = useCallback(() => {
|
const handleSelect = useCallback(() => {
|
||||||
onSelect?.(url);
|
selectServerUrl?.(url);
|
||||||
}, [url]);
|
}, [url]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -79,7 +79,7 @@ type AddModeProps = {
|
||||||
handleValueChange: (event: ChangeEvent<HTMLInputElement>) => void;
|
handleValueChange: (event: ChangeEvent<HTMLInputElement>) => void;
|
||||||
onAdd?: (url: string) => void;
|
onAdd?: (url: string) => void;
|
||||||
onCancel?: () => void;
|
onCancel?: () => void;
|
||||||
};
|
}
|
||||||
|
|
||||||
const AddMode = ({ inputValue, handleValueChange, onAdd, onCancel }: AddModeProps) => {
|
const AddMode = ({ inputValue, handleValueChange, onAdd, onCancel }: AddModeProps) => {
|
||||||
const handleAdd = useCallback(() => {
|
const handleAdd = useCallback(() => {
|
||||||
|
|
@ -115,8 +115,6 @@ type Props =
|
||||||
| {
|
| {
|
||||||
mode: 'view';
|
mode: 'view';
|
||||||
url: string;
|
url: string;
|
||||||
onDelete?: (url: string) => void;
|
|
||||||
onSelect?: (url: string) => void;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const Item = (props: Props) => {
|
const Item = (props: Props) => {
|
||||||
|
|
@ -140,11 +138,11 @@ const Item = (props: Props) => {
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else if (props.mode === 'view') {
|
} else if (props.mode === 'view') {
|
||||||
const { url, onDelete, onSelect } = props;
|
const { url } = props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classNames(styles['item'])}>
|
<div className={classNames(styles['item'])}>
|
||||||
<ViewMode url={url} onDelete={onDelete} onSelect={onSelect} />
|
<ViewMode url={url} />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ import useStreamingServerUrls from './useStreamingServerUrls';
|
||||||
const URLsManager = () => {
|
const URLsManager = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [addMode, setAddMode] = useState(false);
|
const [addMode, setAddMode] = useState(false);
|
||||||
const { streamingServerUrls, actions } = useStreamingServerUrls();
|
const { streamingServerUrls, addServerUrl, reloadServer } = useStreamingServerUrls();
|
||||||
|
|
||||||
const onAdd = () => {
|
const onAdd = () => {
|
||||||
setAddMode(true);
|
setAddMode(true);
|
||||||
|
|
@ -22,7 +22,7 @@ const URLsManager = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleAddUrl = useCallback((url: string) => {
|
const handleAddUrl = useCallback((url: string) => {
|
||||||
actions.onAdd(url);
|
addServerUrl(url);
|
||||||
setAddMode(false);
|
setAddMode(false);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
|
@ -35,7 +35,7 @@ const URLsManager = () => {
|
||||||
<div className={styles['content']}>
|
<div className={styles['content']}>
|
||||||
{
|
{
|
||||||
streamingServerUrls.map((item: StreamingServerUrl) => (
|
streamingServerUrls.map((item: StreamingServerUrl) => (
|
||||||
<Item mode={'view'} key={item.url} {...item} {...actions} />
|
<Item mode={'view'} key={item.url} {...item} />
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
|
|
@ -49,7 +49,7 @@ const URLsManager = () => {
|
||||||
<Icon name={'add'} className={styles['icon']} />
|
<Icon name={'add'} className={styles['icon']} />
|
||||||
{t('SETTINGS_SERVER_ADD_URL')}
|
{t('SETTINGS_SERVER_ADD_URL')}
|
||||||
</Button>
|
</Button>
|
||||||
<Button className={styles['reload']} title={'Reload'} onClick={actions.onReload}>
|
<Button className={styles['reload']} title={'Reload'} onClick={reloadServer}>
|
||||||
<Icon name={'reset'} className={styles['icon']} />
|
<Icon name={'reset'} className={styles['icon']} />
|
||||||
<div className={styles['label']}>{t('RELOAD')}</div>
|
<div className={styles['label']}>{t('RELOAD')}</div>
|
||||||
</Button>
|
</Button>
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ const useStreamingServerUrls = () => {
|
||||||
return dateA - dateB;
|
return dateA - dateB;
|
||||||
});
|
});
|
||||||
|
|
||||||
const onAdd = useCallback((url) => {
|
const addServerUrl = useCallback((url) => {
|
||||||
const isValidUrl = (url) => {
|
const isValidUrl = (url) => {
|
||||||
try {
|
try {
|
||||||
new URL(url);
|
new URL(url);
|
||||||
|
|
@ -52,7 +52,7 @@ const useStreamingServerUrls = () => {
|
||||||
}
|
}
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const onDelete = useCallback((url) => {
|
const deleteServerUrl = useCallback((url) => {
|
||||||
core.transport.dispatch({
|
core.transport.dispatch({
|
||||||
action: 'Ctx',
|
action: 'Ctx',
|
||||||
args: {
|
args: {
|
||||||
|
|
@ -61,7 +61,7 @@ const useStreamingServerUrls = () => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
const onSelect = useCallback((url) => {
|
const selectServerUrl = useCallback((url) => {
|
||||||
core.transport.dispatch({
|
core.transport.dispatch({
|
||||||
action: 'Ctx',
|
action: 'Ctx',
|
||||||
args: {
|
args: {
|
||||||
|
|
@ -73,7 +73,7 @@ const useStreamingServerUrls = () => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
const onReload = useCallback(() => {
|
const reloadServer = useCallback(() => {
|
||||||
core.transport.dispatch({
|
core.transport.dispatch({
|
||||||
action: 'StreamingServer',
|
action: 'StreamingServer',
|
||||||
args: {
|
args: {
|
||||||
|
|
@ -82,9 +82,13 @@ const useStreamingServerUrls = () => {
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const actions = { onAdd, onDelete, onSelect, onReload };
|
return {
|
||||||
|
streamingServerUrls,
|
||||||
return { streamingServerUrls, actions };
|
addServerUrl,
|
||||||
|
deleteServerUrl,
|
||||||
|
selectServerUrl,
|
||||||
|
reloadServer
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
export default useStreamingServerUrls;
|
export default useStreamingServerUrls;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue