@skyhook-io/radar-app 1.16.1 → 1.16.3

package/src/components/settings/LocalConfigurationDetails.tsx

@@ -73,6 +73,13 @@ export function PreviousIntegrationSettingsNotice({ profiles, onNavigate, onDism
 
 export const integrationSettingsByClusterId = 'integration-settings-by-cluster'
 
+// Switching to auto-discovery keeps an empty record, so a record alone doesn't
+// mean anything is saved. An invalid record disables the integration instead.
+function integrationStatus(use: StoredConnection) {
+  if (use.error || use.mode !== 'auto' || use.url || use.secretSet || use.clusterId) return 'saved'
+  return use.integration === 'cost' ? 'Automatic' : 'auto-discovery'
+}
+
 export function LocalConfigurationDetails({ onNavigate }: { onNavigate: (section: SettingsSectionId) => void }) {
   return (
     <div className="mt-5 border-t border-theme-border pt-4">
@@ -168,7 +175,7 @@ export function SavedClusterConnections({
       .then(async (response) => {
         const data = (await response.json().catch(() => ({}))) as ConnectionResponse
         if (!response.ok)
-          throw new Error(data.error || 'Could not load saved connections.')
+          throw new Error(data.error || 'Could not load integration settings.')
         if (controller.signal.aborted || getApiBase() !== base) return
         setUses(data.connections)
       })
@@ -215,10 +222,10 @@ export function SavedClusterConnections({
       const data = (await response.json().catch(() => ({}))) as ConnectionResponse
       if (controller.signal.aborted || getApiBase() !== base) return
       if (!response.ok)
-        throw new Error(data.error || 'Could not remove the saved connection.')
+        throw new Error(data.error || 'Could not remove the saved settings.')
       setUses(data.connections)
       setMessage(
-        `Removed the saved ${integrationNames[selected.integration]} connection for ${selected.context}.`,
+        `Removed the saved ${integrationNames[selected.integration]} settings for ${selected.context}.`,
       )
       focusSummary.current = true
       setSelected(null)
@@ -261,12 +268,12 @@ export function SavedClusterConnections({
         </p>
         {loading && (
           <p role="status" className="text-xs text-theme-text-tertiary">
-            Loading saved connections…
+            Loading integration settings…
           </p>
         )}
         {!loading && !error && clusters.size === 0 && (
           <p className="text-xs text-theme-text-tertiary">
-            No saved connections yet.
+            No integration settings saved yet.
           </p>
         )}
         {!loading &&
@@ -300,17 +307,16 @@ export function SavedClusterConnections({
                 </p>
                 {!current && entry.availability === 'removed' && (
                   <p className="text-theme-text-secondary">
-                    This kubeconfig entry is gone, but its connections are still
-                    saved. To reuse one, select the new context and choose “Copy
+                    This kubeconfig entry is gone, but its integration settings
+                    are still saved. To reuse one, select the new context and choose “Copy
                     settings from…” in that integration’s settings.
                   </p>
                 )}
                 {(current ||
                   entries.every((use) => use.availability === 'available')) && (
                   <p className="text-theme-text-secondary">
-                    Saved:{' '}
                     {entries
-                      .map((use) => integrationNames[use.integration])
+                      .map((use) => `${integrationNames[use.integration]}: ${integrationStatus(use)}`)
                       .join(' · ')}
                   </p>
                 )}
@@ -325,7 +331,7 @@ export function SavedClusterConnections({
                           type="button"
                           disabled={busy}
                           className="text-accent-text hover:underline disabled:opacity-50"
-                          aria-label={`Remove saved ${integrationNames[use.integration]} connection for ${use.context}`}
+                          aria-label={`Remove saved ${integrationNames[use.integration]} settings for ${use.context}`}
                           onClick={() => {
                             setSelected(use)
                             setError('')
@@ -353,7 +359,7 @@ export function SavedClusterConnections({
               className="underline"
               onClick={() => setVersion((value) => value + 1)}
             >
-              Reload saved connections
+              Reload integration settings
             </button>
           </p>
         )}
@@ -362,13 +368,13 @@ export function SavedClusterConnections({
         open={!!selected}
         onClose={() => setSelected(null)}
         onConfirm={() => void remove()}
-        title="Remove saved connection?"
+        title="Remove saved settings?"
         message={
           selected
-            ? `Remove the saved ${integrationNames[selected.integration]} connection and credentials for ${selected.context}? Other saved connections are unchanged. Nothing is deleted from Kubernetes or the backend.${selected.availability === 'unavailable' ? ' This entry may still exist in another kubeconfig; removal also affects any CLI or Desktop using that entry.' : ''}`
+            ? `Remove the saved ${integrationNames[selected.integration]} settings and credentials for ${selected.context}? Other saved settings are unchanged. Nothing is deleted from Kubernetes or the backend.${selected.availability === 'unavailable' ? ' This entry may still exist in another kubeconfig; removal also affects any CLI or Desktop using that entry.' : ''}`
             : ''
         }
-        confirmLabel="Remove connection"
+        confirmLabel="Remove settings"
         isLoading={busy}
         confirmDisabled={!!error}
         showWarning={false}
@@ -380,7 +386,7 @@ export function SavedClusterConnections({
             role="alert"
             className="text-sm text-warning-text"
           >
-            {error} Cancel and reload saved connections before trying again.
+            {error} Cancel and reload integration settings before trying again.
           </p>
         )}
       </ConfirmDialog>

package/src/components/settings/LocalConnectionSettings.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react'
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type ReactNode } from 'react'
 import { Badge, Collapse, ConfirmDialog, SelectMenu } from '@skyhook-io/k8s-ui'
 import { ArrowLeft, Info } from 'lucide-react'
 import { Tooltip } from '../ui/Tooltip'
@@ -47,11 +47,13 @@ export interface StoredConnection {
   source: string
   inFileName: string
   availability: 'available' | 'removed' | 'unavailable'
+  mode: string
   url: string
   headerKeys: string[]
   envHeaderKeys: string[]
   secretSet: boolean
   insecureTls: boolean
+  clusterId: string
   error?: string
 }
 export interface IntegrationProfile {
@@ -126,6 +128,11 @@ const automaticAction: Record<IntegrationKind, string> = {
   argocd: 'Use auto-discovery',
   cost: 'Reset to Automatic'
 }
+function sameIdentity(a?: TargetIdentity, b?: TargetIdentity) {
+  return !!a && !!b && a.server === b.server && a.user === b.user &&
+    a.tlsName === b.tlsName && a.trust === b.trust && a.proxy === b.proxy &&
+    !!a.insecureTls === !!b.insecureTls
+}
 const names: Record<IntegrationKind, string> = {
   metrics: 'Metrics',
   argocd: 'Argo CD',
@@ -180,9 +187,18 @@ export function LocalConnectionSettings({
   const confirmationCopy = useRef({ title: '', message: '', label: '' })
   const [confirmBack, setConfirmBack] = useState(false)
   const [accepted, setAccepted] = useState<IntegrationKind[]>([])
-  const acceptedChanges = accepted.filter(
+  // The review page compares against one previous identity, so it can only
+  // approve integrations that were paused from that same identity.
+  const pausedKinds = (Object.keys(snapshot) as IntegrationKind[]).filter(
     (k) => snapshot[k].state === 'target_changed'
   )
+  const reviewKinds = pausedKinds.filter(
+    (k) => k === kind || sameIdentity(snapshot[k].previousIdentity, profile.previousIdentity)
+  )
+  const separateReviewKinds = pausedKinds.filter((k) => !reviewKinds.includes(k))
+  const separateIdentityKnown = !!profile.previousIdentity &&
+    separateReviewKinds.every((k) => !!snapshot[k].previousIdentity)
+  const acceptedChanges = accepted.filter((k) => reviewKinds.includes(k))
   const request = useRef<AbortController | null>(null)
   const catalogRequest = useRef<AbortController | null>(null)
   const heading = useRef<HTMLHeadingElement>(null)
@@ -191,6 +207,14 @@ export function LocalConnectionSettings({
   const editorRegion = useRef<HTMLFieldSetElement>(null)
   const trigger = useRef<HTMLElement | null>(null)
   const mounted = useRef(true)
+  // Focus moves in the commit that mounts a new draft form. Deferring it to a
+  // later frame lets keystrokes typed in between land in a different field.
+  const focusAfterDraft = useRef<(() => void) | null>(null)
+  useLayoutEffect(() => {
+    const focus = focusAfterDraft.current
+    focusAfterDraft.current = null
+    focus?.()
+  })
   const copySources = catalog.filter(c => c.integration === kind && !c.error && c.url && c.binding !== profile.target.binding)
   const removalContext = profile.target.context
   const dirty =
@@ -220,7 +244,7 @@ export function LocalConnectionSettings({
       .then(async (response) => {
         const data = (await response.json().catch(() => ({}))) as ConnectionResponse
         if (!response.ok)
-          throw new Error(data.error || 'Could not load saved connections.')
+          throw new Error(data.error || 'Could not load other clusters’ settings.')
         if (!controller.signal.aborted && getApiBase() === base) {
           setCatalog(data.connections)
           setCatalogError(false)
@@ -519,7 +543,7 @@ export function LocalConnectionSettings({
           setDraftGeneration((generation) => generation + 1)
           setError('')
           // Cost's first control is its source picker, a listbox trigger.
-          requestAnimationFrame(() => region.current?.querySelector<HTMLElement>('input:not(:disabled), button[aria-haspopup="listbox"]:not(:disabled)')?.focus())
+          focusAfterDraft.current = () => region.current?.querySelector<HTMLElement>('input:not(:disabled), button[aria-haspopup="listbox"]:not(:disabled)')?.focus()
         }}
         className="text-xs text-accent-text hover:underline disabled:opacity-50 shrink-0"
       >
@@ -539,7 +563,7 @@ export function LocalConnectionSettings({
     setDraftGeneration(generation => generation + 1)
     setMessage('')
     setError('')
-    requestAnimationFrame(() => editorRegion.current?.querySelector<HTMLInputElement>('input:not(:disabled)')?.focus())
+    focusAfterDraft.current = () => editorRegion.current?.querySelector<HTMLInputElement>('input:not(:disabled)')?.focus()
   }
   const copySource = (source: StoredConnection) => {
     setSelected(source)
@@ -555,7 +579,7 @@ export function LocalConnectionSettings({
     setDraftGeneration(generation => generation + 1)
     setMessage('')
     setError('')
-    requestAnimationFrame(() => editorRegion.current?.querySelector<HTMLInputElement>('input:not(:disabled)')?.focus())
+    focusAfterDraft.current = () => editorRegion.current?.querySelector<HTMLInputElement>('input:not(:disabled)')?.focus()
   }
   const reuseOptions = task === 'main' && profile.state !== 'launch' ? [
     ...(previous ? [{
@@ -836,7 +860,7 @@ export function LocalConnectionSettings({
           ) : null}
         </>
       )}
-      <fieldset ref={editorRegion} className="min-w-0">
+      <fieldset ref={editorRegion} className="min-w-0 empty:hidden">
         {editor &&
           (kind === 'metrics' ? (
             <PrometheusConnectionForm
@@ -904,7 +928,7 @@ export function LocalConnectionSettings({
             />
           ))}
       </fieldset>
-      {!editor && <Collapse open={showFeedback} className="!mt-0">
+      {!editor && task === 'main' && <Collapse open={showFeedback} className="!mt-0">
         <p role="status" className={`pt-2 text-xs ${messageWarning ? 'text-warning-text' : 'text-theme-text-secondary'}`}>{feedback?.message}</p>
       </Collapse>}
       <ConfirmDialog
@@ -968,8 +992,7 @@ export function LocalConnectionSettings({
                   : 'Unchanged'}
             </dd>
           </dl>
-          {(Object.keys(snapshot) as IntegrationKind[])
-            .filter((k) => snapshot[k].state === 'target_changed')
+          {reviewKinds
             .map((k) => (
               <label key={k} className="flex items-center gap-2 text-sm">
                 <input
@@ -996,6 +1019,14 @@ export function LocalConnectionSettings({
           >
             Keep selected settings for this cluster
           </button>
+          {separateReviewKinds.length > 0 && (
+            <p className="text-xs text-theme-text-secondary">
+              {separateReviewKinds.map((k) => names[k]).join(' and ')}{' '}
+              {separateIdentityKnown
+                ? `${separateReviewKinds.length > 1 ? 'were' : 'was'} saved for a different previous cluster, so ${separateReviewKinds.length > 1 ? 'review them in their own tabs' : 'review it in its own tab'}.`
+                : `${separateReviewKinds.length > 1 ? 'need separate reviews in their own tabs' : 'needs a separate review in its own tab'}.`}
+            </p>
+          )}
         </div>
       )}
       {error && !pending && (

package/src/components/timeline/TimelineList.test.ts

@@ -1,11 +1,13 @@
 import { describe, expect, it } from 'vitest'
 import { applyClientFilters } from '../../api/timelineSource'
 import type { TimelineEvent } from '../../types'
-import { listIncludesManaged } from './TimelineList'
+import { splitRoutineActivity } from './TimelineList'
 
+let clock = Date.parse('2024-01-01T00:00:00.000Z')
 function ev(over: Partial<TimelineEvent> & { id: string }): TimelineEvent {
+  clock += 1000
   return {
-    timestamp: '2024-01-01T00:00:00.000Z',
+    timestamp: new Date(clock).toISOString(),
     source: 'informer',
     kind: 'Deployment',
     namespace: 'ns-a',
@@ -15,42 +17,58 @@ function ev(over: Partial<TimelineEvent> & { id: string }): TimelineEvent {
   }
 }
 
-// Mirrors the host: the source filter runs first, then the UI keeps the selected kinds.
-function listRows(events: TimelineEvent[], kinds: string[]): string[] {
-  return applyClientFilters(events, { includeManaged: listIncludesManaged(false, kinds) })
-    .filter((e) => kinds.length === 0 || kinds.includes(e.kind))
-    .map((e) => e.id)
+const deploy = ev({ id: 'deploy', kind: 'Deployment' })
+const podStarted = ev({ id: 'pod-started', kind: 'Pod', source: 'k8s_event', eventType: 'Normal', reason: 'Started' })
+const podOom = ev({ id: 'pod-oom', kind: 'Pod', source: 'k8s_event', eventType: 'Warning', reason: 'OOMKilled' })
+const rsScaled = ev({ id: 'rs-scaled', kind: 'ReplicaSet' })
+const cronJobOk = ev({ id: 'cron-job-ok', kind: 'Job', owner: { kind: 'CronJob', name: 'nightly' }, healthState: 'healthy' })
+const cronJobFailed = ev({ id: 'cron-job-failed', kind: 'Job', owner: { kind: 'CronJob', name: 'nightly' }, healthState: 'unhealthy' })
+const standaloneJob = ev({ id: 'standalone-job', kind: 'Job' })
+const ALL = [deploy, podStarted, podOom, rsScaled, cronJobOk, cronJobFailed, standaloneJob]
+
+// Mirrors the host: one uncapped query through the source's client filters.
+function split(events: TimelineEvent[], kinds: string[], limit = 2000) {
+  return splitRoutineActivity(applyClientFilters(events, { kinds, includeManaged: true }), limit)
 }
+const ids = (rows: TimelineEvent[]) => rows.map((e) => e.id).sort()
+const oom = (id: string) => ev({ id, kind: 'Pod', source: 'k8s_event', eventType: 'Warning', reason: 'OOMKilled' })
+const started = (id: string) => ev({ id, kind: 'Pod', source: 'k8s_event', eventType: 'Normal', reason: 'Started' })
 
-describe('listIncludesManaged', () => {
-  it('includes managed rows when app-scoped or when any kind is selected', () => {
-    expect(listIncludesManaged(true, [])).toBe(true)
-    expect(listIncludesManaged(false, ['Pod'])).toBe(true)
-    expect(listIncludesManaged(false, ['Job'])).toBe(true)
+describe('splitRoutineActivity', () => {
+  it('keeps owner rows and child problems, holds routine child rows apart', () => {
+    const { withoutRoutine, routine } = split(ALL, [])
+    expect(ids(withoutRoutine)).toEqual(['cron-job-failed', 'deploy', 'pod-oom', 'standalone-job'])
+    expect(ids(routine)).toEqual(['cron-job-ok', 'pod-started', 'rs-scaled'])
   })
 
-  it('keeps hiding managed rows for the unfiltered list', () => {
-    expect(listIncludesManaged(false, [])).toBe(false)
-  })
-})
+  it('shows a picked kind\'s problems and holds its routine rows apart', () => {
+    const pods = split(ALL, ['Pod'])
+    expect(ids(pods.withoutRoutine)).toEqual(['pod-oom'])
+    expect(ids(pods.routine)).toEqual(['pod-started'])
 
-describe('timeline list rows', () => {
-  const events = [
-    ev({ id: 'dep', kind: 'Deployment' }),
-    ev({ id: 'pod', kind: 'Pod' }),
-    ev({ id: 'job', kind: 'Job' }),
-    ev({ id: 'cron-job', kind: 'Job', owner: { kind: 'CronJob', name: 'nightly' } }),
-  ]
+    const jobs = split(ALL, ['Job'])
+    expect(ids(jobs.withoutRoutine)).toEqual(['cron-job-failed', 'standalone-job'])
+    expect(ids(jobs.routine)).toEqual(['cron-job-ok'])
+  })
 
-  it('lists pod rows for a Pod selection', () => {
-    expect(listRows(events, ['Pod'])).toEqual(['pod'])
+  it('lists rows newest first', () => {
+    expect(split(ALL, []).withoutRoutine.map((e) => e.id)).toEqual(['standalone-job', 'cron-job-failed', 'pod-oom', 'deploy'])
   })
 
-  it('lists owned rows of an unmanaged kind for that kind', () => {
-    expect(listRows(events, ['Job']).sort()).toEqual(['cron-job', 'job'])
+  it('never lets owner rows crowd out child problems', () => {
+    const owners = [1, 2, 3].map((n) => ev({ id: `deploy-${n}`, kind: 'Deployment' }))
+    const { withoutRoutine, truncated } = split([oom('old-oom'), ...owners], [], 2)
+    expect(ids(withoutRoutine)).toEqual(['deploy-2', 'deploy-3', 'old-oom'])
+    expect(truncated).toBe(true)
   })
 
-  it('hides pod and owned rows when no kind is selected', () => {
-    expect(listRows(events, []).sort()).toEqual(['dep', 'job'])
+  it('only adds rows when routine activity is shown', () => {
+    const olderDeploy = ev({ id: 'older-deploy', kind: 'Deployment' })
+    const burst = [1, 2, 3].map((n) => started(`started-${n}`))
+    const { withoutRoutine, withRoutine, routine, routineTruncated } = split([olderDeploy, ...burst], [], 2)
+    expect(ids(withoutRoutine)).toEqual(['older-deploy'])
+    expect(ids(withRoutine)).toEqual(['older-deploy', 'started-2', 'started-3'])
+    expect(ids(routine)).toEqual(['started-2', 'started-3'])
+    expect(routineTruncated).toBe(true)
   })
 })

package/src/components/timeline/TimelineList.tsx

@@ -3,13 +3,16 @@ import {
   SEVERITY_TEXT,
   TimelineList as TimelineListUI,
   eventsForApplication,
+  isTimelineProblem,
   type ActivityTypeFilter,
   type ActivityFilterKey,
   type AppMembershipIndex,
   type TimeRange,
   type Topology,
 } from '@skyhook-io/k8s-ui'
+import type { TimelineEvent } from '../../types'
 import { useTimelineSource } from '../../context/TimelineSource'
+import { isManagedTimelineEvent } from '../../api/timelineSource'
 import { useHasLimitedAccess } from '../../contexts/CapabilitiesContext'
 import type { NavigateToResource } from '../../utils/navigation'
 import { AlertTriangle, RefreshCw } from 'lucide-react'
@@ -24,10 +27,33 @@ export type { ActivityTypeFilter, ActivityFilterKey }
 const LIST_FETCH_LIMIT = 2000
 const APP_SCOPED_FETCH_LIMIT = 10000
 
-// The source drops managed rows (Pod, ReplicaSet, Event, or any owned row) before
-// the kind filter runs, so an explicit kind selection must keep them or it lists nothing.
-export function listIncludesManaged(appScoped: boolean, kinds: string[]): boolean {
-  return appScoped || kinds.length > 0
+function isChildProblem(e: TimelineEvent): boolean {
+  return isManagedTimelineEvent(e) && isTimelineProblem(e)
+}
+
+const byNewest = (a: TimelineEvent, b: TimelineEvent) => new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime()
+
+// Splits the list's rows into owner-level rows, problems on child resources,
+// and routine child activity, each newest first under its own `limit`. Separate
+// budgets keep the promises the toggle makes: a burst of owner rows can't crowd
+// out child problems, and showing routine activity only ever adds rows.
+export function splitRoutineActivity(allRows: TimelineEvent[], limit: number) {
+  const owners: TimelineEvent[] = []
+  const childProblems: TimelineEvent[] = []
+  const routine: TimelineEvent[] = []
+  for (const e of allRows) {
+    const bucket = !isManagedTimelineEvent(e) ? owners : isTimelineProblem(e) ? childProblems : routine
+    bucket.push(e)
+  }
+  const base = [...owners.slice(0, limit), ...childProblems.slice(0, limit)].sort(byNewest)
+  const shownRoutine = routine.slice(0, limit)
+  return {
+    withoutRoutine: base,
+    withRoutine: [...base, ...shownRoutine].sort(byNewest),
+    routine: shownRoutine,
+    truncated: owners.length > limit || childProblems.length > limit,
+    routineTruncated: routine.length > limit,
+  }
 }
 
 interface TimelineListProps {
@@ -39,6 +65,10 @@ interface TimelineListProps {
   initialTimeRange?: TimeRange
   showDeleted: boolean
   onShowDeletedChange: (showDeleted: boolean) => void
+  // Routine activity (normal steps of pods, replica sets and other child
+  // resources) is hidden unless the user opts in. Problems always show.
+  showRoutine: boolean
+  onShowRoutineChange: (showRoutine: boolean) => void
   // Shared filter state lifted to TimelineView so it survives the view switch.
   search: string
   onSearchChange: (value: string) => void
@@ -64,7 +94,7 @@ interface TimelineListProps {
   appScopeLoading?: boolean
 }
 
-export function TimelineList({ namespaces, onViewChange, currentView, onResourceClick, initialFilter, initialTimeRange, showDeleted, onShowDeletedChange, search, onSearchChange, activityFilter, onActivityFilterChange, kindFilter, onKindFilterChange, selectionWindow, onVisibleWindowChange, scrollToMs, focusedAppIndex, appScoped = false, topology, appScopeLoading = false }: TimelineListProps) {
+export function TimelineList({ namespaces, onViewChange, currentView, onResourceClick, initialFilter, initialTimeRange, showDeleted, onShowDeletedChange, showRoutine, onShowRoutineChange, search, onSearchChange, activityFilter, onActivityFilterChange, kindFilter, onKindFilterChange, selectionWindow, onVisibleWindowChange, scrollToMs, focusedAppIndex, appScoped = false, topology, appScopeLoading = false }: TimelineListProps) {
   const hasLimitedAccess = useHasLimitedAccess()
   const timelineSource = useTimelineSource()
   const [queryParams, setQueryParams] = useState<{ timeRange: TimeRange; kinds: string[] }>({
@@ -77,26 +107,36 @@ export function TimelineList({ namespaces, onViewChange, currentView, onResource
   }, [])
 
   const fetchLimit = appScoped ? APP_SCOPED_FETCH_LIMIT : LIST_FETCH_LIMIT
+  // The application-scoped list keeps every row: its app filter needs the pods.
+  const splitRows = !appScoped
+  // Uncapped when splitting: each part gets its own cap below. The rows come
+  // from the loaded ring, so this costs no extra fetch.
   const { data: fetchedEvents, isLoading, isError, error, refetch } = timelineSource.useEvents({
     namespaces,
     kinds: queryParams.kinds,
     timeRange: queryParams.timeRange,
     includeK8sEvents: true,
-    includeManaged: listIncludesManaged(appScoped, queryParams.kinds),
+    includeManaged: true,
     includeDeleted: showDeleted,
-    limit: fetchLimit,
+    limit: splitRows ? undefined : fetchLimit,
     fromMs: selectionWindow?.fromMs,
     toMs: selectionWindow?.toMs,
   })
+  const split = useMemo(
+    () => (splitRows && fetchedEvents ? splitRoutineActivity(fetchedEvents, fetchLimit) : undefined),
+    [splitRows, fetchedEvents, fetchLimit],
+  )
   const events = useMemo(() => {
-    const unscoped = fetchedEvents ?? []
+    const unscoped = split ? (showRoutine ? split.withRoutine : split.withoutRoutine) : fetchedEvents ?? []
     return appScoped
       ? focusedAppIndex
         ? eventsForApplication(unscoped, topology, focusedAppIndex)
         : []
       : unscoped
-  }, [appScoped, focusedAppIndex, topology, fetchedEvents])
-  const sourceTruncated = (fetchedEvents?.length ?? 0) >= fetchLimit
+  }, [appScoped, focusedAppIndex, topology, split, showRoutine, fetchedEvents])
+  const sourceTruncated = split
+    ? split.truncated || (showRoutine && split.routineTruncated)
+    : (fetchedEvents?.length ?? 0) >= fetchLimit
 
   // Full-screen error only when nothing is loaded; a failing background poll
   // with data on screen keeps rendering (data before error).
@@ -151,6 +191,10 @@ export function TimelineList({ namespaces, onViewChange, currentView, onResource
           hideRangeSelector={!!selectionWindow}
           showDeleted={showDeleted}
           onShowDeletedChange={onShowDeletedChange}
+          showRoutine={showRoutine}
+          onShowRoutineChange={split ? onShowRoutineChange : undefined}
+          routineEvents={split?.routine}
+          foldPerResource={split && !showRoutine ? isChildProblem : undefined}
           search={search}
           onSearchChange={onSearchChange}
           activityFilter={activityFilter}
@@ -163,7 +207,9 @@ export function TimelineList({ namespaces, onViewChange, currentView, onResource
           isTruncated={sourceTruncated}
           truncationMessage={appScoped && sourceTruncated
             ? `Showing application activity found in the newest ${fetchLimit.toLocaleString()} events in this range — narrow the query to see older activity`
-            : undefined}
+            : split && sourceTruncated
+              ? 'Some older activity in this range is not listed. Narrow the time range to see it.'
+              : undefined}
         />
       </div>
     </div>

package/src/components/timeline/TimelineView.tsx

@@ -125,6 +125,7 @@ export interface PersistedTimelineState {
   viewMode: TimelineViewMode
   mode: TimelineMode
   showDeleted: boolean
+  showRoutine: boolean
   pinnedOnly: boolean
   search: string
   activityFilter: ActivityFilterKey[]
@@ -237,6 +238,7 @@ export function writeTimelineParams(
   set('activity', s.activityFilter.length ? s.activityFilter.join(',') : null)
   set('kinds', s.kindFilter.length ? s.kindFilter.join(',') : null)
   set('deleted', s.showDeleted ? null : '0')
+  set('routine', s.showRoutine ? '1' : null)
   set('pinnedOnly', s.pinnedOnly ? '1' : null)
   set('q', s.search.length ? s.search : null)
   set('grouping', s.grouping !== DEFAULT_GROUPING ? s.grouping : null)
@@ -309,6 +311,7 @@ export function TimelineView({ namespaces, onResourceClick, initialViewMode, ini
   // and so the fetch can exclude deletes at the source rather than only hiding
   // them client-side.
   const [showDeleted, setShowDeleted] = useState(() => searchParams.get('deleted') !== '0')
+  const [showRoutine, setShowRoutine] = useState(() => searchParams.get('routine') === '1')
   // ?pinnedOnly=1 is inert without pins: honoring it with no stored pins would
   // arm a filter that hides everything. Gate the read on stored pins so the param
   // can never arm on its own — ordering-proof, independent of when the empty-pins
@@ -634,6 +637,8 @@ export function TimelineView({ namespaces, onResourceClick, initialViewMode, ini
     setMode((prev) => (timeModeEqual(prev, nextMode) ? prev : nextMode))
     const nextDeleted = sp.get('deleted') !== '0'
     setShowDeleted((prev) => (prev === nextDeleted ? prev : nextDeleted))
+    const nextRoutine = sp.get('routine') === '1'
+    setShowRoutine((prev) => (prev === nextRoutine ? prev : nextRoutine))
     // Same guard as the lazy init: the param can only arm the filter when pins
     // exist, so a mount that runs this after the empty-pins reset can't re-arm it.
     const nextPinnedOnly = sp.get('pinnedOnly') === '1' && pinnedLanes.length > 0
@@ -658,7 +663,7 @@ export function TimelineView({ namespaces, onResourceClick, initialViewMode, ini
     const current = searchParamsRef.current
     const target = writeTimelineParams(
       current,
-      { viewMode, mode, showDeleted, pinnedOnly, search: debouncedSearch, activityFilter, kindFilter, grouping, sort, selectedEventId },
+      { viewMode, mode, showDeleted, showRoutine, pinnedOnly, search: debouncedSearch, activityFilter, kindFilter, grouping, sort, selectedEventId },
       { isRetained: isRetained || isLocal, requiresNamespaceFilter: scopeRequiresNamespaceFilter },
     )
     const targetStr = target.toString()
@@ -672,7 +677,7 @@ export function TimelineView({ namespaces, onResourceClick, initialViewMode, ini
     const replace = !didMountUrlSyncRef.current || onlyHighFreqDiffer(currentStr, targetStr)
     didMountUrlSyncRef.current = true
     setSearchParamsRef.current(target, { replace })
-  }, [viewMode, mode, showDeleted, pinnedOnly, debouncedSearch, activityFilter, kindFilter, grouping, sort, selectedEventId, isRetained, isLocal, scopeRequiresNamespaceFilter])
+  }, [viewMode, mode, showDeleted, showRoutine, pinnedOnly, debouncedSearch, activityFilter, kindFilter, grouping, sort, selectedEventId, isRetained, isLocal, scopeRequiresNamespaceFilter])
 
   // Fetch all activity - zoom controls what's visible in the UI. This ring feeds
   // the swimlanes and the local strip's histogram, so it also runs in list mode
@@ -1032,6 +1037,8 @@ export function TimelineView({ namespaces, onResourceClick, initialViewMode, ini
       initialTimeRange={initialTimeRange}
       showDeleted={showDeleted}
       onShowDeletedChange={setShowDeleted}
+      showRoutine={showRoutine}
+      onShowRoutineChange={setShowRoutine}
       search={search}
       onSearchChange={setSearch}
       activityFilter={activityFilter}

package/src/components/timeline/TimelineView.urlparams.test.ts

@@ -75,6 +75,7 @@ function parseState(
     viewMode,
     mode: parseTimeMode(params, opts.isRetained, opts.maxRangeDays),
     showDeleted: params.get('deleted') !== '0',
+    showRoutine: params.get('routine') === '1',
     pinnedOnly: params.get('pinnedOnly') === '1' && opts.hasPins,
     search: params.get('q') ?? '',
     activityFilter,
@@ -89,6 +90,7 @@ const defaultState: PersistedTimelineState = {
   viewMode: DEFAULT_VIEW,
   mode: live(DEFAULT_LIVE_WIDTH_MS),
   showDeleted: true,
+  showRoutine: false,
   pinnedOnly: false,
   search: '',
   activityFilter: [],
@@ -158,6 +160,7 @@ describe('writeTimelineParams', () => {
       viewMode: 'list',
       mode: live(6 * 60 * 60 * 1000),
       showDeleted: false,
+      showRoutine: true,
       pinnedOnly: true,
       search: 'nginx',
       activityFilter: ['warnings', 'unhealthy'],
@@ -175,6 +178,7 @@ describe('writeTimelineParams', () => {
       ['kinds', 'Pod,Deployment'],
       ['pinnedOnly', '1'],
       ['q', 'nginx'],
+      ['routine', '1'],
       ['sort', 'recent'],
       ['view', 'list'],
       ['window', '21600000'],
@@ -265,6 +269,7 @@ describe('parse(write(state)) round-trip', () => {
       viewMode: 'list',
       mode: live(6 * 60 * 60 * 1000),
       showDeleted: false,
+      showRoutine: true,
       pinnedOnly: true,
       search: 'nginx',
       activityFilter: ['warnings', 'unhealthy'],
@@ -338,6 +343,7 @@ describe('onlyHighFreqDiffer (history replace vs push)', () => {
     expect(onlyHighFreqDiffer('', 'activity=warnings')).toBe(false)
     expect(onlyHighFreqDiffer('', 'kinds=Pod')).toBe(false)
     expect(onlyHighFreqDiffer('', 'deleted=0')).toBe(false)
+    expect(onlyHighFreqDiffer('', 'routine=1')).toBe(false)
     expect(onlyHighFreqDiffer('', 'pinnedOnly=1')).toBe(false)
   })