Skip to content

Commit a140c32

Browse files
javiereguiluzjaviereguiluz
committed
Update the design of the Symfony Profiler panel
Fixes Fix issue with variable not available inside macro Fix logic Fix the icon version for real
1 parent 019b0fb commit a140c32

File tree

2 files changed

+140
-66
lines changed

2 files changed

+140
-66
lines changed

‎Resources/views/Collector/icon-v3.svg

Lines changed: 6 additions & 0 deletions
Loading

‎Resources/views/Collector/migrations.html.twig

Lines changed: 134 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
{% extends '@WebProfiler/Profiler/layout.html.twig' %}
22

3-
{% import _self as helper %}
4-
53
{% block toolbar %}
64
{% if collector.data.unavailable_migrations_count is defined %}
75
{% set unavailable_migrations = collector.data.unavailable_migrations_count %}
@@ -13,30 +11,45 @@
1311
{% set status_color = new_migrations > 0 ? 'red' : status_color %}
1412

1513
{% set icon %}
16-
{{ include('@DoctrineMigrations/Collector/icon.svg') }}
14+
{% if profiler_markup_version < 3 %}
15+
{{ include('@DoctrineMigrations/Collector/icon.svg') }}
16+
{% else %}
17+
{{ include('@DoctrineMigrations/Collector/icon-v3.svg') }}
18+
{% endif %}
19+
1720
<span class="sf-toolbar-value">{{ new_migrations + unavailable_migrations }}</span>
1821
{% endset %}
1922

2023
{% set text %}
21-
<div class="sf-toolbar-info-piece">
22-
<b>Current</b>
23-
<span>{{ executed_migrations > 0 ? collector.data.executed_migrations|last.version|split('\\')|last : 'n/a' }}</span>
24-
</div>
25-
<div class="sf-toolbar-info-piece">
26-
<b>Executed</b>
27-
<span class="sf-toolbar-status">{{ executed_migrations }}</span>
28-
</div>
29-
<div class="sf-toolbar-info-piece">
30-
<b>Executed Unavailable</b>
31-
<span class="sf-toolbar-status {{ unavailable_migrations > 0 ? 'sf-toolbar-status-yellow' }}">{{ unavailable_migrations }}</span>
32-
</div>
33-
<div class="sf-toolbar-info-piece">
34-
<b>Available</b>
35-
<span class="sf-toolbar-status">{{ available_migrations }}</span>
24+
<div class="sf-toolbar-info-group">
25+
<div class="sf-toolbar-info-piece">
26+
<b>Current Migration</b>
27+
<span>{{ executed_migrations > 0 ? collector.data.executed_migrations|last.version|split('\\')|last : 'n/a' }}</span>
28+
</div>
3629
</div>
37-
<div class="sf-toolbar-info-piece">
38-
<b>New</b>
39-
<span class="sf-toolbar-status {{ new_migrations > 0 ? 'sf-toolbar-status-red' }}">{{ new_migrations }}</span>
30+
31+
<div class="sf-toolbar-info-group">
32+
<div class="sf-toolbar-info-piece">
33+
<span class="sf-toolbar-header">
34+
<b>Database Migrations</b>
35+
</span>
36+
</div>
37+
<div class="sf-toolbar-info-piece">
38+
<b>Executed</b>
39+
<span class="sf-toolbar-status">{{ executed_migrations }}</span>
40+
</div>
41+
<div class="sf-toolbar-info-piece">
42+
<b>Unavailable</b>
43+
<span class="sf-toolbar-status {{ unavailable_migrations > 0 ? 'sf-toolbar-status-yellow' }}">{{ unavailable_migrations }}</span>
44+
</div>
45+
<div class="sf-toolbar-info-piece">
46+
<b>Available</b>
47+
<span class="sf-toolbar-status">{{ available_migrations }}</span>
48+
</div>
49+
<div class="sf-toolbar-info-piece">
50+
<b>New</b>
51+
<span class="sf-toolbar-status {{ new_migrations > 0 ? 'sf-toolbar-status-red' }}">{{ new_migrations }}</span>
52+
</div>
4053
</div>
4154
{% endset %}
4255

@@ -45,15 +58,21 @@
4558
{% endif %}
4659
{% endblock %}
4760

