django-cfg 1.3.13__py3-none-any.whl → 1.4.3__py3-none-any.whl

django_cfg/templates/admin/components/progress_bar.html

@@ -1,25 +1,20 @@
+{#
+    ⚠️ DEPRECATED: This component is deprecated.
+
+    Use Unfold's built-in progress component instead:
+    {% component "unfold/components/progress.html" with value=... title=... description=... %}
+    {% endcomponent %}
+
+    This wrapper will be removed in a future version.
+    For now it redirects to the Unfold component for backwards compatibility.
+#}
+
 {% load unfold %}
 
-<!-- Progress Bar Component -->
-<div class="w-full">
-    {% if title %}
-    <div class="flex items-center justify-between mb-2">
-        <span class="text-sm font-medium text-font-default-light dark:text-font-default-dark">{{ title }}</span>
-        <span class="text-sm text-font-subtle-light dark:text-font-subtle-dark">{{ value }}%</span>
-    </div>
-    {% endif %}
-    
-    <div class="w-full bg-base-200 dark:bg-base-700 rounded-full h-2">
-        <div class="h-2 rounded-full transition-all duration-300
-            {% if value >= 80 %}bg-green-500
-            {% elif value >= 60 %}bg-amber-500
-            {% elif value >= 40 %}bg-orange-500
-            {% else %}bg-red-500{% endif %}"
-            style="width: {{ value|default:0 }}%">
-        </div>
-    </div>
-    
-    {% if description %}
-    <p class="text-xs text-font-subtle-light dark:text-font-subtle-dark mt-1">{{ description }}</p>
-    {% endif %}
-</div>
+<!-- Wrapper for backwards compatibility - redirects to Unfold component -->
+{% component "unfold/components/progress.html" with
+    value=value
+    title=title
+    description=description
+    class=class %}
+{% endcomponent %}

django_cfg/templates/admin/examples/component_class_example.html

@@ -0,0 +1,156 @@
+{% load unfold %}
+
+<!--
+    Component Class Example Template
+
+    This demonstrates using Unfold's Component Class system with @register_component.
+    This is an ALTERNATIVE approach to the section-based architecture.
+
+    Benefits:
+    - Templates specify which component to use
+    - Components handle their own data fetching
+    - More self-contained and reusable
+
+    Usage:
+    - Add to UNFOLD settings: custom page or tab
+    - Components automatically fetch data when rendered
+-->
+
+<div class="space-y-8">
+    <!-- System Metrics using Component Class -->
+    <div>
+        <h2 class="text-xl font-semibold mb-4">System Metrics (Component Class)</h2>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+            <!-- Database Metric -->
+            {% component "unfold/components/card.html" with title="Database" component_class="SystemMetricsComponent" %}
+                {% if data.database %}
+                    {% component "unfold/components/progress.html" with
+                        value=data.database.value
+                        title=data.database.title
+                        description=data.database.description %}
+                    {% endcomponent %}
+                {% endif %}
+            {% endcomponent %}
+
+            <!-- Cache Metric -->
+            {% component "unfold/components/card.html" with title="Cache" component_class="SystemMetricsComponent" %}
+                {% if data.cache %}
+                    {% component "unfold/components/progress.html" with
+                        value=data.cache.value
+                        title=data.cache.title
+                        description=data.cache.description %}
+                    {% endcomponent %}
+                {% endif %}
+            {% endcomponent %}
+
+            <!-- Storage Metric -->
+            {% component "unfold/components/card.html" with title="Storage" component_class="SystemMetricsComponent" %}
+                {% if data.storage %}
+                    {% component "unfold/components/progress.html" with
+                        value=data.storage.value
+                        title=data.storage.title
+                        description=data.storage.description %}
+                    {% endcomponent %}
+                {% endif %}
+            {% endcomponent %}
+
+            <!-- API Metric -->
+            {% component "unfold/components/card.html" with title="API" component_class="SystemMetricsComponent" %}
+                {% if data.api %}
+                    {% component "unfold/components/progress.html" with
+                        value=data.api.value
+                        title=data.api.title
+                        description=data.api.description %}
+                    {% endcomponent %}
+                {% endif %}
+            {% endcomponent %}
+        </div>
+    </div>
+
+    <!-- Recent Users using Component Class -->
+    <div>
+        <h2 class="text-xl font-semibold mb-4">Recent Users (Component Class)</h2>
+
+        {% component "unfold/components/card.html" with title="Latest Registrations" component_class="RecentUsersComponent" %}
+            {% if data.rows %}
+                {% component "unfold/components/table.html" with
+                    table=data
+                    striped=1
+                    height=400 %}
+                {% endcomponent %}
+            {% else %}
+                <p class="text-font-subtle-light dark:text-font-subtle-dark">No users yet</p>
+            {% endif %}
+        {% endcomponent %}
+    </div>
+
+    <!-- Charts using Component Class -->
+    <div>
+        <h2 class="text-xl font-semibold mb-4">Analytics (Component Class)</h2>
+
+        <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+            <!-- User Registrations Chart -->
+            {% component "unfold/components/card.html" with title="User Registrations" component_class="ChartsComponent" days=7 %}
+                {% if data.registrations %}
+                    {% component "unfold/components/chart/line.html" with
+                        data=data.registrations
+                        height=300 %}
+                    {% endcomponent %}
+                {% else %}
+                    <p class="text-font-subtle-light dark:text-font-subtle-dark">No data available</p>
+                {% endif %}
+            {% endcomponent %}
+
+            <!-- User Activity Chart -->
+            {% component "unfold/components/card.html" with title="User Activity" component_class="ChartsComponent" days=7 %}
+                {% if data.activity %}
+                    {% component "unfold/components/chart/bar.html" with
+                        data=data.activity
+                        height=300 %}
+                    {% endcomponent %}
+                {% else %}
+                    <p class="text-font-subtle-light dark:text-font-subtle-dark">No data available</p>
+                {% endif %}
+            {% endcomponent %}
+        </div>
+    </div>
+
+    <!-- Activity Tracker using Component Class -->
+    <div>
+        <h2 class="text-xl font-semibold mb-4">Activity Tracker (Component Class)</h2>
+
+        {% component "unfold/components/card.html" with title="365 Day Heatmap" component_class="ActivityTrackerComponent" %}
+            {% if data %}
+                {% component "unfold/components/tracker.html" with data=data %}
+                {% endcomponent %}
+            {% else %}
+                <p class="text-font-subtle-light dark:text-font-subtle-dark">No activity data</p>
+            {% endif %}
+        {% endcomponent %}
+    </div>
+</div>
+
+<!--
+    How Component Classes Work:
+
+    1. Template specifies: component_class="SystemMetricsComponent"
+    2. Unfold finds registered component by name
+    3. Component's get_context_data() is called
+    4. Data is fetched and returned
+    5. Template receives data and renders
+
+    Comparison with Section-Based Approach:
+
+    Section-Based (current):
+    - Section class prepares all data
+    - Template receives pre-processed data
+    - Single render call for entire section
+
+    Component Classes:
+    - Each component fetches its own data
+    - More granular, reusable components
+    - Multiple component renders per page
+
+    Both approaches are valid - choose based on needs!
+-->

django_cfg/templates/admin/index.html

@@ -3,42 +3,70 @@
 {% load unfold %}
 
 {% block overview_tab %}
-    {% include 'admin/snippets/tabs/overview_tab.html' %}
+    {% if overview_section %}
+        {{ overview_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/tabs/overview_tab.html' %}
+    {% endif %}
 {% endblock %}
 
 {% block zones_tab %}
-    {% include 'admin/snippets/zones/zones_table.html' %}
+    {% if zones_section %}
+        {{ zones_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/zones/zones_table.html' %}
+    {% endif %}
 {% endblock %}
 
 {% block users_tab %}
-    {% include 'admin/snippets/tabs/users_tab.html' %}
+    {% if users_section %}
+        {{ users_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/tabs/users_tab.html' %}
+    {% endif %}
 {% endblock %}
 
 {% block system_tab %}
-    <div class="space-y-8">
-        <h2 class="text-xl font-semibold text-font-important-light dark:text-font-important-dark mb-4">
-            System Management
-        </h2>
-        
-        <!-- System Health -->
-        {% include 'admin/snippets/components/system_health.html' %}
-        
-        <!-- System Metrics -->
-        {% include 'admin/snippets/components/system_metrics.html' %}
-        
-        <!-- Activity Tracker -->
-        {% include 'admin/snippets/components/activity_tracker.html' %}
-    </div>
+    {% if system_section %}
+        {{ system_section|safe }}
+    {% else %}
+        <div class="space-y-8">
+            <h2 class="text-xl font-semibold text-font-important-light dark:text-font-important-dark mb-4">
+                System Management
+            </h2>
+
+            <!-- System Health -->
+            {% include 'admin/snippets/components/system_health.html' %}
+
+            <!-- System Metrics -->
+            {% include 'admin/snippets/components/system_metrics.html' %}
+
+            <!-- Activity Tracker -->
+            {% include 'admin/snippets/components/activity_tracker.html' %}
+        </div>
+    {% endif %}
 {% endblock %}
 
 {% block stats_tab %}
-    {% include 'admin/snippets/tabs/stats_tab.html' %}
+    {% if stats_section %}
+        {{ stats_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/tabs/stats_tab.html' %}
+    {% endif %}
 {% endblock %}
 
 {% block app_stats_tab %}
-    {% include 'admin/snippets/tabs/app_stats_tab.html' with stats_groups=stats_groups %}
+    {% if app_stats_section %}
+        {{ app_stats_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/tabs/app_stats_tab.html' with stats_groups=stats_groups %}
+    {% endif %}
 {% endblock %}
 
 {% block commands_tab %}
-    {% include 'admin/snippets/tabs/commands_tab.html' %}
+    {% if commands_section %}
+        {{ commands_section|safe }}
+    {% else %}
+        {% include 'admin/snippets/tabs/commands_tab.html' %}
+    {% endif %}
 {% endblock %} 

django_cfg/templates/admin/index_new.html

@@ -0,0 +1,106 @@
+{% extends 'admin/layouts/base_dashboard.html' %}
+
+{% load unfold %}
+
+{% block tabs %}
+    <button type="button" data-tab="0" class="px-4 py-3 rounded-t-lg focus:outline-none font-semibold active">
+        <span class="material-icons mr-2 align-middle text-sm">dashboard</span>
+        Overview
+    </button>
+    <button type="button" data-tab="1" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">public</span>
+        API Zones
+    </button>
+    <button type="button" data-tab="2" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">people</span>
+        Users
+    </button>
+    <button type="button" data-tab="3" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">settings</span>
+        System
+    </button>
+    <button type="button" data-tab="4" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">analytics</span>
+        Statistics
+    </button>
+    <button type="button" data-tab="5" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">apps</span>
+        App Stats
+    </button>
+    <button type="button" data-tab="6" class="px-4 py-3 rounded-t-lg focus:outline-none">
+        <span class="material-icons mr-2 align-middle text-sm">terminal</span>
+        Commands
+    </button>
+{% endblock %}
+
+{% block tab_content %}
+    <!-- Overview Tab -->
+    <div class="tab-content active" data-tab="0">
+        {% if overview_section %}
+            {{ overview_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/tabs/overview_tab.html' %}
+        {% endif %}
+    </div>
+
+    <!-- Zones Tab -->
+    <div class="tab-content" data-tab="1">
+        {% if zones_section %}
+            {{ zones_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/zones/zones_table.html' %}
+        {% endif %}
+    </div>
+
+    <!-- Users Tab -->
+    <div class="tab-content" data-tab="2">
+        {% if users_section %}
+            {{ users_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/tabs/users_tab.html' %}
+        {% endif %}
+    </div>
+
+    <!-- System Tab -->
+    <div class="tab-content" data-tab="3">
+        {% if system_section %}
+            {{ system_section|safe }}
+        {% else %}
+            <div class="space-y-8">
+                <h2 class="text-xl font-semibold text-font-important-light dark:text-font-important-dark mb-4">
+                    System Management
+                </h2>
+                {% include 'admin/snippets/components/system_health.html' %}
+                {% include 'admin/snippets/components/system_metrics.html' %}
+                {% include 'admin/snippets/components/activity_tracker.html' %}
+            </div>
+        {% endif %}
+    </div>
+
+    <!-- Stats Tab -->
+    <div class="tab-content" data-tab="4">
+        {% if stats_section %}
+            {{ stats_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/tabs/stats_tab.html' %}
+        {% endif %}
+    </div>
+
+    <!-- App Stats Tab -->
+    <div class="tab-content" data-tab="5">
+        {% if app_stats_section %}
+            {{ app_stats_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/tabs/app_stats_tab.html' with stats_groups=stats_groups %}
+        {% endif %}
+    </div>
+
+    <!-- Commands Tab -->
+    <div class="tab-content" data-tab="6">
+        {% if commands_section %}
+            {{ commands_section|safe }}
+        {% else %}
+            {% include 'admin/snippets/tabs/commands_tab.html' %}
+        {% endif %}
+    </div>
+{% endblock %}

django_cfg/templates/admin/layouts/base_dashboard.html

@@ -0,0 +1,60 @@
+{% extends 'admin/base.html' %}
+
+{% load static %}
+{% load unfold %}
+
+{% block extrahead %}
+    {{ block.super }}
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <link rel="stylesheet" href="{% static 'admin/css/dashboard.css' %}">
+{% endblock %}
+
+{% block breadcrumbs %}{% endblock %}
+
+{% block title %}
+    {% if subtitle %}{{ subtitle }} | {% endif %}
+    {{ title }} | {{ site_title|default:'Django site admin' }}
+{% endblock %}
+
+{% block branding %}
+    {% include "unfold/helpers/site_branding.html" %}
+{% endblock %}
+
+{% block content %}
+    <!-- Main Container -->
+    {% component "unfold/components/container.html" %}
+        <!-- Tab Navigation -->
+        {% block tab_navigation %}
+            <div class="flex gap-1 mb-6" id="dashboard-tabs">
+                {% block tabs %}{% endblock %}
+            </div>
+        {% endblock %}
+
+        <!-- Tab Content -->
+        <div class="flex flex-col gap-5">
+            {% block tab_content %}{% endblock %}
+        </div>
+
+        <!-- Footer -->
+        {% block dashboard_footer %}
+            <div class="text-center py-8 border-t theme-border mt-5">
+                <p class="text-sm text-gray-500 dark:text-gray-400">
+                    {% load django_cfg %}
+                    <a href="{% lib_site_url %}" class="text-blue-600 hover:text-blue-700 font-medium">
+                        {% lib_name %}
+                    </a>
+                    <span class="mx-2">•</span>
+                    <a href="{% lib_health_url %}" class="text-blue-600 hover:text-blue-700">
+                        System Health
+                    </a>
+                </p>
+            </div>
+        {% endblock %}
+    {% endcomponent %}
+{% endblock %}
+
+{% block footer %}
+    {{ block.super }}
+    <script src="{% static 'admin/js/dashboard.js' %}"></script>
+    <script src="{% static 'admin/js/commands.js' %}"></script>
+{% endblock %}

django_cfg/templates/admin/layouts/dashboard_with_tabs.html

@@ -441,29 +441,10 @@
 {% endblock %}
 
 {% block content %}
-    <!-- Dashboard Header -->
-    <div class="mb-8">
-        <h1 class="text-3xl font-bold text-gray-900 dark:text-white">
-            {{ dashboard_title|default:"Dashboard" }}
-        </h1>
-        <p class="mt-2 text-gray-700 dark:text-gray-300">
-            Welcome to the administration dashboard
-        </p>
-    </div>
-
     <!-- Main Dashboard Container -->
     {% component "unfold/components/container.html" %}
-        <!-- Navigation and Filters Row -->
-        <div class="flex flex-col gap-4 mb-8">
-            {% component "unfold/components/navigation.html" with items=navigation %}
-            {% endcomponent %}
-
-            {% component "unfold/components/navigation.html" with class="ml-auto" items=filters %}
-            {% endcomponent %}
-        </div>
-
         <!-- Tabs Navigation -->
-        <div class="flex gap-1 mb-6" id="dashboard-tabs">
+        <div class="flex gap-1 mb-4" id="dashboard-tabs">
             <button 
                 type="button" 
                 data-tab="0"