Fix window and styled errors.

frontend/client/components/Header/styled.ts

@@ -7,7 +7,7 @@ export const Placeholder = styled.div`
   height: ${headerHeight};
 `;
 
-export const Header = styled.header<{ isTransparent?: boolean }>`
+export const Header = styled<{ isTransparent: boolean }, 'header'>('header')`
   position: ${(p: any) => (p.isTransparent ? 'absolute' : 'relative')};
   top: 0;
   left: 0;

frontend/client/components/Home/styled.ts

@@ -41,17 +41,17 @@ export const HeroButtons = styled.div`
   }
 `;
 
-export const HeroButton = styled.a<{ isPrimary?: boolean }>`
+export const HeroButton = styled<{ isPrimary?: boolean }, 'a'>('a')`
   height: 3.6rem;
   line-height: 3.6rem;
   width: 16rem;
   padding: 0;
   margin: 0 10px;
-  background: ${(p: any) =>
+  background: ${p =>
     p.isPrimary
       ? 'linear-gradient(-180deg, #3498DB 0%, #2C8ACA 100%)'
       : 'linear-gradient(-180deg, #FFFFFF 0%, #FAFAFA 98%)'};
-  color: ${(p: any) => (p.isPrimary ? '#FFF' : '#4C4C4C')};
+  color: ${p => (p.isPrimary ? '#FFF' : '#4C4C4C')};
   text-align: center;
   font-size: 1.4rem;
   border-radius: 4px;
@@ -61,7 +61,7 @@ export const HeroButton = styled.a<{ isPrimary?: boolean }>`
   &:hover,
   &:focus {
     transform: translateY(-2px);
-    color: ${(p: any) => (p.isPrimary ? '#FFF' : '#4C4C4C')};
+    color: ${p => (p.isPrimary ? '#FFF' : '#4C4C4C')};
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.25);
   }
 

frontend/client/components/NewsletterForm/styled.tsx

@@ -16,7 +16,7 @@ export const Form = styled.form`
   }
 `;
 
-export const Input = styled.input<{ isSuccess: boolean }>`
+export const Input = styled<{ isSuccess?: boolean }, 'input'>('input')`
   display: block;
   height: ${inputHeight};
   width: 100%;
@@ -60,7 +60,9 @@ export const Input = styled.input<{ isSuccess: boolean }>`
   }
 `;
 
-export const Button = styled.button<{ isLoading: boolean; isSuccess: boolean }>`
+export const Button = styled<{ isLoading?: boolean; isSuccess?: boolean }, 'button'>(
+  'button',
+)`
   display: block;
   position: absolute;
   top: 50%;

frontend/client/components/Proposal/CampaignBlock/styled.ts

@@ -64,7 +64,7 @@ export const Button = styled.a`
   }
 `;
 
-export const FundingOverMessage = styled.div<{ isSuccess: boolean }>`
+export const FundingOverMessage = styled<{ isSuccess: boolean }, 'div'>('div')`
   display: flex;
   justify-content: center;
   align-items: center;

frontend/client/components/Proposal/styled.tsx

@@ -110,7 +110,7 @@ export const SideBlock = styled.div`
   }
 `;
 
-export const BodyText = styled.div<{ isExpanded: boolean }>`
+export const BodyText = styled<{ isExpanded: boolean }, 'div'>('div')`
   max-height: ${(p: any) => (p.isExpanded ? 'none' : '27rem')};
   overflow: hidden;
   font-size: 1.1rem;

frontend/client/components/Proposals/ProposalCard/styled.ts

@@ -80,7 +80,7 @@ export const FundingRaised = styled.div`
   }
 `;
 
-export const FundingPercent = styled.div<{ isFunded: boolean }>`
+export const FundingPercent = styled<{ isFunded: boolean }, 'div'>('div')`
   color: ${p => (p.isFunded ? '#2ecc71' : 'inherit')};
   font-size: 0.7rem;
   padding-left: 0.25rem;

frontend/client/lib/getWeb3.ts

@@ -4,10 +4,12 @@ interface Web3Window extends Window {
   web3?: Web3;
 }
 
-const web3Window = window as Web3Window;
-
 const resolveWeb3 = (resolve: (web3: Web3) => void, reject: (err: Error) => void) => {
-  let { web3 } = web3Window;
+  if (typeof window === 'undefined') {
+    return reject(new Error('No global window variable'));
+  }
+
+  let { web3 } = window as Web3Window;
   const alreadyInjected = typeof web3 !== 'undefined'; // i.e. Mist/Metamask
   const localProvider = `http://localhost:8545`;
 

frontend/client/lib/with-redux-store.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import { AppState } from 'store/reducers';
 import { configureStore } from 'store/configure';
 
-const anyWindow = window as any;
 const isServer = typeof window === 'undefined';
 const __NEXT_REDUX_STORE__ = '__NEXT_REDUX_STORE__';
 
@@ -13,6 +12,7 @@ function getOrCreateStore(initialState?: Partial<AppState>) {
   }
 
   // Create store if unavailable on the client and set it on the window object
+  const anyWindow = window as any;
   if (!anyWindow[__NEXT_REDUX_STORE__]) {
     anyWindow[__NEXT_REDUX_STORE__] = configureStore(initialState);
   }