2020-05-11 06:21:16 +02:00
|
|
|
import * as React from 'react';
|
2020-04-12 18:27:01 +02:00
|
|
|
import { ThemeProvider } from 'styled-components';
|
|
|
|
|
import { ModalProvider, BaseModalBackground } from 'styled-react-modal';
|
2020-05-15 19:48:00 +02:00
|
|
|
import { ApolloProvider } from '@apollo/react-hooks';
|
|
|
|
|
import { useRouter } from 'next/router';
|
|
|
|
|
import { toast } from 'react-toastify';
|
|
|
|
|
import Head from 'next/head';
|
2020-05-19 07:50:16 +02:00
|
|
|
import { AuthSSOCheck } from 'src/components/accounts/AuthSSOCheck';
|
|
|
|
|
import { getUrlParam } from 'src/utils/url';
|
|
|
|
|
import { ChatInit } from 'src/components/chat/ChatInit';
|
|
|
|
|
import { ServerAccounts } from 'src/components/accounts/ServerAccounts';
|
|
|
|
|
import { useAccountState } from 'src/context/AccountContext';
|
|
|
|
|
import { LoadingCard } from 'src/components/loading/LoadingCard';
|
2020-05-15 19:48:00 +02:00
|
|
|
import { ContextProvider } from '../src/context/ContextProvider';
|
|
|
|
|
import { useConfigState, ConfigProvider } from '../src/context/ConfigContext';
|
2020-04-12 18:27:01 +02:00
|
|
|
import { GlobalStyles } from '../src/styles/GlobalStyle';
|
|
|
|
|
import { Header } from '../src/layouts/header/Header';
|
|
|
|
|
import { Footer } from '../src/layouts/footer/Footer';
|
|
|
|
|
import withApollo from '../config/apolloClient';
|
|
|
|
|
import { BitcoinFees } from '../src/components/bitcoinInfo/BitcoinFees';
|
|
|
|
|
import { BitcoinPrice } from '../src/components/bitcoinInfo/BitcoinPrice';
|
|
|
|
|
import { GridWrapper } from '../src/components/gridWrapper/GridWrapper';
|
|
|
|
|
import 'react-toastify/dist/ReactToastify.css';
|
2020-04-17 20:11:37 +02:00
|
|
|
import { PageWrapper, HeaderBodyWrapper } from '../src/layouts/Layout.styled';
|
2020-04-22 10:14:33 +02:00
|
|
|
import { useStatusState } from '../src/context/StatusContext';
|
2020-05-01 14:08:30 +02:00
|
|
|
import { ChatFetcher } from '../src/components/chat/ChatFetcher';
|
2020-05-11 06:21:16 +02:00
|
|
|
import { parseCookies } from '../src/utils/cookies';
|
2020-04-12 18:27:01 +02:00
|
|
|
|
2020-04-22 10:14:33 +02:00
|
|
|
toast.configure({ draggable: false, pauseOnFocusLoss: false });
|
2020-04-12 18:27:01 +02:00
|
|
|
|
|
|
|
|
const Wrapper: React.FC = ({ children }) => {
|
2020-05-11 06:21:16 +02:00
|
|
|
const { theme } = useConfigState();
|
2020-04-12 18:27:01 +02:00
|
|
|
const { pathname } = useRouter();
|
2020-04-22 10:14:33 +02:00
|
|
|
const { connected } = useStatusState();
|
2020-05-19 07:50:16 +02:00
|
|
|
const { hasAccount } = useAccountState();
|
2020-04-12 18:27:01 +02:00
|
|
|
|
2020-04-22 10:14:33 +02:00
|
|
|
const isRoot = pathname === '/';
|
2020-04-12 18:27:01 +02:00
|
|
|
|
|
|
|
|
const renderContent = () => {
|
2020-04-22 10:14:33 +02:00
|
|
|
if (isRoot) {
|
|
|
|
|
return <>{children}</>;
|
2020-04-16 22:36:09 +02:00
|
|
|
}
|
2020-05-19 07:50:16 +02:00
|
|
|
if (hasAccount === 'false') {
|
|
|
|
|
return <LoadingCard noCard={true} />;
|
|
|
|
|
}
|
2020-04-22 10:14:33 +02:00
|
|
|
return <GridWrapper>{children}</GridWrapper>;
|
2020-04-12 18:27:01 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const renderGetters = () => (
|
|
|
|
|
<>
|
|
|
|
|
<BitcoinPrice />
|
|
|
|
|
<BitcoinFees />
|
2020-05-01 14:08:30 +02:00
|
|
|
<ChatFetcher />
|
|
|
|
|
<ChatInit />
|
2020-04-12 18:27:01 +02:00
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
return (
|
2020-04-22 10:14:33 +02:00
|
|
|
<ThemeProvider theme={{ mode: isRoot ? 'light' : theme }}>
|
2020-04-12 18:27:01 +02:00
|
|
|
<ModalProvider backgroundComponent={BaseModalBackground}>
|
|
|
|
|
<GlobalStyles />
|
2020-05-01 15:24:02 +02:00
|
|
|
{connected && !isRoot && renderGetters()}
|
2020-04-17 20:11:37 +02:00
|
|
|
<PageWrapper>
|
|
|
|
|
<HeaderBodyWrapper>
|
|
|
|
|
<Header />
|
|
|
|
|
{renderContent()}
|
|
|
|
|
</HeaderBodyWrapper>
|
|
|
|
|
<Footer />
|
|
|
|
|
</PageWrapper>
|
2020-04-12 18:27:01 +02:00
|
|
|
</ModalProvider>
|
|
|
|
|
</ThemeProvider>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
2020-05-19 07:50:16 +02:00
|
|
|
const App = ({
|
|
|
|
|
Component,
|
|
|
|
|
pageProps,
|
|
|
|
|
apollo,
|
|
|
|
|
initialConfig,
|
|
|
|
|
cookieParam,
|
|
|
|
|
}: any) => (
|
2020-05-11 06:21:16 +02:00
|
|
|
<>
|
|
|
|
|
<Head>
|
|
|
|
|
<title>ThunderHub - Lightning Node Manager</title>
|
|
|
|
|
</Head>
|
|
|
|
|
<ApolloProvider client={apollo}>
|
|
|
|
|
<ConfigProvider initialConfig={initialConfig}>
|
|
|
|
|
<ContextProvider>
|
2020-05-19 07:50:16 +02:00
|
|
|
<AuthSSOCheck cookieParam={cookieParam} />
|
|
|
|
|
<ServerAccounts />
|
2020-05-11 06:21:16 +02:00
|
|
|
<Wrapper>
|
|
|
|
|
<Component {...pageProps} />
|
|
|
|
|
</Wrapper>
|
|
|
|
|
</ContextProvider>
|
|
|
|
|
</ConfigProvider>
|
|
|
|
|
</ApolloProvider>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
App.getInitialProps = async props => {
|
2020-05-19 07:50:16 +02:00
|
|
|
const cookieParam = getUrlParam(props.router?.query?.token);
|
2020-05-11 06:21:16 +02:00
|
|
|
const cookies = parseCookies(props.ctx.req);
|
2020-05-19 07:50:16 +02:00
|
|
|
const defaultState = {};
|
|
|
|
|
|
2020-05-11 06:21:16 +02:00
|
|
|
if (!cookies?.config) {
|
2020-05-19 07:50:16 +02:00
|
|
|
return { initialConfig: {}, ...defaultState };
|
2020-05-11 06:21:16 +02:00
|
|
|
}
|
|
|
|
|
try {
|
|
|
|
|
const config = JSON.parse(cookies.config);
|
|
|
|
|
return {
|
2020-05-19 07:50:16 +02:00
|
|
|
initialConfig: { ...config, ...defaultState },
|
|
|
|
|
cookieParam,
|
2020-05-11 06:21:16 +02:00
|
|
|
};
|
|
|
|
|
} catch (error) {
|
2020-05-19 07:50:16 +02:00
|
|
|
return { initialConfig: {}, cookieParam, ...defaultState };
|
2020-04-12 18:27:01 +02:00
|
|
|
}
|
2020-05-11 06:21:16 +02:00
|
|
|
};
|
2020-04-12 18:27:01 +02:00
|
|
|
|
2020-05-11 06:21:16 +02:00
|
|
|
export default withApollo(App);
|
