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,