lbry-desktop/ui/index.jsx

299 lines
8.5 KiB
React
Raw Normal View History

import ErrorBoundary from 'component/errorBoundary';
import App from 'component/app';
import SnackBar from 'component/snackBar';
2019-02-22 06:01:59 +01:00
// @if TARGET='app'
2019-03-28 17:53:13 +01:00
import SplashScreen from 'component/splash';
import * as ACTIONS from 'constants/action_types';
2019-02-22 06:01:59 +01:00
// @endif
2019-07-29 16:34:20 +02:00
import { ipcRenderer, remote, shell } from 'electron';
import moment from 'moment';
import * as MODALS from 'constants/modal_types';
2019-08-27 16:43:42 +02:00
import React, { Fragment, useState, useEffect } from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
2019-05-07 04:35:04 +02:00
import { doConditionalAuthNavigate, doDaemonReady, doAutoUpdate, doOpenModal, doHideModal } from 'redux/actions/app';
2019-11-15 20:42:31 +01:00
import { Lbry, doToast, isURIValid, setSearchApi, apiCall } from 'lbry-redux';
2019-11-05 19:54:58 +01:00
import { doSetLanguage, doUpdateIsNightAsync } from 'redux/actions/settings';
import {
doAuthenticate,
Lbryio,
rewards,
doBlackListedOutpointsSubscribe,
doFilteredOutpointsSubscribe,
} from 'lbryinc';
2019-07-23 10:05:51 +02:00
import { store, persistor, history } from 'store';
2018-09-24 05:44:42 +02:00
import pjson from 'package.json';
2017-12-21 23:09:30 +01:00
import app from './app';
import doLogWarningConsoleMessage from './logWarningConsoleMessage';
2019-04-18 21:10:46 +02:00
import { ConnectedRouter, push } from 'connected-react-router';
import { formatLbryUriForWeb } from 'util/uri';
2019-07-23 10:05:51 +02:00
import { PersistGate } from 'redux-persist/integration/react';
2019-10-02 20:20:25 +02:00
import analytics from 'analytics';
import { getAuthToken, setAuthToken } from 'util/saved-passwords';
import { X_LBRY_AUTH_TOKEN } from 'constants/token';
2019-04-18 21:10:46 +02:00
2019-04-18 21:40:53 +02:00
// Import our app styles
// If a style is not necessary for the initial page load, it should be removed from `all.scss`
// and loaded dynamically in the component that consumes it
import 'scss/all.scss';
2016-11-22 21:19:08 +01:00
2019-09-30 22:11:45 +02:00
// @if TARGET='web'
// These overrides can't live in lbrytv/ because they need to use the same instance of `Lbry`
import apiPublishCallViaWeb from 'lbrytv/setup/publish';
const PROXY_PATH = 'api/v1/proxy';
export const SDK_API_URL = `${process.env.SDK_API_URL}/${PROXY_PATH}` || `https://api.lbry.tv/${PROXY_PATH}`;
Lbry.setDaemonConnectionString(SDK_API_URL);
Lbry.setOverride(
'publish',
params =>
new Promise((resolve, reject) => {
apiPublishCallViaWeb(
2019-11-15 20:42:31 +01:00
apiCall,
SDK_API_URL,
Lbry.getApiRequestHeaders() && Object.keys(Lbry.getApiRequestHeaders()).includes(X_LBRY_AUTH_TOKEN)
? Lbry.getApiRequestHeaders()[X_LBRY_AUTH_TOKEN]
: '',
'publish',
params,
resolve,
reject
);
})
);
2019-09-30 22:11:45 +02:00
// @endif
2019-10-22 22:42:13 +02:00
const startTime = Date.now();
analytics.startupEvent();
const APPPAGEURL = 'lbry://?';
2019-02-22 06:01:59 +01:00
// @if TARGET='app'
const { autoUpdater } = remote.require('electron-updater');
2018-02-24 01:24:00 +01:00
autoUpdater.logger = remote.require('electron-log');
2019-02-22 06:01:59 +01:00
// @endif
2017-12-10 09:06:30 +01:00
2019-01-08 03:46:33 +01:00
if (process.env.LBRY_API_URL) {
Lbryio.setLocalApi(process.env.LBRY_API_URL);
}
2019-01-29 17:46:56 +01:00
if (process.env.SEARCH_API_URL) {
setSearchApi(process.env.SEARCH_API_URL);
}
2018-09-24 05:44:42 +02:00
// We need to override Lbryio for getting/setting the authToken
2019-10-13 19:41:51 +02:00
// We interact with ipcRenderer to get the auth key from a users keyring
// We keep a local variable for authToken because `ipcRenderer.send` does not
// contain a response, so there is no way to know when it's been set
2018-11-30 06:55:45 +01:00
let authToken;
Lbryio.setOverride(
'setAuthToken',
2019-10-22 22:46:50 +02:00
status =>
new Promise(resolve => {
Lbryio.call(
'user',
'new',
{
auth_token: '',
language: 'en',
app_id: status.installation_id,
},
'post'
).then(response => {
if (!response.auth_token) {
throw new Error(__('auth_token is missing from response'));
}
2018-09-24 05:44:42 +02:00
2019-09-26 18:07:11 +02:00
authToken = response.auth_token;
setAuthToken(authToken);
2019-09-26 18:07:11 +02:00
2019-02-22 06:01:59 +01:00
// @if TARGET='app'
ipcRenderer.send('set-auth-token', authToken);
2019-02-22 06:01:59 +01:00
// @endif
2019-09-26 18:07:11 +02:00
resolve(authToken);
});
})
);
2018-09-24 05:44:42 +02:00
Lbryio.setOverride(
'getAuthToken',
() =>
new Promise(resolve => {
2019-10-24 20:07:48 +02:00
// @if TARGET='app'
2018-11-30 06:55:45 +01:00
if (authToken) {
resolve(authToken);
2019-10-24 20:07:48 +02:00
}
2018-09-24 05:44:42 +02:00
2019-10-24 20:07:48 +02:00
ipcRenderer.once('auth-token-response', (event, token) => {
Lbryio.authToken = token;
resolve(token);
});
2019-10-24 19:37:26 +02:00
2019-10-24 20:07:48 +02:00
ipcRenderer.send('get-auth-token');
// @endif
2019-10-24 19:37:26 +02:00
2019-10-24 20:07:48 +02:00
// @if TARGET='web'
const authTokenToReturn = authToken || getAuthToken();
if (authTokenToReturn !== null) {
Lbry.setApiHeader(X_LBRY_AUTH_TOKEN, authTokenToReturn);
2018-11-30 06:55:45 +01:00
}
2019-10-24 20:07:48 +02:00
resolve(authTokenToReturn);
// @endif
2018-09-24 05:44:42 +02:00
})
);
rewards.setCallback('claimFirstRewardSuccess', () => {
app.store.dispatch(doOpenModal(MODALS.FIRST_REWARD));
});
rewards.setCallback('claimRewardSuccess', () => {
app.store.dispatch(doHideModal());
});
2019-02-22 06:01:59 +01:00
// @if TARGET='app'
2017-12-26 14:25:26 +01:00
ipcRenderer.on('open-uri-requested', (event, uri, newSession) => {
if (uri && uri.startsWith('lbry://')) {
2019-01-08 05:42:54 +01:00
if (uri.startsWith('lbry://?verify')) {
app.store.dispatch(doConditionalAuthNavigate(newSession));
} else if (uri.startsWith(APPPAGEURL)) {
const navpage = uri.replace(APPPAGEURL, '').toLowerCase();
2019-04-18 21:10:46 +02:00
app.store.dispatch(push(`/$/${navpage}`));
} else if (isURIValid(uri)) {
2019-04-18 21:10:46 +02:00
const formattedUri = formatLbryUriForWeb(uri);
app.store.dispatch(push(formattedUri));
2019-11-04 16:55:02 +01:00
analytics.openUrlEvent(formattedUri);
} else {
app.store.dispatch(
doToast({
message: __('Invalid LBRY URL requested'),
})
);
2017-12-23 03:09:06 +01:00
}
2017-06-08 02:56:52 +02:00
}
});
2019-11-05 19:54:58 +01:00
ipcRenderer.on('language-set', (event, language) => {
app.store.dispatch(doSetLanguage(language));
});
ipcRenderer.on('open-menu', (event, uri) => {
if (uri && uri.startsWith('/help')) {
2019-04-18 21:10:46 +02:00
app.store.dispatch(push('/$/help'));
}
});
const { dock } = remote.app;
ipcRenderer.on('window-is-focused', () => {
if (!dock) return;
app.store.dispatch({ type: ACTIONS.WINDOW_FOCUSED });
dock.setBadge('');
});
ipcRenderer.on('devtools-is-opened', () => {
doLogWarningConsoleMessage();
});
2019-05-26 08:18:47 +02:00
// Force exit mode for html5 fullscreen api
// See: https://github.com/electron/electron/issues/18188
remote.getCurrentWindow().on('leave-full-screen', event => {
document.webkitExitFullscreen();
});
2019-02-22 06:01:59 +01:00
// @endif
2018-02-28 23:03:36 +01:00
document.addEventListener('dragover', event => {
event.preventDefault();
2018-03-06 09:36:04 +01:00
});
2018-02-28 23:03:36 +01:00
document.addEventListener('drop', event => {
event.preventDefault();
});
document.addEventListener('click', event => {
let { target } = event;
2018-11-07 23:44:38 +01:00
2017-06-08 02:56:52 +02:00
while (target && target !== document) {
if (target.matches('a[href^="http"]') || target.matches('a[href^="mailto"]')) {
2019-02-22 06:01:59 +01:00
// @if TARGET='app'
2017-06-08 02:56:52 +02:00
event.preventDefault();
shell.openExternal(target.href);
return;
2019-02-22 06:01:59 +01:00
// @endif
2017-06-08 02:56:52 +02:00
}
target = target.parentNode;
}
2017-05-21 18:15:41 +02:00
});
2019-07-23 10:05:51 +02:00
function AppWrapper() {
2019-11-18 19:30:15 +01:00
// Splash screen and sdk setup not needed on web
const [readyToLaunch, setReadyToLaunch] = useState(IS_WEB);
const [persistDone, setPersistDone] = useState(false);
2018-10-14 19:47:18 +02:00
2019-07-23 10:05:51 +02:00
useEffect(() => {
2019-07-29 16:34:20 +02:00
// @if TARGET='app'
2019-07-23 10:05:51 +02:00
moment.locale(remote.app.getLocale());
2019-07-23 10:05:51 +02:00
autoUpdater.on('error', error => {
console.error(error.message); // eslint-disable-line no-console
});
2018-04-24 20:17:11 +02:00
2019-07-23 10:05:51 +02:00
if (['win32', 'darwin'].includes(process.platform)) {
autoUpdater.on('update-available', () => {
console.log('Update available'); // eslint-disable-line no-console
});
autoUpdater.on('update-not-available', () => {
console.log('Update not available'); // eslint-disable-line no-console
});
autoUpdater.on('update-downloaded', () => {
console.log('Update downloaded'); // eslint-disable-line no-console
app.store.dispatch(doAutoUpdate());
});
}
2019-07-29 16:34:20 +02:00
// @endif
2019-07-23 10:05:51 +02:00
}, []);
2019-02-28 00:50:00 +01:00
2019-07-23 10:05:51 +02:00
useEffect(() => {
2019-11-18 19:30:15 +01:00
if (readyToLaunch && persistDone) {
2019-07-23 10:05:51 +02:00
app.store.dispatch(doUpdateIsNightAsync());
app.store.dispatch(doDaemonReady());
app.store.dispatch(doBlackListedOutpointsSubscribe());
app.store.dispatch(doFilteredOutpointsSubscribe());
2019-10-02 20:20:25 +02:00
const appReadyTime = Date.now();
const timeToStart = appReadyTime - startTime;
analytics.readyEvent(timeToStart);
2019-07-23 10:05:51 +02:00
}
2019-11-18 19:30:15 +01:00
}, [readyToLaunch, persistDone]);
2017-06-06 06:21:55 +02:00
2019-07-23 10:05:51 +02:00
return (
<Provider store={store}>
2019-11-18 19:30:15 +01:00
<PersistGate
persistor={persistor}
onBeforeLift={() => setPersistDone(true)}
loading={<div className="main--launching" />}
>
2019-08-27 16:43:42 +02:00
<Fragment>
2019-07-23 10:05:51 +02:00
{readyToLaunch ? (
<ConnectedRouter history={history}>
<ErrorBoundary>
<App />
<SnackBar />
</ErrorBoundary>
</ConnectedRouter>
) : (
<SplashScreen
authenticate={() => app.store.dispatch(doAuthenticate(pjson.version))}
onReadyToLaunch={() => setReadyToLaunch(true)}
/>
)}
2019-08-27 16:43:42 +02:00
</Fragment>
2019-07-23 10:05:51 +02:00
</PersistGate>
</Provider>
);
}
2019-07-23 10:05:51 +02:00
ReactDOM.render(<AppWrapper />, document.getElementById('app'));