1import * as React from 'react' 2import * as Container from '../util/container' 3import * as Kb from '../common-adapters' 4import * as RouteTreeGen from '../actions/route-tree-gen' 5import * as Styles from '../styles' 6 7type KeybaseLinkErrorBodyProps = { 8 message: string 9 isError: boolean 10 onCancel?: () => void 11} 12 13export const KeybaseLinkErrorBody = (props: KeybaseLinkErrorBodyProps) => { 14 const bannerColor = props.isError ? 'red' : 'green' 15 return ( 16 <Kb.PopupWrapper onCancel={props.onCancel} customCancelText="Close"> 17 <Kb.Box2 direction="vertical" fullWidth={true} style={styles.container}> 18 <Kb.Banner color={bannerColor}> 19 <Kb.BannerParagraph bannerColor={bannerColor} content={props.message} selectable={true} /> 20 </Kb.Banner> 21 </Kb.Box2> 22 </Kb.PopupWrapper> 23 ) 24} 25 26type OwnProps = Container.RouteProps<{errorSource: 'app' | 'sep6' | 'sep7'}> 27 28const KeybaseLinkError = (props: OwnProps) => { 29 const errorSource = Container.getRouteProps(props, 'errorSource', 'app') 30 const message = Container.useSelector(s => { 31 switch (errorSource) { 32 case 'app': 33 return s.deeplinks.keybaseLinkError 34 case 'sep7': 35 return s.wallets.sep7ConfirmError 36 case 'sep6': 37 return s.wallets.sep6Message 38 } 39 }) 40 const sep6Error = Container.useSelector(s => s.wallets.sep6Error) 41 const isError = errorSource !== 'sep6' || sep6Error 42 const dispatch = Container.useDispatch() 43 const onClose = () => dispatch(RouteTreeGen.createNavigateUp()) 44 return <KeybaseLinkErrorBody onCancel={onClose} isError={isError} message={message} /> 45} 46 47const styles = Styles.styleSheetCreate(() => ({ 48 container: Styles.platformStyles({ 49 common: { 50 backgroundColor: Styles.globalColors.white, 51 }, 52 isElectron: { 53 height: 560, 54 width: 400, 55 }, 56 isMobile: { 57 flexGrow: 1, 58 flexShrink: 1, 59 maxHeight: '100%', 60 width: '100%', 61 }, 62 }), 63})) 64 65export default KeybaseLinkError 66