reworked dashboard

templates/components/contact_status.html

@@ -0,0 +1,28 @@
+{% macro contact_status(active_count, inactive_count) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2"></i>Contact Status</h5>
+        <div>
+          <a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-primary btn-sm me-2">View All</a>
+          <a href="{{ url_for('contacts.new_contact') }}" class="btn btn-primary btn-sm">+ Add</a>
+        </div>
+      </div>
+      <div class="chart-container">
+        <canvas id="statusChart"></canvas>
+      </div>
+      <div class="d-flex justify-content-center gap-4 mt-3">
+        <div class="text-center">
+          <div class="fw-bold text-primary" style="font-size:1.5rem;">{{ active_count }}</div>
+          <div class="text-muted small">Active</div>
+        </div>
+        <div class="text-center">
+          <div class="fw-bold" style="color:var(--secondary-color); font-size:1.5rem;">{{ inactive_count }}</div>
+          <div class="text-muted small">Inactive</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/contacts.html

@@ -0,0 +1,38 @@
+{% macro contacts(recent_contacts) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-address-book me-2"></i>Recent Contacts</h5>
+        <div>
+          <a href="{{ url_for('contacts.contacts_list') }}" class="btn btn-primary btn-sm me-2">View All</a>
+          <a href="{{ url_for('contacts.new_contact') }}" class="btn btn-primary btn-sm">+ Add</a>
+        </div>
+      </div>
+      {% if recent_contacts %}
+      <ul class="list-unstyled mb-3">
+        {% for contact in recent_contacts %}
+        <li class="mb-2">
+          <div class="fw-semibold">{{ contact.first_name }} {{ contact.last_name }}</div>
+          <div class="flex flex-wrap gap-2 mt-1">
+            <a href="mailto:{{ contact.email }}"
+               class="contact-link inline-flex items-center px-2 py-0.5 rounded text-sm font-normal">
+              <i class="fas fa-envelope mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.email }}
+            </a>
+            {% if contact.phone %}
+            <a href="tel:{{ contact.phone }}"
+               class="contact-link inline-flex items-center px-2 py-0.5 rounded text-sm font-normal">
+              <i class="fas fa-phone mr-1" style="font-size: 0.85em; opacity: 0.7;"></i>{{ contact.phone }}
+            </a>
+            {% endif %}
+          </div>
+        </li>
+        {% endfor %}
+      </ul>
+      {% else %}
+      <div class="text-muted small">No contacts yet.</div>
+      {% endif %}
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/recent_activity.html

@@ -0,0 +1,59 @@
+{% macro recent_activity(activities) %}
+<div class="masonry-card">
+  <div class="card h-100">
+    <div class="card-header bg-white border-0">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-history me-2"></i>Recent Activity</h5>
+        <a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">View All</a>
+      </div>
+    </div>
+    <div class="card-body">
+      <div class="list-group list-group-flush">
+        {% for activity in activities %}
+        <div class="list-group-item">
+          <div class="d-flex align-items-center">
+            <div class="flex-shrink-0">
+              {% if activity.type == 'folder' %}
+              <i class="fas fa-folder me-2 icon-primary"></i>
+              {% else %}
+              <i class="fas fa-file me-2 icon-primary"></i>
+              {% endif %}
+            </div>
+            <div class="flex-grow-1 ms-3">
+              <div class="d-flex justify-content-between align-items-center">
+                <div>
+                  <div class="d-flex align-items-center mb-1">
+                    <h6 class="mb-0">{{ activity.name }}</h6>
+                    {% if activity.is_starred %}
+                    <span class="badge badge-starred ms-2">
+                      <i class="fas fa-star me-1"></i>Starred
+                    </span>
+                    {% endif %}
+                    {% if activity.is_deleted %}
+                    <span class="badge badge-trash ms-2">
+                      <i class="fas fa-trash me-1"></i>Trash
+                    </span>
+                    {% endif %}
+                  </div>
+                  <small class="text-muted">
+                    {{ activity.room.name }} • 
+                    {{ activity.uploader.username }} {{ activity.uploader.last_name }} • 
+                    {% if activity.uploaded_at %}{{ activity.uploaded_at|timeago }}{% else %}Unknown{% endif %}
+                  </small>
+                </div>
+                {% if activity.type == 'file' and activity.can_download %}
+                <a href="{{ url_for('room_files.download_room_file', room_id=activity.room.id, filename=activity.name, path=activity.path) }}"
+                   class="btn btn-download btn-sm ms-2" title="Download">
+                  <i class="fas fa-download"></i>
+                </a>
+                {% endif %}
+              </div>
+            </div>
+          </div>
+        </div>
+        {% endfor %}
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/starred_files.html

@@ -0,0 +1,25 @@
+{% macro starred_files(starred_count, file_count) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-star me-2"></i>Starred Files</h5>
+        <a href="{{ url_for('main.starred') }}" class="btn btn-primary btn-sm">View All</a>
+      </div>
+      <div class="chart-container">
+        <canvas id="starredChart"></canvas>
+      </div>
+      <div class="d-flex justify-content-center gap-4 mt-3">
+        <div class="text-center">
+          <div class="fw-bold icon-warning" style="font-size:1.5rem;">{{ starred_count }}</div>
+          <div class="text-muted small">Starred</div>
+        </div>
+        <div class="text-center">
+          <div class="fw-bold text-primary" style="font-size:1.5rem;">{{ file_count - starred_count }}</div>
+          <div class="text-muted small">Unstarred</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/storage_overview.html

@@ -0,0 +1,44 @@
+{% from 'macros.html' import format_size %}
+
+{% macro storage_overview(room_count, file_count, folder_count, total_size) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-database me-2"></i>Storage Overview</h5>
+        <a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">Browse</a>
+      </div>
+      <div class="d-flex flex-column">
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-door-open me-2 icon-primary"></i>
+            <span class="text-muted">Rooms:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ room_count }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-file me-2 icon-primary"></i>
+            <span class="text-muted">Files:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ file_count }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-folder me-2 icon-primary"></i>
+            <span class="text-muted">Folders:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ folder_count }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-hdd me-2 icon-primary"></i>
+            <span class="text-muted">Total Size:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ format_size(total_size) }}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/storage_usage.html

