Magento 2: UiComponent не работает

Я пытаюсь понять, как Ui Components работают в Magento 2. Я сделал простой модуль, который позволяет пользователям добавлять комментарии при запуске маршрута на веб-интерфейсе. Я пытаюсь отобразить эти комментарии в Admin в разделе Customer Edit. Я последовал за этот учебник для реализации Ui Component. Но почему-то я не могу понять / отладить, почему это не работает, как ожидалось.
Вместо сетки я вижу только пустой экран, а при проверке элемента я получаю следующее на вкладке Ответ.

<!--
/**
* Copyright &copy; 2013-2017 Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
--><div class="admin__data-grid-outer-wrap" data-bind="scope: 'comments_listing.comments_listing'">
<div data-role="spinner" data-component="comments_listing.comments_listing.comments_columns" class="admin__data-grid-loading-mask">
<div class="spinner">
<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
</div>
</div>
<!-- ko template: getTemplate() --><!-- /ko -->
<script type="text/x-magento-init">{"*": {"Magento_Ui/js/core/app": {"types":{"dataSource":[],"column.massaction":{"extends":"comments_listing"},"text":{"component":"Magento_Ui\/js\/form\/element\/text","extends":"comments_listing"},"column.text":{"component":"Magento_Ui\/js\/form\/element\/text","extends":"comments_listing"},"columns":{"extends":"comments_listing"},"comments_listing":{"provider":"comments_listing.comments_data_source","deps":"comments_listing.comments_data_source"},"html_content":{"component":"Magento_Ui\/js\/form\/components\/html","extends":"comments_listing"}},"components":{"comments_listing":{"children":{"comments_listing":{"type":"comments_listing","name":"comments_listing","children":{"comments_columns":{"type":"columns","name":"comments_columns","children":{"ids":{"type":"column.massaction","name":"ids","config":{"component":"Magento_Ui\/js\/grid\/columns\/multiselect","indexField":"comment_id"}},"comment_id":{"type":"column.text","name":"comment_id","config":{"component":"Magento_Ui\/js\/grid\/columns\/column","componentType":"column","dataType":"text","filter":"textRange","sorting":"asc","label":"ID"}},"comment":{"type":"column.text","name":"comment","config":{"component":"Magento_Ui\/js\/grid\/columns\/column","componentType":"column","dataType":"text","label":"Comment","filter":"text","visible":true,"formElement":"input","source":"comment","validation":{"required-entry":true}}},"customer_id":{"type":"column.text","name":"customer_id","config":{"component":"Magento_Ui\/js\/grid\/columns\/column","componentType":"column","dataType":"text","visible":true,"formElement":"input","source":"customer_id","label":"Customer ID","filter":"text","validation":{"required-entry":true}}}},"config":{"component":"Magento_Ui\/js\/grid\/listing","componentType":"columns","storageConfig":{"provider":"comments_listing.comments_listing.listing_top.bookmarks","namespace":"current"},"childDefaults":{"storageConfig":{"provider":"comments_listing.comments_listing.listing_top.bookmarks","root":"columns.${ $.index }","namespace":"current.${ $.storageConfig.root}"},"controlVisibility":true}}}},"config":{"component":"uiComponent"}},"comments_data_source":{"type":"dataSource","name":"comments_data_source","dataScope":"comments_listing","config":{"data":{"items":[{"id_field_name":"comment_id","comment_id":"32","customer_id":"2","comment":"Comment Creation","orig_data":null},{"id_field_name":"comment_id","comment_id":"33","customer_id":"2","comment":"Comment Creation","orig_data":null}],"totalRecords":2},"component":"Magento_Ui\/js\/grid\/provider","update_url":"http:\/\/local.vanilla.in\/admin_s57zoo\/mui\/index\/render\/key\/3dbffd9c2a4123b1b44fd84ba0c958bdafa86ed523ed63e585733300f59de291\/","storageConfig":{"indexField":"comment_id"},"params":{"namespace":"comments_listing"}}}}}}}}}</script></div>

Снимок экрана вывода панели администратора

Контроллер (Pranav \ ByeUniverse \ Controller \ Adminhtml \ Index \ Display.php)

<?php
namespace Pranav\ByeUniverse\Controller\Adminhtml\Index;

use Psr\Log\LoggerInterface;

class Display extends \Magento\Framework\App\Action\Action
{
private $_logger;

public function __construct(
\Magento\Framework\App\Action\Context $context,
LoggerInterface $logger
)
{
$this->_logger = $logger;
parent::__construct($context);
}

public function execute()
{
$this->_logger->debug("reached...");
// $this->initCurrentCustomer();
$this->_view->loadLayout();
$this->_view->renderLayout();
//        return $this->resultLayoutFactory->create();
}
}

Макет (byeuniverse_index_display.xml)

<?xml version="1.0" ?>

<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/layout_generic.xsd">
<container name="root" label="Root">
<!--<block class="Pranav\ByeUniverse\Block\Adminhtml\Customer\View\Display" name="comparedproduct.edit.tab.compared" template="Pranav_ByeUniverse::grid.phtml"/>-->
<uiComponent name="comments_listing"/>
</container>
</layout>

Компонент пользовательского интерфейса (comments_listing.xml)

<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">

<!-- main part of the grid -->
<argument name="data" xsi:type="array">
<!-- define where to find the date source -->
<item name="js_config" xsi:type="array">
<item name="provider" xsi:type="string">comments_listing.comments_data_source</item>
<item name="deps" xsi:type="string">comments_listing.comments_data_source</item>
</item>
<!-- define where to find the columns -->
<item name="spinner" xsi:type="string">comments_columns</item>

<item name="buttons" xsi:type="array">
<item name="add" xsi:type="array">
<item name="name" xsi:type="string">add</item>
<item name="label" xsi:type="string" translate="true">Add a new Comment</item>
<item name="class" xsi:type="string">primary</item>
<item name="url" xsi:type="string">*/*/Addcomment</item>
</item>
</item>
</argument>

