Handle stale/missing chunks #6411
12 changed files with 174 additions and 211 deletions
|
@ -3,6 +3,8 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
<link rel="icon" type="image/png" href="/public/favicon.png" />
|
<link rel="icon" type="image/png" href="/public/favicon.png" />
|
||||||
|
|
||||||
<link rel="preload" href="/public/font/v1/300.woff" as="font" type="font/woff" />
|
<link rel="preload" href="/public/font/v1/300.woff" as="font" type="font/woff" />
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
import * as PAGES from 'constants/pages';
|
import * as PAGES from 'constants/pages';
|
||||||
import React, { useEffect, useRef, useState, useLayoutEffect } from 'react';
|
import React, { useEffect, useRef, useState, useLayoutEffect } from 'react';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import analytics from 'analytics';
|
import analytics from 'analytics';
|
||||||
import { buildURI, parseURI } from 'lbry-redux';
|
import { buildURI, parseURI } from 'lbry-redux';
|
||||||
|
@ -30,29 +31,21 @@ import {
|
||||||
// @endif
|
// @endif
|
||||||
import LANGUAGE_MIGRATIONS from 'constants/language-migrations';
|
import LANGUAGE_MIGRATIONS from 'constants/language-migrations';
|
||||||
|
|
||||||
const FileDrop = React.lazy(() => import('component/fileDrop' /* webpackChunkName: "secondary" */));
|
const FileDrop = lazyImport(() => import('component/fileDrop' /* webpackChunkName: "secondary" */));
|
||||||
const ModalRouter = React.lazy(() => import('modal/modalRouter' /* webpackChunkName: "secondary" */));
|
const ModalRouter = lazyImport(() => import('modal/modalRouter' /* webpackChunkName: "secondary" */));
|
||||||
const Nag = React.lazy(() => import('component/common/nag' /* webpackChunkName: "secondary" */));
|
const Nag = lazyImport(() => import('component/common/nag' /* webpackChunkName: "secondary" */));
|
||||||
const NagContinueFirstRun = React.lazy(() =>
|
const NagContinueFirstRun = lazyImport(() => import('component/nagContinueFirstRun' /* webpackChunkName: "secondary" */));
|
||||||
import('component/nagContinueFirstRun' /* webpackChunkName: "secondary" */)
|
const OpenInAppLink = lazyImport(() => import('web/component/openInAppLink' /* webpackChunkName: "secondary" */));
|
||||||
);
|
|
||||||
const OpenInAppLink = React.lazy(() => import('web/component/openInAppLink' /* webpackChunkName: "secondary" */));
|
|
||||||
|
|
||||||
// @if TARGET='web'
|
// @if TARGET='web'
|
||||||
const NagDataCollection = React.lazy(() =>
|
const NagDataCollection = lazyImport(() => import('web/component/nag-data-collection' /* webpackChunkName: "secondary" */));
|
||||||
import('web/component/nag-data-collection' /* webpackChunkName: "secondary" */)
|
const NagDegradedPerformance = lazyImport(() => import('web/component/nag-degraded-performance' /* webpackChunkName: "secondary" */));
|
||||||
);
|
const NagNoUser = lazyImport(() => import('web/component/nag-no-user' /* webpackChunkName: "nag-no-user" */));
|
||||||
const NagDegradedPerformance = React.lazy(() =>
|
const YoutubeWelcome = lazyImport(() => import('web/component/youtubeReferralWelcome' /* webpackChunkName: "secondary" */));
|
||||||
import('web/component/nag-degraded-performance' /* webpackChunkName: "secondary" */)
|
|
||||||
);
|
|
||||||
const NagNoUser = React.lazy(() => import('web/component/nag-no-user' /* webpackChunkName: "nag-no-user" */));
|
|
||||||
const YoutubeWelcome = React.lazy(() =>
|
|
||||||
import('web/component/youtubeReferralWelcome' /* webpackChunkName: "secondary" */)
|
|
||||||
);
|
|
||||||
// @endif
|
// @endif
|
||||||
|
|
||||||
const SyncFatalError = React.lazy(() => import('component/syncFatalError' /* webpackChunkName: "syncFatalError" */));
|
const SyncFatalError = lazyImport(() => import('component/syncFatalError' /* webpackChunkName: "syncFatalError" */));
|
||||||
const Yrbl = React.lazy(() => import('component/yrbl' /* webpackChunkName: "yrbl" */));
|
const Yrbl = lazyImport(() => import('component/yrbl' /* webpackChunkName: "yrbl" */));
|
||||||
|
|
||||||
// ****************************************************************************
|
// ****************************************************************************
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
import type { Node } from 'react';
|
import type { Node } from 'react';
|
||||||
import React, { useEffect, forwardRef } from 'react';
|
import React, { useEffect, forwardRef } from 'react';
|
||||||
import { NavLink, withRouter } from 'react-router-dom';
|
import { NavLink, withRouter } from 'react-router-dom';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { parseURI, COLLECTIONS_CONSTS } from 'lbry-redux';
|
import { parseURI, COLLECTIONS_CONSTS } from 'lbry-redux';
|
||||||
import { formatLbryUrlForWeb } from 'util/url';
|
import { formatLbryUrlForWeb } from 'util/url';
|
||||||
|
@ -27,9 +28,7 @@ import { ENABLE_NO_SOURCE_CLAIMS } from 'config';
|
||||||
import Button from 'component/button';
|
import Button from 'component/button';
|
||||||
import * as ICONS from 'constants/icons';
|
import * as ICONS from 'constants/icons';
|
||||||
|
|
||||||
const AbandonedChannelPreview = React.lazy(() =>
|
const AbandonedChannelPreview = lazyImport(() => import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */));
|
||||||
import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */)
|
|
||||||
);
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
uri: string,
|
uri: string,
|
||||||
|
|
|
@ -1,15 +1,14 @@
|
||||||
// @flow
|
// @flow
|
||||||
import type { Node } from 'react';
|
import type { Node } from 'react';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import Yrbl from 'component/yrbl';
|
||||||
|
import Button from 'component/button';
|
||||||
import { withRouter } from 'react-router';
|
import { withRouter } from 'react-router';
|
||||||
import analytics from 'analytics';
|
import analytics from 'analytics';
|
||||||
|
import I18nMessage from 'component/i18nMessage';
|
||||||
import Native from 'native';
|
import Native from 'native';
|
||||||
import { Lbry } from 'lbry-redux';
|
import { Lbry } from 'lbry-redux';
|
||||||
|
|
||||||
const Button = React.lazy(() => import('component/button' /* webpackChunkName: "button" */));
|
|
||||||
const I18nMessage = React.lazy(() => import('component/i18nMessage' /* webpackChunkName: "i18nMessage" */));
|
|
||||||
const Yrbl = React.lazy(() => import('component/yrbl' /* webpackChunkName: "yrbl" */));
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
children: Node,
|
children: Node,
|
||||||
history: {
|
history: {
|
||||||
|
@ -75,7 +74,6 @@ class ErrorBoundary extends React.Component<Props, State> {
|
||||||
if (hasError) {
|
if (hasError) {
|
||||||
return (
|
return (
|
||||||
<div className="main main--full-width main--empty">
|
<div className="main main--full-width main--empty">
|
||||||
<React.Suspense fallback={null}>
|
|
||||||
<Yrbl
|
<Yrbl
|
||||||
type="sad"
|
type="sad"
|
||||||
title={__('Aw shucks!')}
|
title={__('Aw shucks!')}
|
||||||
|
@ -97,7 +95,6 @@ class ErrorBoundary extends React.Component<Props, State> {
|
||||||
</I18nMessage>
|
</I18nMessage>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
</React.Suspense>
|
|
||||||
{!errorWasReported && (
|
{!errorWasReported && (
|
||||||
<div className="error__wrapper">
|
<div className="error__wrapper">
|
||||||
<span className="error__text">
|
<span className="error__text">
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
import { remote } from 'electron';
|
import { remote } from 'electron';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import * as RENDER_MODES from 'constants/file_render_modes';
|
import * as RENDER_MODES from 'constants/file_render_modes';
|
||||||
import VideoViewer from 'component/viewers/videoViewer';
|
import VideoViewer from 'component/viewers/videoViewer';
|
||||||
|
@ -17,10 +18,10 @@ import ComicBookViewer from 'component/viewers/comicBookViewer';
|
||||||
import ThreeViewer from 'component/viewers/threeViewer';
|
import ThreeViewer from 'component/viewers/threeViewer';
|
||||||
// @endif
|
// @endif
|
||||||
|
|
||||||
const AppViewer = React.lazy(() => import('component/viewers/appViewer' /* webpackChunkName: "appViewer" */));
|
const AppViewer = lazyImport(() => import('component/viewers/appViewer' /* webpackChunkName: "appViewer" */));
|
||||||
const HtmlViewer = React.lazy(() => import('component/viewers/htmlViewer' /* webpackChunkName: "htmlViewer" */));
|
const HtmlViewer = lazyImport(() => import('component/viewers/htmlViewer' /* webpackChunkName: "htmlViewer" */));
|
||||||
const ImageViewer = React.lazy(() => import('component/viewers/imageViewer' /* webpackChunkName: "imageViewer" */));
|
const ImageViewer = lazyImport(() => import('component/viewers/imageViewer' /* webpackChunkName: "imageViewer" */));
|
||||||
const PdfViewer = React.lazy(() => import('component/viewers/pdfViewer' /* webpackChunkName: "pdfViewer" */));
|
const PdfViewer = lazyImport(() => import('component/viewers/pdfViewer' /* webpackChunkName: "pdfViewer" */));
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
uri: string,
|
uri: string,
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
import type { Node } from 'react';
|
import type { Node } from 'react';
|
||||||
import React, { Fragment } from 'react';
|
import React, { Fragment } from 'react';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import SideNavigation from 'component/sideNavigation';
|
import SideNavigation from 'component/sideNavigation';
|
||||||
import Header from 'component/header';
|
import Header from 'component/header';
|
||||||
/* @if TARGET='app' */
|
/* @if TARGET='app' */
|
||||||
|
@ -12,7 +13,7 @@ import { useHistory } from 'react-router';
|
||||||
import { useIsMobile, useIsMediumScreen } from 'effects/use-screensize';
|
import { useIsMobile, useIsMediumScreen } from 'effects/use-screensize';
|
||||||
import { parseURI } from 'lbry-redux';
|
import { parseURI } from 'lbry-redux';
|
||||||
|
|
||||||
const Footer = React.lazy(() => import('web/component/footer' /* webpackChunkName: "secondary" */));
|
const Footer = lazyImport(() => import('web/component/footer' /* webpackChunkName: "secondary" */));
|
||||||
|
|
||||||
export const MAIN_CLASS = 'main';
|
export const MAIN_CLASS = 'main';
|
||||||
type Props = {
|
type Props = {
|
||||||
|
|
|
@ -3,6 +3,7 @@ import React, { useEffect } from 'react';
|
||||||
import { Route, Redirect, Switch, withRouter } from 'react-router-dom';
|
import { Route, Redirect, Switch, withRouter } from 'react-router-dom';
|
||||||
|
|
||||||
import * as PAGES from 'constants/pages';
|
import * as PAGES from 'constants/pages';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
|
import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
|
||||||
import { parseURI, isURIValid } from 'lbry-redux';
|
import { parseURI, isURIValid } from 'lbry-redux';
|
||||||
import { SITE_TITLE, WELCOME_VERSION, SIMPLE_SITE } from 'config';
|
import { SITE_TITLE, WELCOME_VERSION, SIMPLE_SITE } from 'config';
|
||||||
|
@ -11,75 +12,67 @@ import LoadingBarOneOff from 'component/loadingBarOneOff';
|
||||||
import HomePage from 'page/home';
|
import HomePage from 'page/home';
|
||||||
|
|
||||||
// @if TARGET='app'
|
// @if TARGET='app'
|
||||||
const BackupPage = React.lazy(() => import('page/backup' /* webpackChunkName: "backup" */));
|
const BackupPage = lazyImport(() => import('page/backup' /* webpackChunkName: "backup" */));
|
||||||
// @endif
|
// @endif
|
||||||
|
|
||||||
// @if TARGET='web'
|
// @if TARGET='web'
|
||||||
const Code2257Page = React.lazy(() => import('web/page/code2257'));
|
const Code2257Page = lazyImport(() => import('web/page/code2257' /* webpackChunkName: "code2257" */));
|
||||||
// @endif
|
// @endif
|
||||||
|
|
||||||
// Chunk: "secondary"
|
// Chunk: "secondary"
|
||||||
const SignInPage = React.lazy(() => import('page/signIn' /* webpackChunkName: "secondary" */));
|
const SignInPage = lazyImport(() => import('page/signIn' /* webpackChunkName: "secondary" */));
|
||||||
const SignInWalletPasswordPage = React.lazy(() =>
|
const SignInWalletPasswordPage = lazyImport(() => import('page/signInWalletPassword' /* webpackChunkName: "secondary" */));
|
||||||
import('page/signInWalletPassword' /* webpackChunkName: "secondary" */)
|
const SignUpPage = lazyImport(() => import('page/signUp' /* webpackChunkName: "secondary" */));
|
||||||
);
|
const SignInVerifyPage = lazyImport(() => import('page/signInVerify' /* webpackChunkName: "secondary" */));
|
||||||
const SignUpPage = React.lazy(() => import('page/signUp' /* webpackChunkName: "secondary" */));
|
|
||||||
const SignInVerifyPage = React.lazy(() => import('page/signInVerify' /* webpackChunkName: "secondary" */));
|
|
||||||
|
|
||||||
// Chunk: "wallet/secondary"
|
// Chunk: "wallet/secondary"
|
||||||
const BuyPage = React.lazy(() => import('page/buy' /* webpackChunkName: "secondary" */));
|
const BuyPage = lazyImport(() => import('page/buy' /* webpackChunkName: "secondary" */));
|
||||||
const ReceivePage = React.lazy(() => import('page/receive' /* webpackChunkName: "secondary" */));
|
const ReceivePage = lazyImport(() => import('page/receive' /* webpackChunkName: "secondary" */));
|
||||||
const SendPage = React.lazy(() => import('page/send' /* webpackChunkName: "secondary" */));
|
const SendPage = lazyImport(() => import('page/send' /* webpackChunkName: "secondary" */));
|
||||||
const SwapPage = React.lazy(() => import('page/swap' /* webpackChunkName: "secondary" */));
|
const SwapPage = lazyImport(() => import('page/swap' /* webpackChunkName: "secondary" */));
|
||||||
const WalletPage = React.lazy(() => import('page/wallet' /* webpackChunkName: "secondary" */));
|
const WalletPage = lazyImport(() => import('page/wallet' /* webpackChunkName: "secondary" */));
|
||||||
|
|
||||||
// Chunk: none
|
// Chunk: none
|
||||||
const NotificationsPage = React.lazy(() => import('page/notifications' /* webpackChunkName: "secondary" */));
|
const NotificationsPage = lazyImport(() => import('page/notifications' /* webpackChunkName: "secondary" */));
|
||||||
const CollectionPage = React.lazy(() => import('page/collection' /* webpackChunkName: "secondary" */));
|
const CollectionPage = lazyImport(() => import('page/collection' /* webpackChunkName: "secondary" */));
|
||||||
const ChannelNew = React.lazy(() => import('page/channelNew' /* webpackChunkName: "secondary" */));
|
const ChannelNew = lazyImport(() => import('page/channelNew' /* webpackChunkName: "secondary" */));
|
||||||
const ChannelsFollowingDiscoverPage = React.lazy(() =>
|
const ChannelsFollowingDiscoverPage = lazyImport(() => import('page/channelsFollowingDiscover' /* webpackChunkName: "secondary" */));
|
||||||
import('page/channelsFollowingDiscover' /* webpackChunkName: "secondary" */)
|
const ChannelsFollowingPage = lazyImport(() => import('page/channelsFollowing' /* webpackChunkName: "secondary" */));
|
||||||
);
|
const ChannelsPage = lazyImport(() => import('page/channels' /* webpackChunkName: "secondary" */));
|
||||||
const ChannelsFollowingPage = React.lazy(() => import('page/channelsFollowing' /* webpackChunkName: "secondary" */));
|
const CheckoutPage = lazyImport(() => import('page/checkoutPage' /* webpackChunkName: "checkoutPage" */));
|
||||||
const ChannelsPage = React.lazy(() => import('page/channels' /* webpackChunkName: "secondary" */));
|
const CreatorDashboard = lazyImport(() => import('page/creatorDashboard' /* webpackChunkName: "secondary" */));
|
||||||
const CheckoutPage = React.lazy(() => import('page/checkoutPage' /* webpackChunkName: "checkoutPage" */));
|
const DiscoverPage = lazyImport(() => import('page/discover' /* webpackChunkName: "secondary" */));
|
||||||
const CreatorDashboard = React.lazy(() => import('page/creatorDashboard' /* webpackChunkName: "secondary" */));
|
const EmbedWrapperPage = lazyImport(() => import('page/embedWrapper' /* webpackChunkName: "secondary" */));
|
||||||
const DiscoverPage = React.lazy(() => import('page/discover' /* webpackChunkName: "secondary" */));
|
const FileListPublished = lazyImport(() => import('page/fileListPublished' /* webpackChunkName: "secondary" */));
|
||||||
const EmbedWrapperPage = React.lazy(() => import('page/embedWrapper' /* webpackChunkName: "secondary" */));
|
const FourOhFourPage = lazyImport(() => import('page/fourOhFour' /* webpackChunkName: "fourOhFour" */));
|
||||||
const FileListPublished = React.lazy(() => import('page/fileListPublished' /* webpackChunkName: "secondary" */));
|
const HelpPage = lazyImport(() => import('page/help' /* webpackChunkName: "help" */));
|
||||||
const FourOhFourPage = React.lazy(() => import('page/fourOhFour' /* webpackChunkName: "fourOhFour" */));
|
const InvitePage = lazyImport(() => import('page/invite' /* webpackChunkName: "secondary" */));
|
||||||
const HelpPage = React.lazy(() => import('page/help' /* webpackChunkName: "help" */));
|
const InvitedPage = lazyImport(() => import('page/invited' /* webpackChunkName: "secondary" */));
|
||||||
const InvitePage = React.lazy(() => import('page/invite' /* webpackChunkName: "secondary" */));
|
const LibraryPage = lazyImport(() => import('page/library' /* webpackChunkName: "secondary" */));
|
||||||
const InvitedPage = React.lazy(() => import('page/invited' /* webpackChunkName: "secondary" */));
|
const ListBlockedPage = lazyImport(() => import('page/listBlocked' /* webpackChunkName: "secondary" */));
|
||||||
const LibraryPage = React.lazy(() => import('page/library' /* webpackChunkName: "secondary" */));
|
const ListsPage = lazyImport(() => import('page/lists' /* webpackChunkName: "secondary" */));
|
||||||
const ListBlockedPage = React.lazy(() => import('page/listBlocked' /* webpackChunkName: "secondary" */));
|
const LiveStreamSetupPage = lazyImport(() => import('page/livestreamSetup' /* webpackChunkName: "secondary" */));
|
||||||
const ListsPage = React.lazy(() => import('page/lists' /* webpackChunkName: "secondary" */));
|
const LivestreamCurrentPage = lazyImport(() => import('page/livestreamCurrent' /* webpackChunkName: "secondary" */));
|
||||||
const LiveStreamSetupPage = React.lazy(() => import('page/livestreamSetup' /* webpackChunkName: "secondary" */));
|
const PasswordResetPage = lazyImport(() => import('page/passwordReset' /* webpackChunkName: "secondary" */));
|
||||||
const LivestreamCurrentPage = React.lazy(() => import('page/livestreamCurrent' /* webpackChunkName: "secondary" */));
|
const PasswordSetPage = lazyImport(() => import('page/passwordSet' /* webpackChunkName: "secondary" */));
|
||||||
const PasswordResetPage = React.lazy(() => import('page/passwordReset' /* webpackChunkName: "secondary" */));
|
const PublishPage = lazyImport(() => import('page/publish' /* webpackChunkName: "secondary" */));
|
||||||
const PasswordSetPage = React.lazy(() => import('page/passwordSet' /* webpackChunkName: "secondary" */));
|
const ReportContentPage = lazyImport(() => import('page/reportContent' /* webpackChunkName: "secondary" */));
|
||||||
const PublishPage = React.lazy(() => import('page/publish' /* webpackChunkName: "secondary" */));
|
const ReportPage = lazyImport(() => import('page/report' /* webpackChunkName: "secondary" */));
|
||||||
const ReportContentPage = React.lazy(() => import('page/reportContent' /* webpackChunkName: "secondary" */));
|
const RepostNew = lazyImport(() => import('page/repost' /* webpackChunkName: "secondary" */));
|
||||||
const ReportPage = React.lazy(() => import('page/report' /* webpackChunkName: "secondary" */));
|
const RewardsPage = lazyImport(() => import('page/rewards' /* webpackChunkName: "secondary" */));
|
||||||
const RepostNew = React.lazy(() => import('page/repost' /* webpackChunkName: "secondary" */));
|
const RewardsVerifyPage = lazyImport(() => import('page/rewardsVerify' /* webpackChunkName: "secondary" */));
|
||||||
const RewardsPage = React.lazy(() => import('page/rewards' /* webpackChunkName: "secondary" */));
|
const SearchPage = lazyImport(() => import('page/search' /* webpackChunkName: "secondary" */));
|
||||||
const RewardsVerifyPage = React.lazy(() => import('page/rewardsVerify' /* webpackChunkName: "secondary" */));
|
const SettingsAdvancedPage = lazyImport(() => import('page/settingsAdvanced' /* webpackChunkName: "secondary" */));
|
||||||
const SearchPage = React.lazy(() => import('page/search' /* webpackChunkName: "secondary" */));
|
const SettingsStripeCard = lazyImport(() => import('page/settingsStripeCard' /* webpackChunkName: "secondary" */));
|
||||||
const SettingsAdvancedPage = React.lazy(() => import('page/settingsAdvanced' /* webpackChunkName: "secondary" */));
|
const SettingsCreatorPage = lazyImport(() => import('page/settingsCreator' /* webpackChunkName: "secondary" */));
|
||||||
const SettingsStripeCard = React.lazy(() => import('page/settingsStripeCard' /* webpackChunkName: "secondary" */));
|
const SettingsNotificationsPage = lazyImport(() => import('page/settingsNotifications' /* webpackChunkName: "secondary" */));
|
||||||
const SettingsCreatorPage = React.lazy(() => import('page/settingsCreator' /* webpackChunkName: "secondary" */));
|
const SettingsPage = lazyImport(() => import('page/settings' /* webpackChunkName: "secondary" */));
|
||||||
const SettingsNotificationsPage = React.lazy(() =>
|
const ShowPage = lazyImport(() => import('page/show' /* webpackChunkName: "secondary" */));
|
||||||
import('page/settingsNotifications' /* webpackChunkName: "secondary" */)
|
const TagsFollowingManagePage = lazyImport(() => import('page/tagsFollowingManage' /* webpackChunkName: "secondary" */));
|
||||||
);
|
const TagsFollowingPage = lazyImport(() => import('page/tagsFollowing' /* webpackChunkName: "secondary" */));
|
||||||
const SettingsPage = React.lazy(() => import('page/settings' /* webpackChunkName: "secondary" */));
|
const TopPage = lazyImport(() => import('page/top' /* webpackChunkName: "secondary" */));
|
||||||
const ShowPage = React.lazy(() => import('page/show' /* webpackChunkName: "secondary" */));
|
const Welcome = lazyImport(() => import('page/welcome' /* webpackChunkName: "secondary" */));
|
||||||
const TagsFollowingManagePage = React.lazy(() =>
|
const YoutubeSyncPage = lazyImport(() => import('page/youtubeSync' /* webpackChunkName: "secondary" */));
|
||||||
import('page/tagsFollowingManage' /* webpackChunkName: "secondary" */)
|
|
||||||
);
|
|
||||||
const TagsFollowingPage = React.lazy(() => import('page/tagsFollowing' /* webpackChunkName: "secondary" */));
|
|
||||||
const TopPage = React.lazy(() => import('page/top' /* webpackChunkName: "secondary" */));
|
|
||||||
const Welcome = React.lazy(() => import('page/welcome' /* webpackChunkName: "secondary" */));
|
|
||||||
const YoutubeSyncPage = React.lazy(() => import('page/youtubeSync' /* webpackChunkName: "secondary" */));
|
|
||||||
|
|
||||||
// Tell the browser we are handling scroll restoration
|
// Tell the browser we are handling scroll restoration
|
||||||
if ('scrollRestoration' in history) {
|
if ('scrollRestoration' in history) {
|
||||||
|
|
|
@ -1,13 +1,12 @@
|
||||||
// @flow
|
// @flow
|
||||||
import * as ICONS from 'constants/icons';
|
import * as ICONS from 'constants/icons';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import { useIsMobile } from 'effects/use-screensize';
|
import { useIsMobile } from 'effects/use-screensize';
|
||||||
|
|
||||||
const Button = React.lazy(() => import('component/button' /* webpackChunkName: "button" */));
|
const Button = lazyImport(() => import('component/button' /* webpackChunkName: "button" */));
|
||||||
const Icon = React.lazy(() => import('component/common/icon' /* webpackChunkName: "icon" */));
|
const Icon = lazyImport(() => import('component/common/icon' /* webpackChunkName: "icon" */));
|
||||||
const WunderbarSuggestions = React.lazy(() =>
|
const WunderbarSuggestions = lazyImport(() => import('component/wunderbarSuggestions' /* webpackChunkName: "secondary" */));
|
||||||
import('component/wunderbarSuggestions' /* webpackChunkName: "secondary" */)
|
|
||||||
);
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
doOpenMobileSearch: (any) => void,
|
doOpenMobileSearch: (any) => void,
|
||||||
|
|
|
@ -1,95 +1,50 @@
|
||||||
// @flow
|
// @flow
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { withRouter } from 'react-router';
|
import { withRouter } from 'react-router';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import * as MODALS from 'constants/modal_types';
|
import * as MODALS from 'constants/modal_types';
|
||||||
import LoadingBarOneOff from 'component/loadingBarOneOff';
|
import LoadingBarOneOff from 'component/loadingBarOneOff';
|
||||||
|
|
||||||
const ModalAffirmPurchase = React.lazy(() =>
|
const ModalAffirmPurchase = lazyImport(() => import('modal/modalAffirmPurchase' /* webpackChunkName: "modalAffirmPurchase" */));
|
||||||
import('modal/modalAffirmPurchase' /* webpackChunkName: "modalAffirmPurchase" */)
|
const ModalAutoGenerateThumbnail = lazyImport(() => import('modal/modalAutoGenerateThumbnail' /* webpackChunkName: "modalAutoGenerateThumbnail" */));
|
||||||
);
|
const ModalAutoUpdateDownloaded = lazyImport(() => import('modal/modalAutoUpdateDownloaded' /* webpackChunkName: "modalAutoUpdateDownloaded" */));
|
||||||
const ModalAutoGenerateThumbnail = React.lazy(() =>
|
const ModalClaimCollectionAdd = lazyImport(() => import('modal/modalClaimCollectionAdd' /* webpackChunkName: "modalClaimCollectionAdd" */));
|
||||||
import('modal/modalAutoGenerateThumbnail' /* webpackChunkName: "modalAutoGenerateThumbnail" */)
|
const ModalCommentAcknowledgement = lazyImport(() => import('modal/modalCommentAcknowledgement' /* webpackChunkName: "modalCommentAcknowledgement" */));
|
||||||
);
|
const ModalConfirmAge = lazyImport(() => import('modal/modalConfirmAge' /* webpackChunkName: "modalConfirmAge" */));
|
||||||
const ModalAutoUpdateDownloaded = React.lazy(() =>
|
const ModalConfirmThumbnailUpload = lazyImport(() => import('modal/modalConfirmThumbnailUpload' /* webpackChunkName: "modalConfirmThumbnailUpload" */));
|
||||||
import('modal/modalAutoUpdateDownloaded' /* webpackChunkName: "modalAutoUpdateDownloaded" */)
|
const ModalConfirmTransaction = lazyImport(() => import('modal/modalConfirmTransaction' /* webpackChunkName: "modalConfirmTransaction" */));
|
||||||
);
|
const ModalDeleteCollection = lazyImport(() => import('modal/modalRemoveCollection' /* webpackChunkName: "modalRemoveCollection" */));
|
||||||
const ModalClaimCollectionAdd = React.lazy(() =>
|
const ModalDownloading = lazyImport(() => import('modal/modalDownloading' /* webpackChunkName: "modalDownloading" */));
|
||||||
import('modal/modalClaimCollectionAdd' /* webpackChunkName: "modalClaimCollectionAdd" */)
|
const ModalError = lazyImport(() => import('modal/modalError' /* webpackChunkName: "modalError" */));
|
||||||
);
|
const ModalFileSelection = lazyImport(() => import('modal/modalFileSelection' /* webpackChunkName: "modalFileSelection" */));
|
||||||
const ModalCommentAcknowledgement = React.lazy(() =>
|
const ModalFileTimeout = lazyImport(() => import('modal/modalFileTimeout' /* webpackChunkName: "modalFileTimeout" */));
|
||||||
import('modal/modalCommentAcknowledgement' /* webpackChunkName: "modalCommentAcknowledgement" */)
|
const ModalFirstReward = lazyImport(() => import('modal/modalFirstReward' /* webpackChunkName: "modalFirstReward" */));
|
||||||
);
|
const ModalFirstSubscription = lazyImport(() => import('modal/modalFirstSubscription' /* webpackChunkName: "modalFirstSubscription" */));
|
||||||
const ModalConfirmAge = React.lazy(() => import('modal/modalConfirmAge' /* webpackChunkName: "modalConfirmAge" */));
|
const ModalImageUpload = lazyImport(() => import('modal/modalImageUpload' /* webpackChunkName: "modalImageUpload" */));
|
||||||
const ModalConfirmThumbnailUpload = React.lazy(() =>
|
const ModalMassTipsUnlock = lazyImport(() => import('modal/modalMassTipUnlock' /* webpackChunkName: "modalMassTipUnlock" */));
|
||||||
import('modal/modalConfirmThumbnailUpload' /* webpackChunkName: "modalConfirmThumbnailUpload" */)
|
const ModalMobileSearch = lazyImport(() => import('modal/modalMobileSearch' /* webpackChunkName: "modalMobileSearch" */));
|
||||||
);
|
const ModalOpenExternalResource = lazyImport(() => import('modal/modalOpenExternalResource' /* webpackChunkName: "modalOpenExternalResource" */));
|
||||||
const ModalConfirmTransaction = React.lazy(() =>
|
const ModalPasswordUnsave = lazyImport(() => import('modal/modalPasswordUnsave' /* webpackChunkName: "modalPasswordUnsave" */));
|
||||||
import('modal/modalConfirmTransaction' /* webpackChunkName: "modalConfirmTransaction" */)
|
const ModalPhoneCollection = lazyImport(() => import('modal/modalPhoneCollection' /* webpackChunkName: "modalPhoneCollection" */));
|
||||||
);
|
const ModalPublish = lazyImport(() => import('modal/modalPublish' /* webpackChunkName: "modalPublish" */));
|
||||||
const ModalDeleteCollection = React.lazy(() =>
|
const ModalPublishPreview = lazyImport(() => import('modal/modalPublishPreview' /* webpackChunkName: "modalPublishPreview" */));
|
||||||
import('modal/modalRemoveCollection' /* webpackChunkName: "modalRemoveCollection" */)
|
const ModalRemoveBtcSwapAddress = lazyImport(() => import('modal/modalRemoveBtcSwapAddress' /* webpackChunkName: "modalRemoveBtcSwapAddress" */));
|
||||||
);
|
const ModalRemoveFile = lazyImport(() => import('modal/modalRemoveFile' /* webpackChunkName: "modalRemoveFile" */));
|
||||||
const ModalDownloading = React.lazy(() => import('modal/modalDownloading' /* webpackChunkName: "modalDownloading" */));
|
const ModalRevokeClaim = lazyImport(() => import('modal/modalRevokeClaim' /* webpackChunkName: "modalRevokeClaim" */));
|
||||||
const ModalError = React.lazy(() => import('modal/modalError' /* webpackChunkName: "modalError" */));
|
const ModalRewardCode = lazyImport(() => import('modal/modalRewardCode' /* webpackChunkName: "modalRewardCode" */));
|
||||||
const ModalFileSelection = React.lazy(() =>
|
const ModalSendTip = lazyImport(() => import('modal/modalSendTip' /* webpackChunkName: "modalSendTip" */));
|
||||||
import('modal/modalFileSelection' /* webpackChunkName: "modalFileSelection" */)
|
const ModalSetReferrer = lazyImport(() => import('modal/modalSetReferrer' /* webpackChunkName: "modalSetReferrer" */));
|
||||||
);
|
const ModalSignOut = lazyImport(() => import('modal/modalSignOut' /* webpackChunkName: "modalSignOut" */));
|
||||||
const ModalFileTimeout = React.lazy(() => import('modal/modalFileTimeout' /* webpackChunkName: "modalFileTimeout" */));
|
const ModalSocialShare = lazyImport(() => import('modal/modalSocialShare' /* webpackChunkName: "modalSocialShare" */));
|
||||||
const ModalFirstReward = React.lazy(() => import('modal/modalFirstReward' /* webpackChunkName: "modalFirstReward" */));
|
const ModalSupportsLiquidate = lazyImport(() => import('modal/modalSupportsLiquidate' /* webpackChunkName: "modalSupportsLiquidate" */));
|
||||||
const ModalFirstSubscription = React.lazy(() =>
|
const ModalSyncEnable = lazyImport(() => import('modal/modalSyncEnable' /* webpackChunkName: "modalSyncEnable" */));
|
||||||
import('modal/modalFirstSubscription' /* webpackChunkName: "modalFirstSubscription" */)
|
const ModalTransactionFailed = lazyImport(() => import('modal/modalTransactionFailed' /* webpackChunkName: "modalTransactionFailed" */));
|
||||||
);
|
const ModalUpgrade = lazyImport(() => import('modal/modalUpgrade' /* webpackChunkName: "modalUpgrade" */));
|
||||||
const ModalImageUpload = React.lazy(() => import('modal/modalImageUpload' /* webpackChunkName: "modalImageUpload" */));
|
const ModalViewImage = lazyImport(() => import('modal/modalViewImage' /* webpackChunkName: "modalViewImage" */));
|
||||||
const ModalMassTipsUnlock = React.lazy(() =>
|
const ModalWalletDecrypt = lazyImport(() => import('modal/modalWalletDecrypt' /* webpackChunkName: "modalWalletDecrypt" */));
|
||||||
import('modal/modalMassTipUnlock' /* webpackChunkName: "modalMassTipUnlock" */)
|
const ModalWalletEncrypt = lazyImport(() => import('modal/modalWalletEncrypt' /* webpackChunkName: "modalWalletEncrypt" */));
|
||||||
);
|
const ModalWalletUnlock = lazyImport(() => import('modal/modalWalletUnlock' /* webpackChunkName: "modalWalletUnlock" */));
|
||||||
const ModalMobileSearch = React.lazy(() =>
|
const ModalYoutubeWelcome = lazyImport(() => import('modal/modalYoutubeWelcome' /* webpackChunkName: "modalYoutubeWelcome" */));
|
||||||
import('modal/modalMobileSearch' /* webpackChunkName: "modalMobileSearch" */)
|
|
||||||
);
|
|
||||||
const ModalOpenExternalResource = React.lazy(() =>
|
|
||||||
import('modal/modalOpenExternalResource' /* webpackChunkName: "modalOpenExternalResource" */)
|
|
||||||
);
|
|
||||||
const ModalPasswordUnsave = React.lazy(() =>
|
|
||||||
import('modal/modalPasswordUnsave' /* webpackChunkName: "modalPasswordUnsave" */)
|
|
||||||
);
|
|
||||||
const ModalPhoneCollection = React.lazy(() =>
|
|
||||||
import('modal/modalPhoneCollection' /* webpackChunkName: "modalPhoneCollection" */)
|
|
||||||
);
|
|
||||||
const ModalPublish = React.lazy(() => import('modal/modalPublish' /* webpackChunkName: "modalPublish" */));
|
|
||||||
const ModalPublishPreview = React.lazy(() =>
|
|
||||||
import('modal/modalPublishPreview' /* webpackChunkName: "modalPublishPreview" */)
|
|
||||||
);
|
|
||||||
const ModalRemoveBtcSwapAddress = React.lazy(() =>
|
|
||||||
import('modal/modalRemoveBtcSwapAddress' /* webpackChunkName: "modalRemoveBtcSwapAddress" */)
|
|
||||||
);
|
|
||||||
const ModalRemoveFile = React.lazy(() => import('modal/modalRemoveFile' /* webpackChunkName: "modalRemoveFile" */));
|
|
||||||
const ModalRevokeClaim = React.lazy(() => import('modal/modalRevokeClaim' /* webpackChunkName: "modalRevokeClaim" */));
|
|
||||||
const ModalRewardCode = React.lazy(() => import('modal/modalRewardCode' /* webpackChunkName: "modalRewardCode" */));
|
|
||||||
const ModalSendTip = React.lazy(() => import('modal/modalSendTip' /* webpackChunkName: "modalSendTip" */));
|
|
||||||
const ModalSetReferrer = React.lazy(() => import('modal/modalSetReferrer' /* webpackChunkName: "modalSetReferrer" */));
|
|
||||||
const ModalSignOut = React.lazy(() => import('modal/modalSignOut' /* webpackChunkName: "modalSignOut" */));
|
|
||||||
const ModalSocialShare = React.lazy(() => import('modal/modalSocialShare' /* webpackChunkName: "modalSocialShare" */));
|
|
||||||
const ModalSupportsLiquidate = React.lazy(() =>
|
|
||||||
import('modal/modalSupportsLiquidate' /* webpackChunkName: "modalSupportsLiquidate" */)
|
|
||||||
);
|
|
||||||
const ModalSyncEnable = React.lazy(() => import('modal/modalSyncEnable' /* webpackChunkName: "modalSyncEnable" */));
|
|
||||||
const ModalTransactionFailed = React.lazy(() =>
|
|
||||||
import('modal/modalTransactionFailed' /* webpackChunkName: "modalTransactionFailed" */)
|
|
||||||
);
|
|
||||||
const ModalUpgrade = React.lazy(() => import('modal/modalUpgrade' /* webpackChunkName: "modalUpgrade" */));
|
|
||||||
const ModalViewImage = React.lazy(() => import('modal/modalViewImage' /* webpackChunkName: "modalViewImage" */));
|
|
||||||
const ModalWalletDecrypt = React.lazy(() =>
|
|
||||||
import('modal/modalWalletDecrypt' /* webpackChunkName: "modalWalletDecrypt" */)
|
|
||||||
);
|
|
||||||
const ModalWalletEncrypt = React.lazy(() =>
|
|
||||||
import('modal/modalWalletEncrypt' /* webpackChunkName: "modalWalletEncrypt" */)
|
|
||||||
);
|
|
||||||
const ModalWalletUnlock = React.lazy(() =>
|
|
||||||
import('modal/modalWalletUnlock' /* webpackChunkName: "modalWalletUnlock" */)
|
|
||||||
);
|
|
||||||
const ModalYoutubeWelcome = React.lazy(() =>
|
|
||||||
import('modal/modalYoutubeWelcome' /* webpackChunkName: "modalYoutubeWelcome" */)
|
|
||||||
);
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
modal: { id: string, modalProps: {} },
|
modal: { id: string, modalProps: {} },
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import Page from 'component/page';
|
import Page from 'component/page';
|
||||||
import * as RENDER_MODES from 'constants/file_render_modes';
|
import * as RENDER_MODES from 'constants/file_render_modes';
|
||||||
import FileTitleSection from 'component/fileTitleSection';
|
import FileTitleSection from 'component/fileTitleSection';
|
||||||
|
@ -12,7 +13,7 @@ import CollectionContent from 'component/collectionContentSidebar';
|
||||||
import CommentsList from 'component/commentsList';
|
import CommentsList from 'component/commentsList';
|
||||||
import Empty from 'component/common/empty';
|
import Empty from 'component/common/empty';
|
||||||
|
|
||||||
const PostViewer = React.lazy(() => import('component/postViewer' /* webpackChunkName: "postViewer" */));
|
const PostViewer = lazyImport(() => import('component/postViewer' /* webpackChunkName: "postViewer" */));
|
||||||
|
|
||||||
export const PRIMARY_PLAYER_WRAPPER_CLASS = 'file-page__video-container';
|
export const PRIMARY_PLAYER_WRAPPER_CLASS = 'file-page__video-container';
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
import { DOMAIN } from 'config';
|
import { DOMAIN } from 'config';
|
||||||
import * as PAGES from 'constants/pages';
|
import * as PAGES from 'constants/pages';
|
||||||
import React, { useEffect } from 'react';
|
import React, { useEffect } from 'react';
|
||||||
|
import { lazyImport } from 'util/lazyImport';
|
||||||
import { Redirect, useHistory } from 'react-router-dom';
|
import { Redirect, useHistory } from 'react-router-dom';
|
||||||
import Spinner from 'component/spinner';
|
import Spinner from 'component/spinner';
|
||||||
import ChannelPage from 'page/channel';
|
import ChannelPage from 'page/channel';
|
||||||
|
@ -11,12 +12,10 @@ import Card from 'component/common/card';
|
||||||
import { formatLbryUrlForWeb } from 'util/url';
|
import { formatLbryUrlForWeb } from 'util/url';
|
||||||
import { parseURI, COLLECTIONS_CONSTS } from 'lbry-redux';
|
import { parseURI, COLLECTIONS_CONSTS } from 'lbry-redux';
|
||||||
|
|
||||||
const AbandonedChannelPreview = React.lazy(() =>
|
const AbandonedChannelPreview = lazyImport(() => import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */));
|
||||||
import('component/abandonedChannelPreview' /* webpackChunkName: "abandonedChannelPreview" */)
|
const FilePage = lazyImport(() => import('page/file' /* webpackChunkName: "filePage" */));
|
||||||
);
|
const LivestreamPage = lazyImport(() => import('page/livestream' /* webpackChunkName: "livestream" */));
|
||||||
const FilePage = React.lazy(() => import('page/file' /* webpackChunkName: "filePage" */));
|
const Yrbl = lazyImport(() => import('component/yrbl' /* webpackChunkName: "yrbl" */));
|
||||||
const LivestreamPage = React.lazy(() => import('page/livestream' /* webpackChunkName: "livestream" */));
|
|
||||||
const Yrbl = React.lazy(() => import('component/yrbl' /* webpackChunkName: "yrbl" */));
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
isResolvingUri: boolean,
|
isResolvingUri: boolean,
|
||||||
|
|
23
ui/util/lazyImport.js
Normal file
23
ui/util/lazyImport.js
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
export const lazyImport = (componentImport) =>
|
||||||
|
React.lazy(async () => {
|
||||||
|
const pageHasAlreadyBeenForceRefreshed = JSON.parse(
|
||||||
|
window.localStorage.getItem('page-has-been-force-refreshed') || 'false'
|
||||||
|
);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const component = await componentImport();
|
||||||
|
window.localStorage.setItem('page-has-been-force-refreshed', 'false');
|
||||||
|
return component;
|
||||||
|
} catch (error) {
|
||||||
|
if (!pageHasAlreadyBeenForceRefreshed) {
|
||||||
|
// It's highly likely that the user's session is old. Try reloading once.
|
||||||
|
window.localStorage.setItem('page-has-been-force-refreshed', 'true');
|
||||||
|
return window.location.reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
// If it still didn't work, then relay the error.
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
});
|
Loading…
Reference in a new issue