import { BookOpen, Brain, CheckCircle, Sparkles } from 'lucide-react'; import PersonalityQuiz from '@/components/frameworks/PersonalityQuiz'; import type { EmotionalIntelligencePageActions, EmotionalIntelligencePageState, } from '@/components/emotional-intelligence/types'; import { StatePanel } from '@/components/ui/state-panel'; type PersonalityQuizTabProps = { state: EmotionalIntelligencePageState; actions: EmotionalIntelligencePageActions; }; export function PersonalityQuizTab({ state, actions }: PersonalityQuizTabProps) { const workplaceContent = state.personalityWorkplaceContent; const hasContentError = Boolean(state.contentError); return (
{state.isLoadingSaved ? ( Loading your saved results... ) : ( actions.setActiveTab('directory')} onResult={actions.handlePersonalityResult} questions={state.personalityQuiz?.questions} savedType={state.personalityResult} savedAnswers={state.savedAnswers} savedDate={state.savedDate} isSaving={state.isSaving} canPersistResult={state.canPersistPersonalResults} /> )}
{state.contentLoading && ( Loading personality workplace content... )} {hasContentError && ( Personality workplace content could not be loaded from the backend. )} {!state.contentLoading && !hasContentError && workplaceContent && (

What is MBTI?

{workplaceContent.mbtiDescription}

{workplaceContent.dimensions.map((item) => (
{item.dim} {item.label}

{item.desc}

))}
)}

Type Directory

Explore all 16 types

Browse all personality types to understand colleagues' work styles, communication preferences, and relationship needs.

{!state.contentLoading && !hasContentError && workplaceContent && (

Why This Matters at Work

{workplaceContent.workplaceTips.map((tip) => (

{tip}

))}
)}
); }