agentflow-dashboard 0.3.0 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -710,6 +710,203 @@
710
710
  margin-right: 0.4rem;
711
711
  }
712
712
 
713
+ /* Enhanced Process Health */
714
+ .ph-section {
715
+ margin-bottom: 1rem;
716
+ }
717
+ .process-grid {
718
+ display: grid;
719
+ grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
720
+ gap: 0.4rem;
721
+ margin-top: 0.5rem;
722
+ }
723
+
724
+ /* Worker cards */
725
+ .worker-card {
726
+ background: var(--bg-tertiary);
727
+ border-radius: 4px;
728
+ padding: 0.5rem;
729
+ border-left: 3px solid var(--border-color);
730
+ }
731
+ .worker-card.ok { border-left-color: var(--accent-success); }
732
+ .worker-card.warn { border-left-color: var(--accent-warning); }
733
+ .worker-card.bad { border-left-color: var(--accent-error); }
734
+ .worker-name {
735
+ font-weight: 600;
736
+ font-size: 0.75rem;
737
+ margin-bottom: 0.25rem;
738
+ }
739
+ .worker-details {
740
+ display: flex;
741
+ flex-direction: column;
742
+ gap: 0.1rem;
743
+ font-size: 0.65rem;
744
+ color: var(--text-secondary);
745
+ }
746
+
747
+ /* Service cards */
748
+ .service-card, .infra-card {
749
+ background: var(--bg-tertiary);
750
+ border-radius: 4px;
751
+ padding: 0.5rem;
752
+ border-left: 3px solid var(--border-color);
753
+ }
754
+ .service-card.low, .infra-card.low { border-left-color: var(--accent-success); }
755
+ .service-card.medium, .infra-card.medium { border-left-color: var(--accent-warning); }
756
+ .service-card.high, .infra-card.high { border-left-color: var(--accent-error); }
757
+ .service-name, .infra-name {
758
+ font-weight: 600;
759
+ font-size: 0.75rem;
760
+ margin-bottom: 0.25rem;
761
+ }
762
+ .service-details, .infra-details {
763
+ display: grid;
764
+ grid-template-columns: 1fr 1fr;
765
+ gap: 0.1rem 0.5rem;
766
+ font-size: 0.65rem;
767
+ color: var(--text-secondary);
768
+ }
769
+
770
+ /* Process Tree View */
771
+ .process-tree {
772
+ margin-top: 0.5rem;
773
+ font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
774
+ }
775
+ .process-node {
776
+ display: flex;
777
+ align-items: center;
778
+ padding: 0.3rem 0.5rem;
779
+ margin-bottom: 0.2rem;
780
+ background: var(--bg-tertiary);
781
+ border-radius: 4px;
782
+ border-left: 3px solid var(--border-color);
783
+ transition: all 0.2s ease;
784
+ }
785
+ .process-node:hover {
786
+ background: var(--bg-secondary);
787
+ }
788
+ .process-node.agent-node.low { border-left-color: var(--accent-success); }
789
+ .process-node.agent-node.medium { border-left-color: var(--accent-warning); }
790
+ .process-node.agent-node.high { border-left-color: var(--accent-error); }
791
+ .process-node.infrastructure-node.low { border-left-color: var(--accent-success); }
792
+ .process-node.infrastructure-node.medium { border-left-color: var(--accent-warning); }
793
+ .process-node.infrastructure-node.high { border-left-color: var(--accent-error); }
794
+
795
+ .tree-connector {
796
+ color: var(--text-secondary);
797
+ font-weight: 400;
798
+ margin-right: 0.3rem;
799
+ }
800
+ .process-main {
801
+ display: flex;
802
+ align-items: center;
803
+ justify-content: space-between;
804
+ width: 100%;
805
+ min-height: 1.5rem;
806
+ }
807
+ .process-name {
808
+ font-weight: 600;
809
+ font-size: 0.75rem;
810
+ color: var(--text-primary);
811
+ flex: 1;
812
+ }
813
+ .process-metrics {
814
+ display: flex;
815
+ gap: 0.4rem;
816
+ align-items: center;
817
+ }
818
+ .pid-badge, .cpu-badge, .mem-badge, .time-badge {
819
+ font-size: 0.65rem;
820
+ padding: 0.1rem 0.3rem;
821
+ border-radius: 3px;
822
+ font-family: monospace;
823
+ }
824
+ .pid-badge {
825
+ background: var(--accent-primary);
826
+ color: var(--bg-primary);
827
+ font-weight: 600;
828
+ }
829
+ .cpu-badge {
830
+ background: var(--bg-primary);
831
+ color: var(--accent-warning);
832
+ border: 1px solid var(--border-color);
833
+ }
834
+ .mem-badge {
835
+ background: var(--bg-primary);
836
+ color: var(--accent-primary);
837
+ border: 1px solid var(--border-color);
838
+ }
839
+ .time-badge {
840
+ background: var(--bg-primary);
841
+ color: var(--text-secondary);
842
+ border: 1px solid var(--border-color);
843
+ }
844
+
845
+ /* Activity Tags */
846
+ .activity-tag {
847
+ font-size: 0.6rem;
848
+ padding: 0.1rem 0.3rem;
849
+ border-radius: 2px;
850
+ margin-left: 0.3rem;
851
+ font-weight: 600;
852
+ text-transform: uppercase;
853
+ }
854
+ .tag-main { background: var(--accent-primary); color: var(--bg-primary); }
855
+ .tag-agents { background: var(--accent-success); color: var(--bg-primary); }
856
+ .tag-browser { background: var(--accent-warning); color: var(--bg-primary); }
857
+ .tag-context { background: #bc8cff; color: var(--bg-primary); }
858
+ .tag-exec { background: #f0883e; color: var(--bg-primary); }
859
+ .tag-read { background: #58a6ff; color: var(--bg-primary); }
860
+ .tag-tool { background: #da3633; color: var(--bg-primary); }
861
+ .tag-think { background: #bc8cff; color: var(--bg-primary); }
862
+ .tag-user { background: #3fb950; color: var(--bg-primary); }
863
+ .tag-write { background: #f0883e; color: var(--bg-primary); }
864
+ .tag-other { background: var(--text-secondary); color: var(--bg-primary); }
865
+
866
+ /* Enhanced orphans */
867
+ .orphan-list {
868
+ margin-top: 0.5rem;
869
+ }
870
+ .orphan-row {
871
+ display: flex;
872
+ gap: 0.5rem;
873
+ padding: 0.25rem;
874
+ background: var(--bg-tertiary);
875
+ border-radius: 3px;
876
+ margin-bottom: 0.25rem;
877
+ font-size: 0.7rem;
878
+ }
879
+ .orphan-pid {
880
+ min-width: 60px;
881
+ font-family: monospace;
882
+ color: var(--accent-primary);
883
+ }
884
+ .orphan-resources {
885
+ min-width: 120px;
886
+ color: var(--text-secondary);
887
+ }
888
+ .orphan-cmd {
889
+ flex: 1;
890
+ color: var(--text-primary);
891
+ overflow: hidden;
892
+ text-overflow: ellipsis;
893
+ }
894
+
895
+ /* Enhanced problems */
896
+ .problems-section {
897
+ border-top: 1px solid var(--border-color);
898
+ padding-top: 0.5rem;
899
+ }
900
+ .problem-item {
901
+ background: rgba(218, 54, 51, 0.1);
902
+ border: 1px solid rgba(218, 54, 51, 0.3);
903
+ border-radius: 3px;
904
+ padding: 0.4rem;
905
+ margin-bottom: 0.25rem;
906
+ font-size: 0.7rem;
907
+ color: var(--accent-error);
908
+ }
909
+
713
910
  /* Error Heatmap */
714
911
  .heatmap-container {
715
912
  padding: 1rem;
@@ -984,6 +1181,23 @@
984
1181
  <option value="running">Running</option>
985
1182
  </select>
986
1183
  </div>
1184
+ <div class="filter-group">
1185
+ <label>Activity</label>
1186
+ <select id="activityFilter">
1187
+ <option value="all">All</option>
1188
+ <option value="main">Main</option>
1189
+ <option value="agents">Agents</option>
1190
+ <option value="browser">Browser</option>
1191
+ <option value="context">Context</option>
1192
+ <option value="exec">Exec</option>
1193
+ <option value="read">Read</option>
1194
+ <option value="tool">Tool</option>
1195
+ <option value="think">Think</option>
1196
+ <option value="user">User</option>
1197
+ <option value="write">Write</option>
1198
+ <option value="other">Other</option>
1199
+ </select>
1200
+ </div>
987
1201
  </div>
988
1202
  </div>
989
1203
  <div class="trace-list" id="traceList"></div>