Changeset 8526

Timestamp:

03/25/2019 11:27:12 PM (7 years ago)

Author:

iandunn

Message:

WordCamp Blocks: Make icons and labels DRY for consistency.

Location:

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src

Files:

• sessions/block-controls.js (modified) (2 diffs)
• sessions/edit.js (modified) (1 diff)
• sessions/index.js (modified) (1 diff)
• sessions/sessions-select.js (modified) (5 diffs)
• speakers/block-controls.js (modified) (2 diffs)
• speakers/edit.js (modified) (1 diff)
• speakers/index.js (modified) (1 diff)
• speakers/speakers-select.js (modified) (4 diffs)
• sponsors/block-controls.js (modified) (3 diffs)
• sponsors/edit.js (modified) (2 diffs)
• sponsors/index.js (modified) (1 diff)

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sessions/block-controls.js

@@ -16 +16 @@
 import SessionsBlockContent from './block-content';
 import SessionsSelect from './sessions-select';
-
-const LABEL = __( 'Sessions', 'wordcamporg' );
+import { LABEL }                                                        from './index';
 
 class SessionsBlockControls extends BlockControls {
@@ -83 +82 @@
                         <div className="wordcamp-block-edit-mode-option">
                             <SessionsSelect
+                                icon={ icon }
                                 label={ __( 'Choose specific sessions, tracks, or categories', 'wordcamporg' ) }
                                 { ...this.props }

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sessions/edit.js

@@ -18 +18 @@
 import SessionsInspectorControls from './inspector-controls';
 import GridToolbar from '../shared/grid-layout/toolbar';
+import { SESSIONS_ICON }         from './index';
 
 const blockData = window.WordCampBlocks.sessions || {};
-
-const SESSIONS_ICON = 'list-view';
 const MAX_POSTS = 100;
 

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sessions/index.js

@@ -10 +10 @@
 
 export const name = 'wordcamp/sessions';
+export const LABEL         = __( 'Sessions', 'wordcamporg' );
+export const SESSIONS_ICON = 'list-view';
 
 export const settings = {
     title       : __( 'Sessions', 'wordcamporg' ),
     description : __( 'Add a list of sessions.', 'wordcamporg' ),
-    icon        : 'list-view',
+    icon        : SESSIONS_ICON,
     category    : 'wordcamp',
     edit,

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sessions/sessions-select.js

@@ -107 +107 @@
 
     render() {
-        const { label, attributes, setAttributes } = this.props;
+        const { icon, label, attributes, setAttributes } = this.props;
         const { mode, item_ids } = attributes;
         const options = this.buildSelectOptions( mode );
@@ -140 +140 @@
                     formatOptionLabel: ( optionData ) => {
                         return (
-                            <SessionsOption { ...optionData } />
+                            <SessionsOption
+                                icon={ icon }
+                                { ...optionData }
+                            />
                         );
                     },
@@ -149 +152 @@
 }
 
-function SessionsOption( { type, label = '', image = '', count = 0 } ) {
+function SessionsOption( { type, icon, label = '', image = '', count = 0 } ) {
     let optImage, optContent;
 
@@ -169 +172 @@
                         <Dashicon
                             className="wordcamp-item-select-option-icon"
-                            icon={ 'list-view' }
+                            icon={ icon }
                             size={ 16 }
                         />
@@ -188 +191 @@
                     <Dashicon
                         className="wordcamp-item-select-option-icon"
-                        icon={ 'list-view' }
+                        icon={ icon }
                         size={ 16 }
                     />

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/speakers/block-controls.js

@@ -16 +16 @@
 import SpeakersBlockContent from './block-content';
 import SpeakersSelect from './speakers-select';
-
-const LABEL = __( 'Speakers', 'wordcamporg' );
+import { LABEL }                                                        from './index';
 
 class SpeakersBlockControls extends BlockControls {
@@ -82 +81 @@
                         <div className="wordcamp-block-edit-mode-option">
                             <SpeakersSelect
+                                icon={ icon }
                                 label={ __( 'Choose specific speakers or groups', 'wordcamporg' ) }
                                 { ...this.props }

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/speakers/edit.js

@@ -18 +18 @@
 import SpeakersInspectorControls from './inspector-controls';
 import SpeakersToolbar from './toolbar';
+import { SPEAKERS_ICON }         from './index';
 
 const blockData = window.WordCampBlocks.speakers || {};
 
-const SPEAKERS_ICON = 'megaphone';
 const MAX_POSTS = 100;
 

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/speakers/index.js

@@ -10 +10 @@
 
 export const name = 'wordcamp/speakers';
+export const LABEL         = __( 'Speakers', 'wordcamporg' );
+export const SPEAKERS_ICON = 'megaphone';
 
 export const settings = {
     title       : __( 'Speakers', 'wordcamporg' ),
     description : __( 'Add a list of speakers.', 'wordcamporg' ),
-    icon        : 'megaphone',
+    icon        : SPEAKERS_ICON,
     category    : 'wordcamp',
     edit,

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/speakers/speakers-select.js

@@ -100 +100 @@
 
     render() {
-        const { label, attributes, setAttributes } = this.props;
+        const { label, icon, attributes, setAttributes } = this.props;
         const { mode, item_ids } = attributes;
         const options = this.buildSelectOptions( mode );
@@ -133 +133 @@
                     formatOptionLabel: ( optionData ) => {
                         return (
-                            <SpeakersOption { ...optionData } />
+                            <SpeakersOption
+                                icon={ icon }
+                                { ...optionData }
+                            />
                         );
                     },
@@ -142 +145 @@
 }
 
-function SpeakersOption( { type, label = '', avatar = '', count = 0 } ) {
+function SpeakersOption( { type, icon, label = '', avatar = '', count = 0 } ) {
     let image, content;
 
@@ -167 +170 @@
                     <Dashicon
                         className="wordcamp-item-select-option-icon"
-                        icon={ 'megaphone' }
+                        icon={ icon }
                         size={ 16 }
                     />

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sponsors/block-controls.js

@@ -13 +13 @@
 import SponsorBlockContent from './block-content';
 import ItemSelect from '../shared/item-select'
+import { LABEL }                               from './index';
+
 const { Button, Placeholder } = wp.components;
-
-const LABEL = __( 'Sponsors', 'wordcamporg' );
 
 function SponsorOption( option ) {
@@ -243 +243 @@
      */
     render() {
-        const { sponsorPosts, attributes, setAttributes } = this.props;
+        const { icon, attributes, setAttributes, sponsorPosts } = this.props;
         const { mode, post_ids, term_ids } = attributes;
         const { fetchedPosts, posts, terms, selectedPosts, sponsorTermOrder } = this.state;
@@ -290 +290 @@
                 {'all' !== mode &&
                     <Placeholder
-                        icon='heart'
+                        icon={ icon }
                         label = { __('Sponsors', 'wordcamporg') }
                     >

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sponsors/edit.js

@@ -5 +5 @@
 import SponsorBlockControls from './block-controls';
 import GridToolbar from '../shared/grid-layout/toolbar';
+import { SPONSORS_ICON }        from './index';
 
 /**
@@ -65 +66 @@
                 {
                     <SponsorBlockControls
+                        icon={ SPONSORS_ICON }
                         sponsorPosts = { sponsorPosts }
                         sponsorLevels = { sponsorLevels }

sites/trunk/wordcamp.org/public_html/wp-content/mu-plugins/blocks/assets/src/sponsors/index.js

@@ -10 +10 @@
 
 export const name = 'wordcamp/sponsors';
+export const LABEL         = __( 'Sponsors', 'wordcamporg' );
+export const SPONSORS_ICON = 'heart';
 
 export const settings = {
     title       : __( 'Sponsors', 'wordcamporg' ),
     description : __( "We wouldn't have WordCamp without their support.", 'wordcamporg' ),
-    icon        : 'heart',
+    icon        : SPONSORS_ICON,
     category    : 'wordcamp',
     edit,