SoundWave/imports/ui/Link.jsx

import React, {Component, PropTypes} from 'react';
import classnames from 'classnames';

// Task component - represents a single todo item
export default class Link extends Component {

	deleteThisLink() {
		Meteor.call('links.remove', this.props.link._id);
	}

	render() {
		// Give tasks a different className when they are checked off,
		// so that we can style them nicely in CSS
		const linkClassName = classnames({
			completed: this.props.link.completed,
		});

		return (
			<li className={linkClassName}>
				<button className="delete" onClick={this.deleteThisLink.bind(this)}>
					&times;
				</button>
				<span className="text">{this.props.link.url}</span>
			</li>
		);
	}
}

Link.propTypes = {
	// This component gets the task to display through a React prop.
	// We can use propTypes to indicate it is required
	link: PropTypes.object.isRequired,
};