const RemoveButtonGroup = ({ onRemoveClick, children, ...props }) => ( <Button.Group style={{ marginRight: 8 }} {...props}> {children} <Button danger ghost onClick={onRemoveClick}> <CloseOutlined /> </Button> </Button.Group> )
export default function Item({ id, index }) { return ( <Draggable draggableId={id} index={index}> {({ draggableProps, dragHandleProps, innerRef }) => ( <div ref={innerRef} {...draggableProps} {...dragHandleProps} style={{ ...draggableProps.style, }} > <Typography.Text ellipsis style={{ maxWidth: '100%' }}> <DragOutlined style={{ marginRight: 8 }} /> {id} </Typography.Text> </div> )} </Draggable> ); }
export default function DroppableArea({ pivotConfig, axis }) { return ( <> <Typography.Text strong style={{ display: 'flex', justifyContent: 'center', }} > {axis} </Typography.Text> <Droppable droppableId={axis}> {(provided) => ( <div ref={provided.innerRef} {...provided.droppableProps} style={{ height: '100%' }} > {pivotConfig[axis].map((id, index) => ( <Item key={id} id={id} index={index} /> ))} {provided.placeholder} </div> )} </Droppable> </> ); }
</Typography.Text>
errorMessage() { return ( <Header as="h2" icon color="orange"> <Icon color="orange" name="delete" circular /> There was an error adding you to the team. <Header.Subheader> Please try refreshing the page or contact us. </Header.Subheader> </Header> ); }
function ExpandableDescription ({ children }) { const intl = useIntl() const ReadMoreMsg = intl.formatMessage({ id: 'ReadMore' }) return <Typography.Paragraph ellipsis={{ rows: 3, expandable: true, symbol: ReadMoreMsg }}> {children} </Typography.Paragraph> }
render() { const { attendee } = this.props; // console.log("EventListAtendee"); // console.log(attendee); return ( <List.Item> {attendee.id} {"-"} <Image as="a" size="mini" circular src={attendee.photoURL} /> </List.Item> ); }
render() { return ( <Container> <Header as="h1">Login Required</Header> <Form onSubmit={this._login}> <Form.Input label="Password" type="password" name="password" onChange={this.handleChange}/> <Form.Button>Submit</Form.Button> </Form> </Container> ) }
render() { const {open,item} = this.props; return( <Modal open={open} onClose={this.props.onClose}> <Modal.Header>Add position</Modal.Header> <Modal.Content image> <Modal.Description> </Modal.Description> </Modal.Content> </Modal> ) }
const HeroBar = props => { return ( <Segment> <Header as='h1' icon textAlign='center'> <Icon name='cogs' /> <Header.Content>{props.children}</Header.Content> </Header> </Segment> ); }
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> )
const RegisterPage = () => { const intl = useIntl() const RegistrationTitleMsg = intl.formatMessage({ id: 'pages.auth.RegistrationTitle' }) return (<> <Head> <title>{RegistrationTitleMsg}</title> </Head> <Typography.Title css={css`text-align: center;`}>{RegistrationTitleMsg}</Typography.Title> <RegisterForm/> </>) }
const ChangePasswordPage = () => { const intl = useIntl() const ChangePasswordTitleMsg = intl.formatMessage({ id: 'pages.auth.ChangePasswordTitle' }) return (<> <Head> <title>{ChangePasswordTitleMsg}</title> </Head> <Typography.Title css={css`text-align: center;`} level={2}>{ChangePasswordTitleMsg}</Typography.Title> <ChangePasswordForm/> </>) }
const RegisterPage = () => { const intl = useIntl() const RegistrationTitleMsg = intl.formatMessage({ id: 'pages.auth.RegistrationTitle' }) return (<> <Head> <title>{RegistrationTitleMsg}</title> </Head> <Typography.Title css={css`text-align: center;`}>{RegistrationTitleMsg}</Typography.Title> <RegisterForm/> </>) }