neptune/ghost-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove FF warning (can now connect to local ws) (#2106)

Browse Source
This commit is contained in:
Jaco Greeff 2020-01-12 11:50:07 +01:00 committed by GitHub
parent aa44c8ce7b
commit 0795c9aa32
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/apps/src/overlays/Connecting.tsx
View File

@ -2,24 +2,27 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { ApiProps } from '@polkadot/react-api/types';
import { I18nProps as Props } from '@polkadot/react-components/types';
import React from 'react';
import styled from 'styled-components';
import { useApi } from '@polkadot/react-hooks';
import settings from '@polkadot/ui-settings';
import translate from '../translate';
import { useTranslation } from '../translate';
import BaseOverlay from './Base';
const isFirefox = typeof (window as any).InstallTrigger !== 'undefined';
const wsUrl = settings.apiUrl;
const isWs = wsUrl.startsWith('ws://');
const isWsLocal = wsUrl.includes('127.0.0.1');
const isHttps = window.location.protocol.startsWith('https:');
function ExtensionOverlay ({ className, isWaitingInjected, t }: ApiProps & Props): React.ReactElement<Props> | null {
interface Props {
className?: string;
}
function ExtensionOverlay ({ className }: Props): React.ReactElement<Props> | null {
const { t } = useTranslation();
const { isWaitingInjected } = useApi();
if (!isWaitingInjected) {
return null;
}
@ -34,7 +37,10 @@ function ExtensionOverlay ({ className, isWaitingInjected, t }: ApiProps & Props
);
}
function ConnectOverlay ({ className, isApiConnected, t }: ApiProps & Props): React.ReactElement<Props> | null {
function ConnectOverlay ({ className }: Props): React.ReactElement<Props> | null {
const { t } = useTranslation();
const { isApiConnected } = useApi();
if (isApiConnected) {
return null;
}
@ -45,11 +51,6 @@ function ConnectOverlay ({ className, isApiConnected, t }: ApiProps & Props): Re
icon='globe'
>
<div>{t('You are not connected to a node. Ensure that your node is running and that the Websocket endpoint is reachable.')}</div>
{
isFirefox && isWs
? <div>{t('With the Firefox browser connecting to insecure WebSockets ({{wsUrl}}) will fail due to the browser not allowing localhost access from a secure site.', { replace: { wsUrl } })}</div>
: undefined
}
{
isWs && !isWsLocal && isHttps
? <div>{t('You are connecting from a secure location to an insecure WebSocket ({{wsUrl}}). Due to browser mixed-content security policies this connection type is not allowed. Change the RPC service to a secure \'wss\' endpoint.', { replace: { wsUrl } })}</div>
@ -60,15 +61,11 @@ function ConnectOverlay ({ className, isApiConnected, t }: ApiProps & Props): Re
}
function Connecting (props: Props): React.ReactElement<Props> | null {
const api = useApi();
return ExtensionOverlay({ ...props, ...api }) || ConnectOverlay({ ...props, ...api });
return ExtensionOverlay(props) || ConnectOverlay(props);
}
export default translate(
styled(Connecting)`
background: #ffe6e6;
border-color: #c00;
color: #4d0000;
`
);
export default styled(Connecting)`
background: #ffe6e6;
border-color: #c00;
color: #4d0000;
`;