Who can I call the function only if - reactjs

Question

Hey guys I need your help. I want to call a function but only if other function works. But I can't do that unfortunately, could you help me?
Here's my code:
'use strict';
import React from 'react/addons';
import { Carousel, CarouselItem } from 'react-bootstrap';
import { Link } from 'react-router';
import cx from 'classnames';
import { user as userAccount } from '../../scripts/account-details';
function getColorForChannel(name) {
const hue = Array.from(name)
.map((ch, i) => ch.charCodeAt(0) * (i + 1))
.reduce((sum, ch) => sum + ch, 0) % 360;
return `hsl(${hue}, 75%, 75%)`;
}
function urlify(text){
var urlRegex = /(https?:\/\/[^\s]+)?\.(com|pt|es|org|net|)?/g;
return urlRegex.test(text);
}
function parseLinha(linha) {
return linha.split(' ')
.map((x, i) => urlify(x) ? <a key={i} href={x.trim()} target='_blank' rel='nofollow'>{x} </a> : x + " ");
}
/**
* Usernames that don't really link to people.
*/
const nonPeopleUserNames = ['linsasupport'];
const TimelineItem = React.createClass({
getDefaultProps() {
return {
important: false
};
},
propTypes: {
routeDepth: React.PropTypes.number,
router: React.PropTypes.func,
item: React.PropTypes.object.isRequired,
onDelete: React.PropTypes.func,
onLinkClicked: React.PropTypes.func.isRequired,
important: React.PropTypes.bool
},
getChildContext() {
return {
routeDepth: this.props.routeDepth,
router: this.props.router
};
},
childContextTypes: {
routeDepth: React.PropTypes.number.isRequired,
router: React.PropTypes.func.isRequired
},
getUrlState() {
return (
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img src="..." alt="..."/>
<div class="caption">
<h3>Thumbnail label</h3>
<p>...</p>
<p>Button Button</p>
</div>
</div>
</div>
</div>
);
},
renderAttachments(attachments) {
if (!attachments.length) { return null; }
if (attachments.every((a) => a.Type.toLowerCase() === 'image')) {
return (
<Carousel>
{attachments.map((a) =>
<CarouselItem key={a.Id}>
<a href={`timeline/${this.props.item.Id}/attachments/${a.Id}`} target='_blank'>
<div style={{
backgroundImage: `url(/timeline/${this.props.item.Id}/attachments/${a.Id})`,
backgroundSize: 'contain',
backgroundPosition: 'center center',
height: 300, width: '100%', backgroundRepeat: 'no-repeat' }} />
</a>
</CarouselItem>)}
</Carousel>
);
}
return (
<div className='si-timeline-item-attachments'>
<ul className='fa-ul'>
{attachments.map((a) =>
<li key={a.Id}>
<i className='fa-li fa fa-file' />
<a href={`/timeline/${this.props.item.Id}/attachments/${a.Id}`}
target='_blank'>
{a.Name}
</a>
</li>)}
</ul>
</div>
);
},
handleDelete() {
if (typeof (this.props.onDelete) === 'function') {
this.props.onDelete();
}
},
render() {
const { item, important } = this.props;
const itemClasses = cx({
'si-timeline-item': true,
'si-urgent': important
});
const d = item.Date instanceof Date ? item.Date : new Date(item.Date);
return (
<div className={itemClasses}>
<div className='si-timeline-item-header'>
{important ?
<button className='btn btn-default si-delete-btn'
onClick={this.handleDelete}
title='Remover notificação'>
<i className='fa fa-lg fa-remove' />
</button> : null}
<div className='si-profile-image-fixed'
style={{
backgroundImage: `url(/users/${item.Author.UserName}/profileimage)`
}} />
<div>
{nonPeopleUserNames.indexOf(item.Author.UserName) === -1 ?
<Link className='si-timeline-item-title-fixed'
onClick={(e) => this.props.onLinkClicked(e)}
to={`/users/${item.Author.UserName}`}>
{item.Author.Name} {item.Author.UserName === userAccount.manager ? <small>(Manager)</small> : null}
</Link> :
<span className='si-timeline-item-title-fixed'>
{item.Author.Name} {item.Author.UserName === userAccount.manager ? <small>(Manager)</small> : null}
</span>}
<date className='si-timeline-item-date-fixed' dateTime={d.toISOString()}>
{d.toLocaleString(navigator.language)}
</date>
</div>
<small className='si-timeline-item-channel'
style={{borderRight: `7px solid ${getColorForChannel(item.Channel.Name)}`}}>
{item.Channel.Name}
</small>
</div>
<div className='si-timeline-item-content'>
{item.Contents.split('/n')
.map((l, i) => {
const conteudos = parseLinha(l);
console.log(conteudos);
return <p key={i}>{conteudos}</p>;
})}
{this.getUrlState()}
</div>
{this.renderAttachments(item.Attachments)}
</div>
);
}
});
export default TimelineItem;
Here's the function :
function urlify(text){
var urlRegex = /(https?:\/\/[^\s]+)?\.(com|pt|es|org|net|)?/g;
return urlRegex.test(text);
And here's the function I want to call only if function urlify happens:
getUrlState() {
return (
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img src="..." alt="..."/>
<div class="caption">
<h3>Thumbnail label</h3>
<p>...</p>
<p>Button Button</p>
</div>
</div>
</div>
</div>
);
},
Really need your help thanks.