diff --git a/client/coral-admin/src/components/Comment.js b/client/coral-admin/src/components/Comment.js index b19be09cd..273419245 100644 --- a/client/coral-admin/src/components/Comment.js +++ b/client/coral-admin/src/components/Comment.js @@ -5,32 +5,48 @@ import timeago from 'timeago.js'; import styles from './CommentList.css'; import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../translations.json'; +import Linkify from 'react-linkify'; + +const linkify = new Linkify(); // Render a single comment for the list -export default props => ( -
  • -
    -
    - person - {props.comment.get('name') || lang.t('comment.anon')} - {timeago().format(props.comment.get('createdAt') || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))} - {props.comment.get('flagged') ?

    {lang.t('comment.flagged')}

    : null} +export default props => { + const links = linkify.getMatches(props.comment.get('body')); + + return ( +
  • +
    +
    + person + {props.comment.get('name') || lang.t('comment.anon')} + {timeago().format(props.comment.get('createdAt') || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))} + {props.comment.get('flagged') ?

    {lang.t('comment.flagged')}

    : null} +
    +
    + {links ? + Contains Link : null} +
    + {props.actions.map(action => canShowAction(action, props.comment) ? ( + + ) : null)} +
    +
    -
    - {props.actions.map(action => canShowAction(action, props.comment) ? ( - - ) : null)} +
    + + + {props.comment.get('body')} + +
    -
    -
    - {props.comment.get('body')} -
    -
  • -); + + ); +}; // Check if an action can be performed over a comment const canShowAction = (action, comment) => { @@ -43,4 +59,9 @@ const canShowAction = (action, comment) => { return true; }; +const linkStyles = { + backgroundColor: 'rgb(255, 219, 135)', + padding: '1px 2px' +}; + const lang = new I18n(translations); diff --git a/client/coral-admin/src/components/CommentList.css b/client/coral-admin/src/components/CommentList.css index f683ca36b..2c58c81cf 100644 --- a/client/coral-admin/src/components/CommentList.css +++ b/client/coral-admin/src/components/CommentList.css @@ -121,3 +121,15 @@ } } + + +.hasLinks { + color: #f00; + text-align: right; + display: flex; + align-items: center; + + i { + margin-right: 5px; + } +} diff --git a/package.json b/package.json index dd9f8db8a..fb83055b6 100644 --- a/package.json +++ b/package.json @@ -16,8 +16,13 @@ "config": { "pre-git": { "commit-msg": [], - "pre-commit": ["npm run lint", "npm test"], - "pre-push": ["npm test"], + "pre-commit": [ + "npm run lint", + "npm test" + ], + "pre-push": [ + "npm test" + ], "post-commit": [], "post-merge": [] } @@ -26,7 +31,12 @@ "type": "git", "url": "git+https://github.com/coralproject/talk.git" }, - "keywords": ["talk", "coral", "coralproject", "ask"], + "keywords": [ + "talk", + "coral", + "coralproject", + "ask" + ], "author": "", "license": "Apache-2.0", "bugs": { @@ -44,18 +54,17 @@ "express": "^4.14.0", "express-session": "^1.14.2", "helmet": "^3.1.0", + "jsonwebtoken": "^7.1.9", + "lodash": "^4.16.6", "lodash.debounce": "^4.0.8", "mongoose": "^4.6.5", "morgan": "^1.7.0", + "nodemailer": "^2.6.4", "passport": "^0.3.2", "passport-facebook": "^2.1.1", "passport-local": "^1.0.0", - "jsonwebtoken": "^7.1.9", - "lodash": "^4.16.6", - "mongoose": "^4.6.5", - "morgan": "^1.7.0", - "nodemailer": "^2.6.4", "prompt": "^1.0.0", + "react-linkify": "^0.1.3", "redis": "^2.6.3", "uuid": "^2.0.3" },