Add automation routes and enhance header metrics management

- Introduced new routes for Automation Rules and Automation Tasks in the frontend.
- Updated the AppSidebar to include sub-items for Automation navigation.
- Enhanced HeaderMetricsContext to manage credit and page metrics more effectively, ensuring proper merging and clearing of metrics.
- Adjusted AppLayout and TablePageTemplate to maintain credit balance while managing page metrics.

frontend/src/layout/AppLayout.tsx

@@ -224,8 +224,10 @@ const LayoutContent: React.FC = () => {
   }, [isAuthenticated, balance, loadBalance, setMetrics]);
 
   // Update header metrics when balance changes
+  // This sets credit balance which will be merged with page metrics by HeaderMetricsContext
   useEffect(() => {
     if (!isAuthenticated || !balance) {
+      // Clear credit balance but keep page metrics
       setMetrics([]);
       return;
     }
@@ -242,6 +244,7 @@ const LayoutContent: React.FC = () => {
       accentColor = 'purple';
     }
     
+    // Set credit balance (single metric with label "Credits" - HeaderMetricsContext will merge it)
     setMetrics([{
       label: 'Credits',
       value: balance.credits,