Skip to content

Commit bddb22a

Browse files
committed
Fix component name
1 parent 9620557 commit bddb22a

2 files changed

Lines changed: 34 additions & 22 deletions

File tree

etc/loki_components.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<?xml version="1.0" encoding="UTF-8" ?>
22
<components xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Loki_Components:etc/loki_components.xsd">
33
<component
4-
name="loki-components.debugger"
4+
name="loki-debugger.debugger"
55
context="Loki\Debugger\Component\Debugger\DebuggerContext"
66
viewModel="Loki\Debugger\Component\Debugger\DebuggerViewModel"/>
77
</components>

view/frontend/templates/component/debugger.phtml

Lines changed: 33 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,9 @@ use Loki\Components\Factory\ViewModelFactory;
1818
$idConvertor = $viewModelFactory->create(IdConvertor::class);
1919
$htmlId = $idConvertor->toElementId($block->getNameInLayout());
2020
?>
21-
<div class="<?= $css('hidden md:block w-full border-t border-gray-400', '@todo') ?>">
22-
<div class="<?= $css('flex items-stretch overflow-x-auto', '@todo') ?>" role="tablist">
23-
<div class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
21+
<div class="<?= $css('hidden md:block w-full border-t border-gray-400', 'td') ?>">
22+
<div class="<?= $css('flex items-stretch overflow-x-auto', 'td') ?>" role="tablist">
23+
<div class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
2424
<span role="tab">Loki Debugger</span>
2525
</div>
2626
<div>
@@ -30,8 +30,8 @@ $htmlId = $idConvertor->toElementId($block->getNameInLayout());
3030
data-tab-name="server"
3131
type="button"
3232
@click="switchTab"
33-
:class="<?= $css('buttonCssClass', '@todo') ?>"
34-
class="<?= $css('inline-flex rounded-t-lg border-t border-l border-r p-4 border-gray-300 ', '@todo') ?>">
33+
:class="buttonCssClass"
34+
class="<?= $css('inline-flex rounded-t-lg border-t border-l border-r p-4 border-gray-300 ', 'button-server') ?>">
3535
Server Dump
3636
</button>
3737
</div>
@@ -42,47 +42,59 @@ $htmlId = $idConvertor->toElementId($block->getNameInLayout());
4242
data-tab-name="components"
4343
type="button"
4444
@click="switchTab"
45-
:class="<?= $css('buttonCssClass', '@todo') ?>"
46-
class="<?= $css('inline-flex rounded-t-lg border-t border-l border-r p-4 border-gray-300 ', '@todo') ?>">
45+
:class="buttonCssClass"
46+
class="<?= $css('inline-flex rounded-t-lg border-t border-l border-r p-4 border-gray-300 ', 'button-components') ?>">
4747
Registered Components
4848
</button>
4949
</div>
5050
</div>
5151

5252
<div>
53-
<div :class="<?= $css('tabCssClass', '@todo') ?>" class="<?= $css('p-4', '@todo') ?>" data-tab-name="server" id="tab-server">
54-
<h3 class="<?= $css('text-xl my-4', '@todo') ?>">Server Dump</h3>
53+
<div :class="tabCssClass" class="<?= $css('p-4', 'tab-server') ?>" data-tab-name="server" id="tab-server">
54+
<h3 class="<?= $css('text-xl my-4', 'tab-heading') ?>">
55+
Server Dump
56+
</h3>
5557
<pre><?php var_dump($viewModel->getData()) ?></pre>
5658
</div>
5759

58-
<div :class="<?= $css('tabCssClass', '@todo') ?>" class="<?= $css('p-4', '@todo') ?>" data-tab-name="components" id="tab-components">
59-
<table class="<?= $css('table-auto w-full text-xs', '@todo') ?>">
60+
<div :class="tabCssClass" class="<?= $css('p-4', 'tab-components') ?>" data-tab-name="components" id="tab-components">
61+
<table class="<?= $css('table-auto w-full text-xs', 'table') ?>">
6062
<thead>
6163
<tr>
62-
<th class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">Alpine Instance / Component</th>
63-
<th class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">Element ID</th>
64-
<th class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">Loki Component Name</th>
65-
<th class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">Value</th>
66-
<th class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">Details</th>
64+
<th class="<?= $css('border-b border-gray-300 p-2', 'th') ?>">
65+
Alpine Instance / Component
66+
</th>
67+
<th class="<?= $css('border-b border-gray-300 p-2', 'th') ?>">
68+
Element ID
69+
</th>
70+
<th class="<?= $css('border-b border-gray-300 p-2', 'th') ?>">
71+
Loki Component Name
72+
</th>
73+
<th class="<?= $css('border-b border-gray-300 p-2', 'th') ?>">
74+
Value
75+
</th>
76+
<th class="<?= $css('border-b border-gray-300 p-2', 'th') ?>">
77+
Details
78+
</th>
6779
</tr>
6880
</thead>
6981
<tbody>
7082
<template x-for="component in components" :key="component.id">
7183
<tr>
72-
<td class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
84+
<td class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
7385
<strong><code x-text="component.id"></code></strong><br/>
7486
<code x-text="component.name"></code>
7587
</td>
76-
<td class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
88+
<td class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
7789
<code x-text="component.elementId"></code>
7890
</td>
79-
<td class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
91+
<td class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
8092
<code x-text="component.blockId"></code>
8193
</td>
82-
<td class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
94+
<td class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
8395
<code x-text="component.value"></code>
8496
</td>
85-
<td class="<?= $css('border-b border-gray-300 p-2', '@todo') ?>">
97+
<td class="<?= $css('border-b border-gray-300 p-2', 'td') ?>">
8698
<code x-json="component.getDetails"></code>
8799
</td>
88100
</tr>

0 commit comments

Comments
 (0)