render() { const { fatalError } = this.state || {}; const { location, children } = this.props; return ( <Layout style={{ height: '100%' }}> <Header selectedKeys={selectedTab(location.pathname)} /> <Layout.Content style={{ height: '100%' }}> {fatalError ? ( <Alert message="Error occured while rendering" description={fatalError.stack} type="error" /> ) : ( children )} </Layout.Content> </Layout> ); }
url: { query: ctx.query, pathname: ctx.pathname } }, ...(await (typeof Component.getInitialProps === 'function' ? Component.getInitialProps(ctx) : {})) };
</div> )} </Layout.Header> );
const SpotlightBottom = props => ( // className is need to extend css <Container className={props.className}> <TextContainer> <Styled.h3>{props.title}</Styled.h3> <Styled.p>{props.tagLine}</Styled.p> </TextContainer> <ImageContainer> <ClientImage src={props.image} alt={props.title}></ClientImage> </ImageContainer> </Container> )
const MenuLink = props => { return ( <Link to={props.to}> <Dropdown.Item>{props.titulo}</Dropdown.Item> </Link> ); }
render() { return ( <Appbar.Header style={styles.header}> <Appbar.Action icon="menu" /> <Appbar.Content title="TO-DO" theme={{fonts:{regular: 'Roboto Bold'}}} /> </Appbar.Header> ); }
render() { return <Menu.Item onClick={() => this.props.store.configStore.toggleSidebar()}> <Icon name={'content'}/> </Menu.Item> }
function Page({ title, children }) { return ( <Layout pageTitle={title}> <Box as="article"> <Box as="header" mb={4}> <Styled.h1>{title}</Styled.h1> </Box> <Box>{children}</Box> </Box> </Layout> ); }
// formatting selected value to only display main field const SingleValue = ({ children, ...props }) => ( <components.SingleValue {...props}> {children.props.label} </components.SingleValue> )
app.get('*', async (req, res) => { const store = createStore(); const actions = matchRoutes(Routes, req.path) .map(({ route }) => route.component.initialFetchData ? route.component.initialFetchData({ ...store, path: req.path }) : null) .map(async actions => await Promise.all( (actions || []).map(p => p && new Promise(resolve => p.then(resolve).catch(resolve))) )); await Promise.all(actions); const response = ssr(req.url, store); res.send(response); });
const MultiValue = (props) => { return ( <components.MultiValue {...props}> <span>{props.data.value}</span> </components.MultiValue> ); }
const ModalOk = props => ( <Modal centered open={props.estado}> <Modal.Header>{props.titulo}</Modal.Header> <Modal.Actions> <Button color="green" onClick={props.cerrar} inverted> <Icon name="checkmark" /> OK ! </Button> </Modal.Actions> </Modal> )
function MovieHeader(props) { return ( <Menu color={"teal"} inverted borderless> <Menu.Item heading='true'> <Header as="h2" inverted> <Header.Content>{props.title}</Header.Content> </Header> </Menu.Item> </Menu> ); }