susana/BeyondCXAnalytics-Demo
2
0
Fork 0
Code Issues 2 Pull Requests 1 Actions Packages Projects Releases 6 Wiki Activity

fix: pass redFlagConfigs as prop to child components in AgenticReadinessTab

Browse Source 
Fixed "ReferenceError: redFlagConfigs is not defined" by passing redFlagConfigs
as a prop to components that need it:
- TierQueueSection: Added redFlagConfigs prop and passed from parent
- ExpandableSkillRow: Added redFlagConfigs prop
- HumanOnlyByReasonSection: Added redFlagConfigs prop and passed from parent

These components are defined before the main AgenticReadinessTab component
so they don't have direct access to redFlagConfigs defined in the parent scope.

https://claude.ai/code/session_01GNbnkFoESkRcnPr3bLCYDg
This commit is contained in:
Claude
2026-02-07 18:16:26 +00:00
parent d645eda97c
commit 627504586f
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/components/tabs/AgenticReadinessTab.tsx
View File

@@ -2007,12 +2007,14 @@ function ExpandableSkillRow({
dataPoint,
idx,
isExpanded,
onToggle
onToggle,
redFlagConfigs
}: {
dataPoint: DrilldownDataPoint;
idx: number;
isExpanded: boolean;
onToggle: () => void;
redFlagConfigs: RedFlagConfig[];
}) {
// v3.4: Contar colas por Tier
const tierCounts = {
@@ -2326,10 +2328,12 @@ const TIER_SECTION_CONFIG: Record<AgenticTier, {
// Componente de tabla de colas por Tier (AUTOMATE, ASSIST, AUGMENT)
function TierQueueSection({
drilldownData,
tier
tier,
redFlagConfigs
}: {
drilldownData: DrilldownDataPoint[];
tier: 'AUTOMATE' | 'ASSIST' | 'AUGMENT';
redFlagConfigs: RedFlagConfig[];
}) {
const [expandedSkills, setExpandedSkills] = useState<Set<string>>(new Set());
const config = TIER_SECTION_CONFIG[tier];
@@ -2536,7 +2540,7 @@ function TierQueueSection({
}
// Componente para colas HUMAN-ONLY agrupadas por razón/red flag
function HumanOnlyByReasonSection({ drilldownData }: { drilldownData: DrilldownDataPoint[] }) {
function HumanOnlyByReasonSection({ drilldownData, redFlagConfigs }: { drilldownData: DrilldownDataPoint[]; redFlagConfigs: RedFlagConfig[] }) {
const [expandedReasons, setExpandedReasons] = useState<Set<string>>(new Set());
const config = TIER_SECTION_CONFIG['HUMAN-ONLY'];
@@ -3692,16 +3696,16 @@ export function AgenticReadinessTab({ data, onTabChange }: AgenticReadinessTabPr
{data.drilldownData && data.drilldownData.length > 0 ? (
<>
{/* TABLA 1: Colas AUTOMATE - Listas para automatización */}
<TierQueueSection drilldownData={data.drilldownData} tier="AUTOMATE" />
<TierQueueSection drilldownData={data.drilldownData} tier="AUTOMATE" redFlagConfigs={redFlagConfigs} />
{/* TABLA 2: Colas ASSIST - Candidatas a Copilot */}
<TierQueueSection drilldownData={data.drilldownData} tier="ASSIST" />
<TierQueueSection drilldownData={data.drilldownData} tier="ASSIST" redFlagConfigs={redFlagConfigs} />
{/* TABLA 3: Colas AUGMENT - Requieren optimización */}
<TierQueueSection drilldownData={data.drilldownData} tier="AUGMENT" />
<TierQueueSection drilldownData={data.drilldownData} tier="AUGMENT" redFlagConfigs={redFlagConfigs} />
{/* TABLA 4: Colas HUMAN-ONLY - Agrupadas por razón/red flag */}
<HumanOnlyByReasonSection drilldownData={data.drilldownData} />
<HumanOnlyByReasonSection drilldownData={data.drilldownData} redFlagConfigs={redFlagConfigs} />
</>
) : (
/* Fallback a tabla por Línea de Negocio si no hay drilldown data */