@@ -0,0 +1,32 @@
+{% from 'macros.html' import format_size %}
+
+{% macro storage_usage(storage_by_type) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-chart-pie me-2"></i>Storage Usage</h5>
+        <a href="{{ url_for('rooms.rooms') }}" class="btn btn-primary btn-sm">View Details</a>
+      </div>
+      {% if storage_by_type %}
+      <div class="chart-container">
+        <canvas id="storageChart"></canvas>
+      </div>
+      <div class="mt-3">
+        {% for type in storage_by_type %}
+        <div class="d-flex justify-content-between align-items-center mb-2">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-file me-2 icon-primary"></i>
+            <span class="text-muted">{{ type.extension|upper }}:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ format_size(type.total_size) }}</div>
+        </div>
+        {% endfor %}
+      </div>
+      {% else %}
+      <div class="text-muted small">No storage data available</div>
+      {% endif %}
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/trash.html

@@ -0,0 +1,53 @@
+{% from 'macros.html' import format_size %}
+
+{% macro trash(trash_count, pending_deletion, oldest_trash_date, trash_size) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-trash me-2"></i>Trash</h5>
+        <a href="{{ url_for('main.trash') }}" class="btn btn-primary btn-sm">View All</a>
+      </div>
+      <div class="d-flex flex-column">
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-file me-2 icon-primary"></i>
+            <span class="text-muted">Files in trash:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ trash_count }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-exclamation-triangle me-2 icon-danger"></i>
+            <span class="text-muted">Deleting in 7 days:</span>
+          </div>
+          <div class="fw-bold text-danger">{{ pending_deletion }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-clock me-2 icon-primary"></i>
+            <span class="text-muted">Oldest deletion:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ oldest_trash_date|default('N/A') }}</div>
+        </div>
+        <div class="d-flex justify-content-between align-items-center mb-3">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-hdd me-2 icon-primary"></i>
+            <span class="text-muted">Storage used:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ format_size(trash_size) }}</div>
+        </div>
+        <div class="alert alert-info mb-0">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-info-circle me-2"></i>
+            <div>
+              <div class="fw-bold mb-1">Files will be permanently deleted after 30 days</div>
+              <div class="small">You can restore files before they are permanently deleted</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %} 

templates/components/trash_type.html

@@ -0,0 +1,30 @@
+{% macro trash_type(trash_by_type) %}
+<div class="masonry-card">
+  <div class="card shadow-sm">
+    <div class="card-body">
+      <div class="d-flex justify-content-between align-items-center mb-3">
+        <h5 class="card-title mb-0"><i class="fas fa-file-alt me-2"></i>Trash by Type</h5>
+        <a href="{{ url_for('main.trash') }}" class="btn btn-primary btn-sm">View All</a>
+      </div>
+      {% if trash_by_type %}
+      <div class="chart-container">
+        <canvas id="trashTypeChart"></canvas>
+      </div>
+      <div class="mt-3">
+        {% for type in trash_by_type %}
+        <div class="d-flex justify-content-between align-items-center mb-2">
+          <div class="d-flex align-items-center">
+            <i class="fas fa-file me-2 icon-primary"></i>
+            <span class="text-muted">{{ type.extension|upper }}:</span>
+          </div>
+          <div class="fw-bold text-primary">{{ type.count }}</div>
+        </div>
+        {% endfor %}
+      </div>
+      {% else %}
+      <div class="text-muted small">No files in trash</div>
+      {% endif %}
+    </div>
+  </div>
+</div>
+{% endmacro %}