component does not load in block.js

` /**

BLOCK: nh-blocks
Registering a basic block with Gutenberg.
Simple block, renders and saves the same content without any interactivity. */ import { categories } from '../components/categories'; // Import CSS. // import './editor.scss'; // import './style.scss';

const { } = wp.i18n; // Import () from wp.i18n const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks const { PlainText, RichText, InspectorControls } = wp.editor; const { Fragment } = wp.element; const { TextControl, ToggleControl, Panel, PanelBody, PanelRow, SelectControl, Dropdown, Button, CheckboxControl } = wp.components; /**

Register: aa Gutenberg Block.
Registers a new block provided a unique name and an object defining its
behavior. Once registered, the block is made editor as an option to any
editor interface where blocks are implemented.
@link https://wordpress.org/gutenberg/handbook/block-api/
@param {string} name Block name.
@param {Object} settings Block settings.
@return {?WPBlock} The block, if it has been successfully
registered; otherwise undefined. */ registerBlockType( 'cgb/block-nh-blocks', { // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block. title: ( 'nh-blocks - Latest Block' ), // Block title. icon: 'shield', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/. category: 'text', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed. keywords: [ ( 'nh-blocks — Post Block' ), ( 'Posts by Category' ), ( 'create-guten-block' ), ],

attributes: { categories: { type: 'array' }, selectCategory: { type: 'string' },

}, /**
- The edit function describes the structure of your block in the context of the editor.
- This represents what the editor will render when the block is used.
- The "edit" property must be a valid function.
- @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
- @param {Object} props Props.
- @returns {Mixed} JSX Component. */ edit: ( props ) => { // Creates a
  . if ( ! props.attributes.categories ) { wp.apiFetch( { url: '/wp-json/wp/v2/categories', } ).then( categories => { props.setAttributes( { categories: categories } ); } ); } console.log( props.attributes.categories );
  
  return (
```
<InspectorControls>
    <PanelBody>

        <PanelRow>
            <label>Set Filter</label>

        </PanelRow>
        <PanelRow>
            <categories />
        </PanelRow>
    </PanelBody>
</InspectorControls>
```
  ); },
/**
- The save function defines the way in which the different attributes should be combined
- into the final markup, which is then serialized by Gutenberg into post_content.
- The "save" property must be specified and must be a valid function.
- @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
- @param {Object} props Props.
- @returns {Mixed} JSX Frontend HTML. */ save: ( { className, attributes, setAttributes } ) => { return null; }, } );

const { Component } = wp.element;

export class categories extends Component { constructor( props ) { super( ...arguments ); this.props = props; }

render() {
    return (
        <p>categories label</p>

    );
}

}

ahmadawais / create-guten-block

component does not load in block.js #286