Add shortcode and gutenberg block for menu section

assets/js/src/block-menu-section.js

@@ -0,0 +1,58 @@
+const { __ } = wp.i18n;
+const {	registerBlockType } = wp.blocks;
+const { SelectControl, PanelBody, ServerSideRender, Disabled } = wp.components;
+const {	InspectorControls } = wp.editor;
+const {	menuSectionOptions } = fdm_blocks;
+
+registerBlockType( 'food-and-drink-menu/menu-section', {
+	title: __( 'Menu Section', 'food-and-drink-menu' ),
+	category: 'widgets',
+	icon: <svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M7 0c-3.314 0-6 3.134-6 7 0 3.31 1.969 6.083 4.616 6.812l-0.993 16.191c-0.067 1.098 0.778 1.996 1.878 1.996h1c1.1 0 1.945-0.898 1.878-1.996l-0.993-16.191c2.646-0.729 4.616-3.502 4.616-6.812 0-3.866-2.686-7-6-7zM27.167 0l-1.667 10h-1.25l-0.833-10h-0.833l-0.833 10h-1.25l-1.667-10h-0.833v13c0 0.552 0.448 1 1 1h2.604l-0.982 16.004c-0.067 1.098 0.778 1.996 1.878 1.996h1c1.1 0 1.945-0.898 1.878-1.996l-0.982-16.004h2.604c0.552 0 1-0.448 1-1v-13h-0.833z" /></svg>,
+	attributes: {
+		id: {
+			type: 'number',
+			default: 0
+		}
+	},
+	supports: {
+		html: false,
+	},
+	edit( { attributes, setAttributes } ) {
+		const { id } = attributes;
+
+		function setId( id ) {
+			setAttributes( { id: id } );
+		}
+
+		return (
+			<div>
+				<InspectorControls>
+					 <PanelBody>
+						<SelectControl
+							label={ __( 'Select a Menu Section', 'food-and-drink-menu' ) }
+							value={ id }
+							onChange={ setId }
+							options={ menuSectionOptions }
+						/>
+					</PanelBody>
+				</InspectorControls>
+				{id && id !== '0' ? (
+					<Disabled>
+						<ServerSideRender block="food-and-drink-menu/menu-section" attributes={ attributes } />
+					</Disabled>
+				) : (
+					<SelectControl
+						label={ __( 'Select a Menu Section' ) }
+						value={ 0 }
+						onChange={ setId }
+						options={ menuSectionOptions }
+						className="fdm-block-select"
+					/>
+				)}
+			</div>
+		);
+	},
+	save() {
+		return null;
+	},
+} );

includes/class-blocks.php

@@ -61,6 +61,18 @@ public function register() {
 			),
 		) );
 
+		register_block_type( 'food-and-drink-menu/menu-section', array(
+			'editor_script' => 'food-and-drink-menu-blocks',
+			'editor_style' => $load_styles,
+			'render_callback' => array( $this, 'render_menu_section' ),
+			'attributes' => array(
+				'id' => array(
+					'type' => 'number',
+					'minimum' => '0',
+				),
+			),
+		) );
+
 		register_block_type( 'food-and-drink-menu/menu-item', array(
 			'editor_script' => 'food-and-drink-menu-blocks',
 			'editor_style' => $load_styles,
@@ -113,13 +125,24 @@ public function register_admin() {
 		}
 		wp_reset_postdata();
 
+
+		$menu_sections = get_terms( 'fdm-menu-section', array( 'hide_empty' => true ) );
+		$menu_section_options = array( array( 'value' => 0, 'label' => '' ) );
+		foreach( $menu_sections as $menu_section ) {
+			$menu_section_options[] = array(
+				'value' => $menu_section->term_id,
+				'label' => $menu_section->name,
+			);
+		}
+
 		wp_add_inline_script(
 			'food-and-drink-menu-blocks',
 			sprintf(
 				'var fdm_blocks = %s;',
 				json_encode( array(
 					'menuOptions' => $menu_options,
 					'menuItemOptions' => $menu_item_options,
+					'menuSectionOptions' => $menu_section_options,
 				) )
 			),
 			'before'
@@ -137,6 +160,17 @@ public function render_menu( $attributes ) {
 		return !$id ? ' ' : do_shortcode('[fdm-menu id='  . $id . ']');
 	}
 
+	/**
+	 * Render a single menu section
+	 *
+	 * @param array $attributes The block attributes
+	 * @return string
+	 */
+	public function render_menu_section( $attributes ) {
+		$id = !empty( $attributes['id'] ) ? absint( $attributes['id'] ) : 0;
+		return !$id ? ' ' : do_shortcode('[fdm-menu-section id='  . $id . ']');
+	}
+
 	/**
 	 * Render a single menu item
 	 *

includes/template-functions.php

@@ -32,6 +32,33 @@ function fdm_menu_shortcode( $atts ) {
 }
 add_shortcode( 'fdm-menu', 'fdm_menu_shortcode' );
 
+/**
+ * Create a shortcode to display a menu section
+ * @since 1.0
+ */
+function fdm_menu_section_shortcode( $atts ) {
+
+	error_log('hi: ' . print_r($atts,true));
+
+	// Define shortcode attributes
+	$menu_section_atts = array(
+		'id' => null,
+	);
+
+	// Create filter so addons can modify the accepted attributes
+	$menu_section_atts = apply_filters( 'fdm_shortcode_menu_section_atts', $menu_section_atts );
+
+	// Extract the shortcode attributes
+	$args = shortcode_atts( $menu_section_atts, $atts );
+
+	// Render menu
+	fdm_load_view_files();
+	$menu = new fdmViewSection( $args );
+
+	return $menu->render();
+}
+add_shortcode( 'fdm-menu-section', 'fdm_menu_section_shortcode' );
+
 /**
  * Create a shortcode to display a menu item
  * @since 1.1

webpack.config.js

@@ -3,6 +3,7 @@ let webpack = require( 'webpack' ),
 	webpackConfig = {
 		entry: [
 			'./assets/js/src/block-menu.js',
+			'./assets/js/src/block-menu-section.js',
 			'./assets/js/src/block-menu-item.js',
 		],
 		output: {