Changeset 5024 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client/components/plugin-card/plugin-card.jsx

Timestamp:

03/01/2017 06:08:54 PM (10 years ago)

Author:

obenland

Message:

Plugin Directory: Update React client with latest changes.

This is largely a cleanup commit with some WIP around switching to node-wpapi.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client/components/plugin-card/plugin-card.jsx (modified) (2 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client/components/plugin-card/plugin-card.jsx

@@ -1 @@
-import React from 'react';
+/**
+ * External dependencies.
+ */
+import React, { PropTypes } from 'react';
 import { Link } from 'react-router';
 
@@ -8 +11 @@
 import PluginRatings from 'components/plugin-ratings';
 
-export default React.createClass( {
-        displayName: 'PluginCard',
+export const PluginCard = ( { plugin } ) => (
+        <article className="plugin type-plugin plugin-card">
+                <PluginIcon slug={ plugin.slug } />
+                <div className="entry">
+                        <header className="entry-header">
+                                <h2 className="entry-title">
+                                        <Link
+                                                to={ `${ plugin.slug }/` }
+                                                rel="bookmark"
+                                                dangerouslySetInnerHTML={ { __html: plugin.title.rendered } }
+                                        />
+                                </h2>
+                        </header>
 
-        render() {
-                if ( ! this.props.plugin ) {
-                        return (
-                                <div />
-                        );
-                }
+                        { plugin.ratings && <PluginRatings rating={ plugin.meta.rating } ratingCount={ plugin.ratings.length } /> }
 
-                return (
-                        <article className="plugin type-plugin plugin-card">
-                                <PluginIcon plugin={ this.props.plugin } />
-                                <div className="entry">
-                                        <header className="entry-header">
-                                                <h2 className="entry-title">
-                                                        <Link to={ `${ this.props.plugin.slug }/` } rel="bookmark">{ this.props.plugin.name }</Link>
-                                                </h2>
-                                        </header>
+                        <div className="entry-excerpt" dangerouslySetInnerHTML={ { __html: plugin.excerpt.rendered } } />
+                </div>
+        </article>
+);
 
-                                        <PluginRatings rating={ this.props.plugin.rating } ratingCount={ this.props.plugin.num_ratings } />
+PluginCard.propTypes = {
+        plugin: PropTypes.object,
+};
 
-                                        <div className="entry-excerpt">{ this.props.plugin.short_description }</div>
-                                </div>
-                        </article>
-                )
-        }
-} );
+export default PluginCard;