How to allow your custom widget as block in gutemberg editor

I found the solution here and here.

My OOP Code :

Block_Type

abstract Class Block_Type
{
    public $handle;
    public $handle_editor;
    public $handle_block;
    private $editor_js_file;
    public $editor_js_file_path;
    private $editor_css_file;
    public $editor_css_file_path;
    private $css_file;
    public $css_file_path;

    public function __construct( $handle, $editor_js_file_path = null, $editor_css_file_path = null, $css_file_path = null ) {
        $this->handle = "h4a-" . $handle;
        $this->handle_editor = $this->handle . "-editor";
        $this->handle_block = $this->handle . "-block";
        $this->editor_js_file_path  = ( !empty( $editor_js_file_path ) )  ?  $editor_js_file_path : $this->getDir() . "/js/index.js";
        $this->editor_js_file       = basename( $this->editor_js_file_path, ".js");
        $this->editor_css_file_path = ( !empty( $editor_css_file_path ) ) ? $editor_css_file_path : $this->getDir() . "/css/editor.css";
        $this->editor_css_file      = basename( $this->editor_css_file_path, ".css");
        $this->css_file_path        = ( !empty( $css_file_path ) )        ? $css_file_path        : $this->getDir() . "/css/style.css";
        $this->css_file             = basename( $this->css_file_path, ".css");
        $this->register_script_editor();
        $this->register_style_editor();
        $this->register_style();
        $this->register_block_type();
    }

    protected function register_script_editor()
    {
        wp_register_script(
            $this->handle_editor,
            plugins_url( $this->editor_js_file, __FILE__ ),
            array(
                'wp-blocks',
                'wp-i18n',
                'wp-element',
            ),
            filemtime( $this->editor_js_file_path )
        );
    }

    protected function register_style_editor()
    {
        wp_register_style(
            $this->handle_editor,
            plugins_url( $this->editor_css_file, __FILE__ ),
            array(),
            filemtime( $this->editor_css_file_path )
        );
    }

    protected function register_style()
    {
        wp_register_style(
            $this->handle_block,
            plugins_url( $this->css_file, __FILE__ ),
            array(),
            filemtime( $this->css_file_path )
        );
    }

    protected function register_block_type()
    {
        register_block_type( 'h4a/' . $this->handle, array(
            'editor_script' => $this->handle_editor,
            'editor_style'  => $this->handle_editor,
            'style'         => $this->handle_block,
        ) );
    }

    private function getDir() {
        return dirname((new ReflectionClass(static::class))->getFileName());
    }
} 

My_Block_Type

class My_Block_Type extends Block_Type
{
    public function __construct()
    {
        $handle = "my-block-type";
        parent::__construct( $handle );
    }
}

php to init

include_once "Block_Type.php";
include_once "My_Block_Type.php";
public function create_block_types(){
    new My_Block_Type();
}
add_action( "init", "create_block_types", 1 );