Add a tag to links

common/app/routes/Jobs/components/ShowJob.jsx

@@ -1,6 +1,8 @@
 import React, { PropTypes } from 'react';
 import { Well, Row, Col, Thumbnail, Panel } from 'react-bootstrap';
+import urlRegexFactory from 'url-regex';
 
+const urlRegex = urlRegexFactory();
 const defaultImage =
   'https://s3.amazonaws.com/freecodecamp/camper-image-placeholder.png';
 
@@ -10,6 +12,12 @@ const thumbnailStyle = {
   maxWidth: '100px'
 };
 
+function addATags(text) {
+  return text.replace(urlRegex, function(match) {
+    return `<a href=${match}>${match}</a>`;
+  });
+}
+
 export default React.createClass({
   displayName: 'ShowJob',
   propTypes: {
@@ -90,10 +98,12 @@ export default React.createClass({
                     <Col
                       md={ 6 }
                       mdOffset={ 3 }>
-                        <bold>How do I apply? </bold>
+                        <bold>How do I apply?</bold>
                         <br />
                         <br />
-                        { howToApply }
+                        <span dangerouslySetInnerHTML={{
+                          __html: addATags(howToApply)
+                        }} />
                     </Col>
                 </Row>
               </Well>

package.json

@@ -113,6 +113,7 @@
     "thundercats-react": "^0.3.0",
     "twit": "~1.1.20",
     "uglify-js": "~2.4.15",
+    "url-regex": "^3.0.0",
     "validator": "^3.22.1",
     "webpack": "^1.9.12",
     "xss-filters": "^1.2.6",