48 lines
1.3 KiB
React
48 lines
1.3 KiB
React
|
// @flow
|
||
|
|
import React from 'react';
|
||
|
|
import './style.scss';
|
||
|
|
import Card from 'component/common/card';
|
||
|
|
import Icon from 'component/common/icon';
|
||
|
|
import Tooltip from 'component/common/tooltip';
|
||
|
|
import * as ICONS from 'constants/icons';
|
||
|
|
import * as MODALS from 'constants/modal_types';
|
||
|
|
import { parseURI } from 'util/lbryURI';
|
||
|
|
|
||
|
|
type Props = {
|
||
|
|
uri: string,
|
||
|
|
geoRestriction: ?GeoRestriction,
|
||
|
|
doOpenModal: (string, {}) => void,
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function GeoRestrictionInfo(props: Props) {
|
||
|
|
const { uri, geoRestriction, doOpenModal } = props;
|
||
|
|
|
||
|
|
if (!geoRestriction) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
const { isChannel } = parseURI(uri);
|
||
|
|
const title = __(isChannel ? 'Channel unavailable' : 'Content unavailable');
|
||
|
|
const msg = <Card title={title} subtitle={__(geoRestriction.message || '')} />;
|
||
|
|
|
||
|
|
function showMsg() {
|
||
|
|
doOpenModal(MODALS.CONFIRM, {
|
||
|
|
title: title,
|
||
|
|
subtitle: __(geoRestriction.message || ''),
|
||
|
|
onConfirm: (closeModal) => closeModal(),
|
||
|
|
hideCancel: true,
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Tooltip title={msg} followCursor>
|
||
|
|
<div className="geo-restriction-info" onClick={showMsg}>
|
||
|
|
<div className="geo-restriction-info__container">
|
||
|
|
<Icon icon={ICONS.EYE_OFF} size={24} />
|
||
|
|
<span className="geo-restriction-info__title">{title}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</Tooltip>
|
||
|
|
);
|
||
|
|
}
|