Removes prompt formatic

Fixs wallet prompt, adds marginTop props, splits border into border and borderColor
Adds fortmaticPrimary and fortmaticSecondary prop colors

packages/instant/src/components/wallet_prompt.tsx

@@ -7,10 +7,11 @@ import { Flex } from './ui/flex';
 import { Text } from './ui/text';
 
 export interface WalletPromptProps {
-    image: React.ReactNode;
+    image?: React.ReactNode;
     onClick?: () => void;
     primaryColor: ColorOption;
     secondaryColor: ColorOption;
+    marginTop?: string;
 }
 
 export const WalletPrompt: React.StatelessComponent<WalletPromptProps> = ({
@@ -19,16 +20,19 @@ export const WalletPrompt: React.StatelessComponent<WalletPromptProps> = ({
     children,
     secondaryColor,
     primaryColor,
+    marginTop,
 }) => (
     <Container
         padding="10px"
-        border={`1px solid ${primaryColor}`}
+        border={`1px solid`}
+        borderColor={primaryColor}
         backgroundColor={secondaryColor}
         width="100%"
         borderRadius="4px"
         onClick={onClick}
         cursor={onClick ? 'pointer' : undefined}
         boxShadowOnHover={!!onClick}
+        marginTop={marginTop}
     >
         <Flex>
             {image}

packages/instant/src/components/wallet_prompt_fortmatic.tsx

@@ -1,38 +0,0 @@
-import * as React from 'react';
-
-import {Container} from './ui/container';
-import {Flex} from './ui/flex';
-import {Text} from './ui/text';
-import {Icon} from "./ui/icon";
-import {ColorOption} from "../style/theme";
-
-export interface WalletPromptFortmaticProps {
-    onClick?: () => void;
-}
-
-export const WalletPromptFortmatic: React.StatelessComponent<WalletPromptFortmaticProps> = ({
-    onClick
-}) => (
-    <Container
-        padding="10px"
-        border={`3px solid ${ColorOption.fortmaticPrimary}`}
-        backgroundColor={ColorOption.fortmaticSecondary}
-        width="100%"
-        borderRadius="4px"
-        onClick={onClick}
-        cursor={onClick ? 'pointer' : undefined}
-        boxShadowOnHover={!!onClick}
-        marginTop="5px"
-    >
-        <Flex>
-            <Container marginLeft="10px">
-                <Text fontSize="16px" fontColor={ColorOption.fortmaticPrimary} fontWeight="500">
-                    Connect with  <Icon width={13} icon="fortmatic" /> Fortmatic
-                </Text>
-            </Container>
-        </Flex>
-    </Container>
-);
-
-
-WalletPromptFortmatic.displayName = 'WalletPromptFortmatic';

packages/instant/src/containers/connected_account_payment_method.ts

@@ -46,7 +46,7 @@ const mapDispatchToProps = (
     unlockWalletAndDispatchToStore: (providerState: ProviderState) => {
         analytics.trackAccountUnlockRequested();
         // tslint:disable-next-line:no-floating-promises
-        asyncData.fetchAccountInfoAndDispatchToStore(providerState, dispatch, true);
+        asyncData.fetchAccountInfoAndDispatchToStore2(providerState, dispatch, true);
     },
 });
 

packages/instant/src/style/theme.ts

@@ -28,7 +28,7 @@ export enum ColorOption {
     darkBlue = 'darkBlue',
     lightBlue = 'lightBlue',
     fortmaticPrimary = 'fortmaticPrimary',
-    fortmaticSecondary = 'fortmaticSecondary'
+    fortmaticSecondary = 'fortmaticSecondary',
 }
 
 export const theme: Theme = {
@@ -47,7 +47,7 @@ export const theme: Theme = {
     darkBlue: '#135df6',
     lightBlue: '#F2F7FF',
     fortmaticPrimary: '#6851FF',
-    fortmaticSecondary: '#E2DCFF'
+    fortmaticSecondary: '#E2DCFF',
 };
 
 export const transparentWhite = 'rgba(255,255,255,0.3)';