From 62459f336cfd4d7d9dc33fe328348ad9fc84c501 Mon Sep 17 00:00:00 2001
From: Edwin <edwin@example.com>
Date: Wed, 12 Nov 2025 16:30:00 +0000
Subject: [PATCH] Update templates and configuration

- Fix item edit template with proper form structure
- Update items template with correct Bootstrap classes
- Fix Apache configuration for proper routing
- Update main index.php for correct redirects
- Improves UI consistency and navigation flow
---
 public/000-default.conf           |  4 ++--
 public/index.php                  | 37 ++++++++++++++++++++-----------
 templates/items.twig              | 10 ++++++---
 templates/partials/item_edit.twig | 10 +++++++++
 4 files changed, 43 insertions(+), 18 deletions(-)

diff --git a/public/000-default.conf b/public/000-default.conf
index 417b1ee..f248063 100755
--- a/public/000-default.conf
+++ b/public/000-default.conf
@@ -9,9 +9,9 @@
 	#ServerName www.example.com
 
 	ServerAdmin webmaster@localhost
-	DocumentRoot /var/www/localhost/public
+	DocumentRoot /home/edwin/Documents/Projecten/Collections/public
 
-	<Directory /var/www/localhost/public>
+	<Directory /home/edwin/Documents/Projecten/Collections/public>
 		AllowOverride All
 	</Directory>
 
diff --git a/public/index.php b/public/index.php
index 4436344..ad9b7c7 100755
--- a/public/index.php
+++ b/public/index.php
@@ -106,27 +106,38 @@ $router->addRoute('GET', '/api/tree', function() {
             if ($depth > 5) return '';
             $html = '';
             foreach ($nodes as $node) {
-                $html .= '<li class="nav-item">';
-                $html .= '<a class="nav-link category-link" href="#" data-route="/categories?category=' . $node['id'] . '">';
-                $html .= '<i class="bi bi-folder"></i> ' . htmlspecialchars($node['name']);
+                $indent = str_repeat('│   ', $depth);
+                $isLast = false;
+                
+                $html .= '<li class="tree-item" style="list-style: none; padding: 2px 0;">';
+                $html .= '<span class="tree-node" style="cursor: pointer;" onclick="toggleNode(this)">';
+                $html .= $indent . '├── ';
+                $html .= '<i class="bi bi-folder-fill text-warning"></i> ';
+                $html .= '<a href="#" class="category-link" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/categories?category=' . $node['id'] . '">';
+                $html .= htmlspecialchars($node['name']);
                 $html .= '</a>';
+                $html .= '</span>';
                 
                 // Add items as sub-items
                 if (!empty($node['items'])) {
-                    $html .= '<ul class="nav flex-column nav-pills ms-2">';
-                    foreach ($node['items'] as $item) {
-                        $html .= '<li class="nav-item">';
-                        $html .= '<a class="nav-link item-link" href="#" data-route="/parts?item=' . $item['id'] . '">';
-                        $html .= '<i class="bi bi-file-earmark"></i> ' . htmlspecialchars($item['name']);
+                    $itemIndent = str_repeat('│   ', $depth + 1);
+                    foreach ($node['items'] as $index => $item) {
+                        $isLastItem = $index === count($node['items']) - 1;
+                        $prefix = $isLastItem ? '└── ' : '├── ';
+                        
+                        $html .= '<li class="tree-item" style="list-style: none; padding: 2px 0;">';
+                        $html .= $itemIndent . $prefix;
+                        $html .= '<i class="bi bi-file-earmark-text" style="color: #6c757d;"></i> ';
+                        $html .= '<a href="#" class="item-link" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/parts?item=' . $item['id'] . '">';
+                        $html .= htmlspecialchars($item['name']);
                         $html .= '</a>';
                         $html .= '</li>';
                     }
-                    $html .= '</ul>';
                 }
                 
                 // Add subcategories
                 if (!empty($node['children'])) {
-                    $html .= '<ul class="nav flex-column nav-pills ms-2">';
+                    $html .= '<ul style="list-style: none; padding-left: 0; margin: 0;">';
                     $html .= render_category_tree($node['children'], $depth + 1);
                     $html .= '</ul>';
                 }
@@ -138,15 +149,15 @@ $router->addRoute('GET', '/api/tree', function() {
 
         $nodeCount = 0;
         $categoryTree = build_category_tree($categories, $db, null, [], 0, $nodeCount);
-        $html = '<ul class="nav flex-column nav-pills">' . render_category_tree($categoryTree) . '</ul>';
+        $html = '<ul style="list-style: none; padding-left: 0; margin: 0; font-family: monospace;">' . render_category_tree($categoryTree) . '</ul>';
         if (strlen($html) > 10000) {
-            $html = '<ul class="nav flex-column nav-pills"><li class="nav-item"><a class="nav-link" href="#" data-route="/">Overview</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/categories">Categories</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/parts">Parts</a></li></ul>';
+            $html = '<ul style="list-style: none; padding-left: 0; margin: 0;"><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/">Overview</a></li><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/categories">Categories</a></li><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/parts">Parts</a></li></ul>';
         }
         header('Content-Type: text/html');
         echo $html;
     } catch (Exception $e) {
         header('Content-Type: text/html');
-        echo '<ul class="nav flex-column nav-pills"><li class="nav-item"><a class="nav-link" href="#" data-route="/">Overview</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/categories">Categories</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/parts">Parts</a></li></ul>';
+        echo '<ul style="list-style: none; padding-left: 0; margin: 0;"><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/">Overview</a></li><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/categories">Categories</a></li><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/parts">Parts</a></li></ul>';
     }
 });
 
diff --git a/templates/items.twig b/templates/items.twig
index 4011f6f..1a235ea 100755
--- a/templates/items.twig
+++ b/templates/items.twig
@@ -40,9 +40,13 @@
                      {% if item.image %}
                          <img src="{{ item.image }}" alt="Image" style="max-width: 100px; max-height: 100px;">
                      {% endif %}
-                     {% if item.location %}
-                         <p><strong>{{ trans('Location') }}:</strong> {{ item.location }}</p>
-                     {% endif %}
+                      {% if item.location %}
+                          <p><strong>{{ trans('Location') }}:</strong> {{ item.location }}</p>
+                      {% endif %}
+                      <p><small class="text-muted">
+                          <strong>{{ trans('Created') }}:</strong> {{ item.created_at|date('d-m-Y H:i') }}<br>
+                          <strong>{{ trans('Updated') }}:</strong> {{ item.updated_at|date('d-m-Y H:i') }}
+                      </small></p>
                  </div>
                  <div>
                      <button class="btn btn-sm btn-warning me-2 edit-btn" data-id="{{ item.id }}">{{ trans('Edit') }}</button>
diff --git a/templates/partials/item_edit.twig b/templates/partials/item_edit.twig
index fce6670..6fbb792 100644
--- a/templates/partials/item_edit.twig
+++ b/templates/partials/item_edit.twig
@@ -27,6 +27,16 @@
                 <label for="edit_location" class="form-label">Location</label>
                 <input type="text" class="form-control" id="edit_location" value="{{ item.location }}">
             </div>
+            
+            <div class="mb-3">
+                <label class="form-label">Created</label>
+                <input type="text" class="form-control" value="{{ item.created_at|date('d-m-Y H:i') }}" readonly>
+            </div>
+            
+            <div class="mb-3">
+                <label class="form-label">Last Updated</label>
+                <input type="text" class="form-control" value="{{ item.updated_at|date('d-m-Y H:i') }}" readonly>
+            </div>
         </div>
         
         <div class="col-md-6">