@@ -16,6 +16,8 @@ import {
1616 TextCellRenderer ,
1717 DateCellRenderer ,
1818 BooleanCellRenderer ,
19+ EmailCellRenderer ,
20+ PhoneCellRenderer ,
1921 PercentCellRenderer ,
2022 humanizeLabel ,
2123 formatDate ,
@@ -365,7 +367,7 @@ describe('BooleanCellRenderer', () => {
365367 render (
366368 < BooleanCellRenderer
367369 value = { false }
368- field = { { name : 'active ' , type : 'boolean' } as any }
370+ field = { { name : 'flagged ' , type : 'boolean' } as any }
369371 />
370372 ) ;
371373 const checkbox = screen . getByRole ( 'checkbox' ) ;
@@ -440,6 +442,91 @@ describe('BooleanCellRenderer', () => {
440442 } ) ;
441443} ) ;
442444
445+ // =========================================================================
446+ // 4b. BooleanCellRenderer — Warning badge for status fields
447+ // =========================================================================
448+ describe ( 'BooleanCellRenderer warning badge' , ( ) => {
449+ it ( 'should render warning badge for active=false' , ( ) => {
450+ const { container } = render (
451+ < BooleanCellRenderer
452+ value = { false }
453+ field = { { name : 'active' , type : 'boolean' , label : 'Active' } as any }
454+ />
455+ ) ;
456+ const badge = container . querySelector ( '[data-testid="boolean-warning-badge"]' ) ;
457+ expect ( badge ) . toBeInTheDocument ( ) ;
458+ expect ( badge ?. textContent ) . toContain ( 'Off' ) ;
459+ } ) ;
460+
461+ it ( 'should render warning badge for is_enabled=false' , ( ) => {
462+ const { container } = render (
463+ < BooleanCellRenderer
464+ value = { false }
465+ field = { { name : 'is_enabled' , type : 'boolean' , label : 'Enabled' } as any }
466+ />
467+ ) ;
468+ const badge = container . querySelector ( '[data-testid="boolean-warning-badge"]' ) ;
469+ expect ( badge ) . toBeInTheDocument ( ) ;
470+ } ) ;
471+
472+ it ( 'should render normal checkbox for active=true' , ( ) => {
473+ render (
474+ < BooleanCellRenderer
475+ value = { true }
476+ field = { { name : 'active' , type : 'boolean' } as any }
477+ />
478+ ) ;
479+ const checkbox = screen . getByRole ( 'checkbox' ) ;
480+ expect ( checkbox ) . toHaveAttribute ( 'data-state' , 'checked' ) ;
481+ } ) ;
482+ } ) ;
483+
484+ // =========================================================================
485+ // 4c. EmailCellRenderer — mailto + copy button
486+ // =========================================================================
487+ describe ( 'EmailCellRenderer' , ( ) => {
488+ it ( 'should render mailto link' , ( ) => {
489+ render ( < EmailCellRenderer value = "test@example.com" field = { { name : 'email' , type : 'email' } as any } /> ) ;
490+ const link = screen . getByRole ( 'link' ) ;
491+ expect ( link ) . toHaveAttribute ( 'href' , 'mailto:test@example.com' ) ;
492+ expect ( screen . getByText ( 'test@example.com' ) ) . toBeInTheDocument ( ) ;
493+ } ) ;
494+
495+ it ( 'should render copy button' , ( ) => {
496+ render ( < EmailCellRenderer value = "test@example.com" field = { { name : 'email' , type : 'email' } as any } /> ) ;
497+ const copyBtn = screen . getByLabelText ( 'Copy email' ) ;
498+ expect ( copyBtn ) . toBeInTheDocument ( ) ;
499+ } ) ;
500+
501+ it ( 'should render dash for empty value' , ( ) => {
502+ render ( < EmailCellRenderer value = { null } field = { { name : 'email' , type : 'email' } as any } /> ) ;
503+ expect ( screen . getByText ( '-' ) ) . toBeInTheDocument ( ) ;
504+ } ) ;
505+ } ) ;
506+
507+ // =========================================================================
508+ // 4d. PhoneCellRenderer — tel link + call icon + copy
509+ // =========================================================================
510+ describe ( 'PhoneCellRenderer' , ( ) => {
511+ it ( 'should render tel link with phone icon' , ( ) => {
512+ render ( < PhoneCellRenderer value = "+1-555-1234" field = { { name : 'phone' , type : 'phone' } as any } /> ) ;
513+ const link = screen . getByRole ( 'link' ) ;
514+ expect ( link ) . toHaveAttribute ( 'href' , 'tel:+1-555-1234' ) ;
515+ expect ( screen . getByText ( '+1-555-1234' ) ) . toBeInTheDocument ( ) ;
516+ } ) ;
517+
518+ it ( 'should render copy button' , ( ) => {
519+ render ( < PhoneCellRenderer value = "+1-555-1234" field = { { name : 'phone' , type : 'phone' } as any } /> ) ;
520+ const copyBtn = screen . getByLabelText ( 'Copy phone number' ) ;
521+ expect ( copyBtn ) . toBeInTheDocument ( ) ;
522+ } ) ;
523+
524+ it ( 'should render dash for empty value' , ( ) => {
525+ render ( < PhoneCellRenderer value = { null } field = { { name : 'phone' , type : 'phone' } as any } /> ) ;
526+ expect ( screen . getByText ( '-' ) ) . toBeInTheDocument ( ) ;
527+ } ) ;
528+ } ) ;
529+
443530// =========================================================================
444531// 5. formatRelativeDate edge cases
445532// =========================================================================
0 commit comments