48-
4961
{% block menu %}
5062
{% if collector.data.unavailable_migrations_count is defined %}
5163
{% set unavailable_migrations = collector.data.unavailable_migrations_count %}
5264
{% set new_migrations = collector.data.new_migrations|length %}
5365
{% set label = unavailable_migrations > 0 ? 'label-status-warning' : '' %}
5466
{% set label = new_migrations > 0 ? 'label-status-error' : label %}
5567
<span class="label {{ label }}">
56-
<span class="icon">{{ include('@DoctrineMigrations/Collector/icon.svg') }}</span>
68+
<span class="icon">
69+
{% if profiler_markup_version < 3 %}
70+
{{ include('@DoctrineMigrations/Collector/icon.svg') }}
71+
{% else %}
72+
{{ include('@DoctrineMigrations/Collector/icon-v3.svg') }}
73+
{% endif %}
74+
</span>
75+
5776
<strong>Migrations</strong>
5877
{% if unavailable_migrations > 0 or new_migrations > 0 %}
5978
<span class="count">
@@ -65,32 +84,91 @@
6584
{% endblock %}
6685

6786
{% block panel %}
87+
{% set num_executed_migrations = collector.data.executed_migrations|length %}
88+
{% set num_unavailable_migrations = collector.data.unavailable_migrations_count %}
89+
{% set num_available_migrations = collector.data.available_migrations_count %}
90+
{% set num_new_migrations = collector.data.new_migrations|length %}
91+
6892
<h2>Doctrine Migrations</h2>
6993
<div class="metrics">
7094
<div class="metric">
71-
<span class="value">{{ collector.data.executed_migrations|length }}</span>
95+
<span class="value">{{ num_executed_migrations }}</span>
7296
<span class="label">Executed</span>
7397
</div>
98+
99+
{% if profiler_markup_version >= 3 %}
100+
<div class="metric-group">
101+
{% endif %}
102+
74103
<div class="metric">
75-
<span class="value">{{ collector.data.unavailable_migrations_count }}</span>
76-
<span class="label">Executed Unavailable</span>
104+
<span class="value">{{ num_unavailable_migrations }}</span>
105+
<span class="label">Unavailable</span>
77106
</div>
78107
<div class="metric">
79-
<span class="value">{{ collector.data.available_migrations_count }}</span>
108+
<span class="value">{{ num_available_migrations }}</span>
80109
<span class="label">Available</span>
81110
</div>
82111
<div class="metric">
83-
<span class="value">{{ collector.data.new_migrations|length }}</span>
112+
<span class="value">{{ num_new_migrations }}</span>
84113
<span class="label">New</span>
85114
</div>
115+
116+
{% if profiler_markup_version >= 3 %}
117+
</div> {# closes the <div class="metric-group"> #}
118+
{% endif %}
119+
</div>
120+
121+
<div class="sf-tabs">
122+
<div class="tab">
123+
<h3 class="tab-title">
124+
Migrations
125+
<span class="badge {{ num_new_migrations > 0 ? 'status-error' : num_unavailable_migrations > 0 ? 'status-warning' }}">
126+
{{ num_new_migrations > 0 ? num_new_migrations : num_unavailable_migrations > 0 ? num_unavailable_migrations : num_executed_migrations }}
127+
</span>
128+
</h3>
129+
130+
<div class="tab-content">
131+
{{ _self.render_migration_details(collector, profiler_markup_version) }}
132+
</div>
133+
</div>
134+
135+
<div class="tab">
136+
<h3 class="tab-title">Configuration</h3>
137+
138+
<div class="tab-content">
139+
{{ _self.render_configuration_details(collector, profiler_markup_version) }}
140+
</div>
141+
</div>
86142
</div>
143+
{% endblock %}
87144

88-
<h3>Configuration</h3>
145+
{% macro render_migration_details(collector) %}
89146
<table>
90147
<thead>
91-
<tr>
92-
<th colspan="2" class="colored font-normal">Storage</th>
93-
</tr>
148+
<tr>
149+
<th class="colored font-normal">Version</th>
150+
<th class="colored font-normal">Description</th>
151+
<th class="colored font-normal">Status</th>
152+
<th class="colored font-normal">Executed at</th>
153+
<th class="colored font-normal text-right">Execution time</th>
154+
</tr>
155+
</thead>
156+
{% for migration in collector.data.new_migrations %}
157+
{{ _self.render_migration(migration) }}
158+
{% endfor %}
159+
160+
{% for migration in collector.data.executed_migrations|reverse %}
161+
{{ _self.render_migration(migration) }}
162+
{% endfor %}
163+
</table>
164+
{% endmacro %}
165+
166+
{% macro render_configuration_details(collector) %}
167+
<table>
168+
<thead>
169+
<tr>
170+
<th colspan="2" class="colored font-normal">Storage</th>
171+
</tr>
94172
</thead>
95173
<tr>
96174
<td class="font-normal">Type</td>
@@ -109,11 +187,12 @@
109187
</tr>
110188
{% endif %}
111189
</table>
190+
112191
<table>
113192
<thead>
114-
<tr>
115-
<th colspan="2" class="colored font-normal">Database</th>
116-
</tr>
193+
<tr>
194+
<th colspan="2" class="colored font-normal">Database</th>
195+
</tr>
117196
</thead>
118197
<tr>
119198
<td class="font-normal">Driver</td>
@@ -124,11 +203,12 @@
124203
<td class="font-normal">{{ collector.data.name }}</td>
125204
</tr>
126205
</table>
206+
127207
<table>
128208
<thead>
129-
<tr>
130-
<th colspan="2" class="colored font-normal">Migration Namespaces</th>
131-
</tr>
209+
<tr>
210+
<th colspan="2" class="colored font-normal">Migration Namespaces</th>
211+
</tr>
132212
</thead>
133213
{% for namespace, directory in collector.data.namespaces %}
134214
<tr>
@@ -137,29 +217,9 @@
137217
</tr>
138218
{% endfor %}
139219
</table>
220+
{% endmacro %}
140221

141-
<h3>Migrations</h3>
142-
<table>
143-
<thead>
144-
<tr>
145-
<th class="colored font-normal">Version</th>
146-
<th class="colored font-normal">Description</th>
147-
<th class="colored font-normal">Status</th>
148-
<th class="colored font-normal">Executed at</th>
149-
<th class="colored font-normal">Execution time</th>
150-
</tr>
151-
</thead>
152-
{% for migration in collector.data.new_migrations %}
153-
{{ helper.render_migration(migration) }}
154-
{% endfor %}
155-
156-
{% for migration in collector.data.executed_migrations|reverse %}
157-
{{ helper.render_migration(migration) }}
158-
{% endfor %}
159-
</table>
160-
{% endblock %}
161-
162-
{% macro render_migration(migration) %}
222+
{% macro render_migration(migration, profiler_markup_version) %}
163223
<tr>
164224
<td class="font-normal">
165225
{% if migration.file %}
@@ -169,16 +229,24 @@
169229
{% endif %}
170230
</td>
171231
<td class="font-normal">{{ migration.description }}</td>
172-
<td class="font-normal">
232+
<td class="font-normal align-right">
173233
{% if migration.is_new %}
174-
<span class="label status-error">NOT EXECUTED</span>
234+
<span class="{{ profiler_markup_version >= 3 ? 'badge badge-error' : 'label status-error' }}">NOT EXECUTED</span>
175235
{% elseif migration.is_unavailable %}
176-
<span class="label status-warning">UNAVAILABLE</span>
236+
<span class="{{ profiler_markup_version >= 3 ? 'badge badge-warning' : 'label status-warning' }}">UNAVAILABLE</span>
237+
{% else %}
238+
<span class="{{ profiler_markup_version >= 3 ? 'badge badge-success' : 'label status-success' }}">EXECUTED</span>
239+
{% endif %}
240+
</td>
241+
<td class="font-normal">{{ migration.executed_at ? migration.executed_at|date('M j, Y H:i') : 'n/a' }}</td>
242+
<td class="font-normal text-right">
243+
{% if migration.execution_time is null %}
244+
n/a
245+
{% elseif migration.execution_time < 1 %}
246+
{{ (migration.execution_time * 1000)|number_format(0) }} ms
177247
{% else %}
178-
<span class="label status-success">EXECUTED</span>
248+
{{ migration.execution_time|number_format(2) }} seconds
179249
{% endif %}
180250
</td>
181-
<td class="font-normal">{{ migration.executed_at ? migration.executed_at|date : 'n/a' }}</td>
182-
<td class="font-normal">{{ migration.execution_time|default('n/a') }}</td>
183251
</tr>
184252
{% endmacro %}

0 commit comments

Comments
 (0)