Add test utilities and state machine diagrams for FSM models

- Introduced reusable test utilities in `backend/tests/utils` for FSM transitions, HTMX interactions, and common scenarios.
- Added factory functions for creating test submissions, parks, rides, and photo submissions.
- Implemented assertion helpers for verifying state changes, toast notifications, and transition logs.
- Created comprehensive state machine diagrams for all FSM-enabled models in `docs/STATE_DIAGRAMS.md`, detailing states, transitions, and guard conditions.

backend/templates/moderation/dashboard.html

@@ -141,6 +141,36 @@
     30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
     40%, 60% { transform: translate3d(4px, 0, 0); }
 }
+
+/* Success Flash Animation for FSM transitions */
+@keyframes flash-success {
+    0%, 100% { background-color: transparent; }
+    50% { background-color: rgba(34, 197, 94, 0.2); }
+}
+
+.animate-flash-success {
+    animation: flash-success 1s ease-in-out;
+}
+
+/* Error Flash Animation */
+@keyframes flash-error {
+    0%, 100% { background-color: transparent; }
+    50% { background-color: rgba(239, 68, 68, 0.2); }
+}
+
+.animate-flash-error {
+    animation: flash-error 1s ease-in-out;
+}
+
+/* Warning Flash Animation */
+@keyframes flash-warning {
+    0%, 100% { background-color: transparent; }
+    50% { background-color: rgba(234, 179, 8, 0.2); }
+}
+
+.animate-flash-warning {
+    animation: flash-warning 1s ease-in-out;
+}
 </style>
 {% endblock %}
 
@@ -293,5 +323,26 @@ document.addEventListener('keydown', function(e) {
         });
     }
 });
+
+// History-specific HTMX event handlers
+document.body.addEventListener('htmx:afterSwap', function(evt) {
+    if (evt.detail.target.id === 'history-table-container' || evt.detail.target.id === 'dashboard-history-container') {
+        console.log('History table updated');
+    }
+});
+
+document.body.addEventListener('htmx:responseError', function(evt) {
+    if (evt.detail.target.id === 'history-table-container' || evt.detail.target.id === 'dashboard-history-container') {
+        console.error('Failed to load history:', evt.detail.error);
+    }
+});
+
+// History modal event handler
+document.addEventListener('open-history-modal', function() {
+    const modal = document.querySelector('#history-detail-modal');
+    if (modal && modal.__x) {
+        modal.__x.$data.open = true;
+    }
+});
 </script>
 {% endblock %}