Use MicroKernelTrait to bootstrap application. Rewrote routes, controllers and structure of application a bit. Including use of twig.

templates/product.html.twig

@@ -0,0 +1,91 @@
+{% extends "template.html.twig" %}
+
+{% block content %}
+    <table class='table table-hover'>
+        <tr>
+            <td class="align-middle font-weight-bold h3"><a class="text-warning text-decoration-none"
+                                                            href="{{ path('app_star', {'productId': product.id}) }}">{% if product.starred %}★{% else %} ☆ {% endif %}</a></td>
+            <td><img src='{{ product.image }}&width=150' class='border rounded p-1' alt='{{ product.name }}'/></td>
+            <td><a href='{{ path('app_home') }}/product/{{ product.id }}' class="text-decoration-none">{{ product.name }}</a></td>
+            <td>{{ product.subTitle }}</td>
+            <td>
+                <ul class='nav'>
+                    {% for category in product.categories %}
+                        <li class="nav-item"><a class="nav-link" href="{{ path('app_category', {'category': category}) }}"> {{ category }} </a></li>
+                    {% endfor %}
+                </ul>
+            </td>
+            <td><a href='https://pl.ryobitools.eu/{{ product.url }}'>link</a></td>
+        </tr>
+        <tr>
+            <td colspan="4">
+                <div style="width: 800px;">
+                    <canvas id="price"></canvas>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <td colspan="4">
+                <table class='table table-hover table-sm mb-0'>
+                    <thead>
+                    <tr>
+                        <th>price</th>
+                        <th>lowest product price in 30 days</th>
+                        <th colspan='2'>standard price</th>
+                    </tr>
+                    </thead>
+                    {% for price in product.price %}
+                        <tr>
+                            <td>{{ price.price }}</td>
+                            <td>{{ price.lowestProductPrice30Days }}</td>
+                            <td>{{ price.productStandardPrice }}</td>
+                            <td>{{ price.created_at }}</td>
+                        </tr>
+                    {% endfor %}
+                </table>
+            </td>
+        </tr>
+    </table>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+
+    <script>
+        const ctx = document.getElementById('price');
+
+        new Chart(ctx, {
+            type: 'line',
+            data: {
+                labels: ['{{ price_dates|raw }}'],
+                datasets: [{
+                    label: 'Price (PLN)',
+                    data: [{{ price_list }}],
+                    borderWidth: 1
+                }]
+            },
+            options: {
+                animation: false,
+                plugins: {
+                    title: {
+                        display: true,
+                        text: 'Price in time'
+                    },
+                },
+                scales: {
+                    x: {
+                        title: {
+                            display: true,
+                            text: 'Date'
+                        }
+                    },
+                    y: {
+                        beginAtZero: true,
+                        title: {
+                            display: true,
+                            text: 'Price'
+                        }
+                    }
+                }
+            }
+        });
+    </script>
+{% endblock %}
+