<!--define the date source (must be the same than in argument/item/provider and argument/js_config/deps-->
<dataSource name="comments_data_source">
<argument name="dataProvider" xsi:type="configurableObject">
<!-- unique name for the grid -->
<argument name="class" xsi:type="string">CommentsGridDataProvider</argument>
<!-- name of the data source same as in argument/js_config/provider -->
<argument name="name" xsi:type="string">comments_data_source</argument>
<argument name="primaryFieldName" xsi:type="string">comment_id</argument>
<argument name="requestFieldName" xsi:type="string">id</argument>
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="component" xsi:type="string">Magento_Ui/js/grid/provider</item>
<item name="update_url" xsi:type="url" path="mui/index/render"/>
<item name="storageConfig" xsi:type="array">
<item name="indexField" xsi:type="string">comment_id</item>
</item>
</item>
</argument>
</argument>
</dataSource>

<!-- define the columns of my grid -->
<columns name="comments_columns">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<!-- Bookmarks behaviour -->
<item name="storageConfig" xsi:type="array">
<item name="provider" xsi:type="string">comments_listing.comments_listing.listing_top.bookmarks</item>
<item name="namespace" xsi:type="string">current</item>
</item>
<item name="childDefaults" xsi:type="array">
<item name="controlVisibility" xsi:type="boolean">true</item>
<item name="storageConfig" xsi:type="array">
<item name="provider" xsi:type="string">comments_listing.comments_listing.listing_top.bookmarks</item>
<item name="root" xsi:type="string">columns.${ $.index }</item>
<item name="namespace" xsi:type="string">current.${ $.storageConfig.root}</item>
</item>
</item>
</item>
</argument>

<selectionsColumn name="ids">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<!-- define which field will be used as ID -->
<item name="indexField" xsi:type="string">comment_id</item>
</item>
</argument>
</selectionsColumn>

<!-- Column ID -->
<column name="comment_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">textRange</item>
<item name="sorting" xsi:type="string">asc</item>
<item name="label" xsi:type="string" translate="true">ID</item>
</item>
</argument>
</column>
<!-- Column name -->
<column name="comment">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Comment</item>
<item name="filter" xsi:type="string">text</item>
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">comment</item>
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
</item>
</argument>
</column>
<!-- Column customer Id -->
<column name="customer_id">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="visible" xsi:type="boolean">true</item>
<item name="dataType" xsi:type="string">text</item>
<item name="formElement" xsi:type="string">input</item>
<item name="source" xsi:type="string">customer_id</item>
<item name="label" xsi:type="string" translate="true">Customer ID</item>
<item name="filter" xsi:type="string">text</item>
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
</item>
</argument>
</column>
</columns>
</listing>

di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<virtualType name="CommentsGridDataProvider" type="Magento\Framework\View\Element\UiComponent\DataProvider\DataProvider">
<arguments>
<argument name="collection" xsi:type="object" shared="false">Pranav\ByeUniverse\Model\ResourceModel\Comment\Collection</argument>
<argument name="filterPool" xsi:type="object" shared="false">CommentsGridFilterPool</argument> <!-- Define new object for filters -->
</arguments>
</virtualType>

<virtualType name="CommentsGridFilterPool" type="Magento\Framework\View\Element\UiComponent\DataProvider\FilterPool">
<arguments>
<argument name="appliers" xsi:type="array">
<item name="regular" xsi:type="object">Magento\Framework\View\Element\UiComponent\DataProvider\RegularFilter</item>
<item name="fulltext" xsi:type="object">Magento\Framework\View\Element\UiComponent\DataProvider\FulltextFilter</item>
</argument>
</arguments>
</virtualType><type name="Magento\Framework\View\Element\UiComponent\DataProvider\CollectionFactory">
<arguments>
<argument name="collections" xsi:type="array">
<item name="comments_data_source" xsi:type="string">Pranav\ByeUniverse\Model\ResourceModel\Comment\Grid\Collection</item>
</argument>
</arguments>
</type>

<virtualType name="Pranav\ByeUniverse\Model\ResourceModel\Comment\Grid\Collection" type="Magento\Framework\View\Element\UiComponent\DataProvider\SearchResult">
<arguments>
<argument name="mainTable" xsi:type="string">byeuniverse_comments</argument>
<argument name="resourceModel" xsi:type="string">Pranav\ByeUniverse\Model\ResourceModel\Comment</argument>
</arguments>
</virtualType>
</config>

Pranav \ ByeUniverse \ Model \ ResourceModel \ Комментарий \ Collection.php

<?php

namespace Pranav\ByeUniverse\Model\ResourceModel\Comment;

use Magento\Framework\Model\ResourceModel\Db\Collection\AbstractCollection;

class Collection extends AbstractCollection
{
protected function _construct()
{
$this->_init('Pranav\ByeUniverse\Model\Comment', 'Pranav\ByeUniverse\Model\ResourceModel\Comment');
}
}

Pranav \ ByeUniverse \ Model \ ResourceModel \ Комментарии \ Сетка \ Collection.php

<?php

namespace Pranav\ByeUniverse\Model\ResourceModel\Comment\Grid;class Collection extends \Pranav\ByeUniverse\Model\ResourceModel\Comment\Collection implements \Magento\Framework\Api\Search\SearchResultInterface
{
/**
* Set items list.
*
* @param \Magento\Framework\Api\Search\DocumentInterface[] $items
* @return $this
*/
public function setItems(array $items = null)
{
// TODO: Implement setItems() method.
}

/**
* @return \Magento\Framework\Api\Search\AggregationInterface
*/
public function getAggregations()
{
// TODO: Implement getAggregations() method.
}

/**
* @param \Magento\Framework\Api\Search\AggregationInterface $aggregations
* @return $this
*/
public function setAggregations($aggregations)
{

}

/**
* Get search criteria.
*
* @return \Magento\Framework\Api\Search\SearchCriteriaInterface
*/
public function getSearchCriteria()
{
return null;
}

/**
* Set search criteria.
*
* @param \Magento\Framework\Api\SearchCriteriaInterface $searchCriteria
* @return $this
*/
public function setSearchCriteria(\Magento\Framework\Api\SearchCriteriaInterface $searchCriteria)
{
return $this;
}

/**
* Get total count.
*
* @return int
*/
public function getTotalCount()
{
return $this->getSize();
}

/**
* Set total count.
*
* @param int $totalCount
* @return $this
*/
public function setTotalCount($totalCount)
{
return $this;
}
}

Модель ресурсов

<?php

namespace Pranav\ByeUniverse\Model\ResourceModel;

use Pranav\ByeUniverse\Setup\InstallSchema;

class Comment extends \Magento\Framework\Model\ResourceModel\Db\AbstractDb
{
protected function _construct()
{
$this->_init(InstallSchema::TABLE_COMMENTS, InstallSchema::COLUMN_COMMENT_ID);
}
}

НОТА

InstallSchema::TABLE_COMMENTS = 'byeuniverse_comments';
InstallSchema::COLUMN_COMMENT_ID = 'comment_id';

Таблица базы данных ‘byeuniverse_comments’ имеет 3 столбца comment_id(автоматическое приращение), комментарий(содержание комментария), Пользовательский ИД(внешний ключ ссылается на entity_id из таблицы customer_entity)

Я с трудом отлаживаю приведенный выше код, я мог бы использовать некоторую помощь от вас, ребята.

Благодарю.