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

Timestamp:

03/01/2017 06:08:54 PM (7 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-ratings/index.jsx (modified) (2 diffs)

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

@@ -1 @@
-import React from 'react';
+/**
+ * External dependencies.
+ */
+import React, { PropTypes } from 'react';
+import { localize } from 'i18n-calypso';
+import { identity } from 'lodash';
 
 /**
@@ -6 +11 @@
 import Stars from './stars';
 
-export default React.createClass( {
-    displayName: 'PluginRatings',
+export const PluginRatings = ( { numberFormat, rating, ratingCount, translate } ) => (
+    <div className="plugin-rating" itemProp="aggregateRating" itemScope="" itemType="http://schema.org/AggregateRating">
+        <meta itemProp="ratingCount" content={ ratingCount } />
+        <meta itemProp="ratingValue" content={ rating } />
 
-    render() {
-        return (
-            <div className="plugin-rating" itemProp="aggregateRating" itemScope="" itemType="http://schema.org/AggregateRating">
-                <meta itemProp="ratingCount" content={ this.props.ratingCount } />
-                <meta itemProp="ratingValue" content={ this.props.rating } />
+        <Stars rating={ rating } />
+        <span className="rating-count">
+            { translate( '(%(count)s{{span}} total ratings{{/span}})', {
+                args: { count: numberFormat( ratingCount ) },
+                components: { span: <span className="screen-reader-text" /> },
+            } ) }
+        </span>
+    </div>
+);
 
-                <Stars rating={ this.props.rating } />
-                <span className="rating-count">({ this.props.ratingCount }<span className="screen-reader-text"> total ratings</span>)</span>
-            </div>
-        )
-    }
-} );
+PluginRatings.propTypes = {
+    numberFormat: PropTypes.func,
+    rating: PropTypes.number,
+    ratingCount: PropTypes.number,
+    translate: PropTypes.func,
+};
+
+PluginRatings.defaultProps = {
+    numberFormat: identity,
+    rating: 0,
+    ratingCount: 0,
+    translate: identity,
+};
+
+export default localize( PluginRatings );