kyd-shared-badge 0.3.42 → 0.3.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kyd-shared-badge",
-  "version": "0.3.42",
+  "version": "0.3.43",
   "private": false,
   "main": "./src/index.ts",
   "module": "./src/index.ts",

package/src/PrintableBadgeDisplay.tsx

@@ -136,6 +136,7 @@ const SharedBadgeDisplay = ({ badgeData, chatProps, headless }: { badgeData: Pub
               return { label: em.label, description: em.description, roleName: role.name };
             })()}
             countries={(assessmentResult?.screening_sources?.ip_risk_analysis?.raw_data?.countries) || []}
+            accountAuthenticity={assessmentResult?.account_authenticity}
         />
       </Reveal>
       {/* Coaching / Evidence under header when present */}
@@ -285,7 +286,7 @@ const SharedBadgeDisplay = ({ badgeData, chatProps, headless }: { badgeData: Pub
 
           {/* Connected Platforms */}
           <Reveal headless={isHeadless}>
-            <ConnectedPlatforms accounts={connected} />
+            <ConnectedPlatforms accounts={connected} authenticity={assessmentResult?.account_authenticity} />
           </Reveal>
 
         

package/src/SharedBadgeDisplay.tsx

@@ -202,6 +202,7 @@ const SharedBadgeDisplay = ({ badgeData, chatProps, headless }: { badgeData: Pub
               return { label: em.label, description: em.description, roleName: role.name };
             })()}
             countries={(assessmentResult?.screening_sources?.ip_risk_analysis?.raw_data?.countries) || []}
+            accountAuthenticity={assessmentResult?.account_authenticity}
         />
       </Reveal>
       <div className={'rounded-xl shadow-xl p-6 sm:p-8 mt-6 border'} style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)' }}>
@@ -428,7 +429,7 @@ const SharedBadgeDisplay = ({ badgeData, chatProps, headless }: { badgeData: Pub
             </div>
           )}
           <div>
-            <ConnectedPlatforms accounts={connected} />
+            <ConnectedPlatforms accounts={connected} authenticity={assessmentResult?.account_authenticity} />
           </div>
         </div>
       </div>

package/src/components/ConnectedPlatforms.tsx

@@ -25,11 +25,63 @@ const ProviderIcon = ({ name }: { name?: string }) => {
   return <span className="inline-block w-4 h-4 rounded-full" style={{ backgroundColor: 'var(--icon-button-secondary)' }} />;
 };
 
-const ConnectedPlatforms = ({ accounts }: { accounts?: ConnectedAccount[] }) => {
+const formatProviderName = (name?: string) => {
+  const n = (name || '').trim();
+  if (!n) return '';
+  const lower = n.toLowerCase();
+  if (lower === 'so' || lower === 'stack_overflow') return 'Stack Overflow';
+  return n.charAt(0).toUpperCase() + n.slice(1);
+};
+
+const ConnectedPlatforms = ({ accounts, authenticity }: { accounts?: ConnectedAccount[]; authenticity?: { label?: string; description?: string; oauth_connected?: string[]; mismatches?: Array<{ provider?: string; detail?: string }> } }) => {
   const list = Array.isArray(accounts) ? accounts : [];
   if (list.length === 0) return null;
   return (
     <div className="pt-8">
+      {(() => {
+        const label = (authenticity?.label || '').toLowerCase();
+        const isCritical = label === 'likely inauthentic';
+        const isSuspicious = label === 'suspicious';
+        if (!label) return null;
+        return (
+          <div className={"mb-4 rounded-md border p-3"} style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)' }}>
+            <div className="flex items-start gap-2">
+              <span className="text-sm font-semibold" style={{ color: isCritical ? '#B00020' : isSuspicious ? '#9f580a' : 'var(--text-main)' }}>
+                {(authenticity?.label) || ''}
+              </span>
+            </div>
+            {authenticity?.description ? (
+              <div className={'text-xs mt-1'} style={{ color: 'var(--text-secondary)' }}>{authenticity.description}</div>
+            ) : null}
+            {Array.isArray(authenticity?.oauth_connected) && authenticity!.oauth_connected!.length > 0 ? (
+              <div className="mt-3 flex flex-wrap gap-2">
+                {authenticity!.oauth_connected!.map((p, i) => (
+                  <span key={`${p}-${i}`} className="inline-flex items-center gap-1 px-2 py-1 rounded text-xs font-medium border" style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)', color: 'var(--text-secondary)' }}>
+                    <span className="text-sm" style={{ color: 'var(--text-main)' }}><ProviderIcon name={p} /></span>
+                    <span style={{ color: 'var(--text-main)' }}>{formatProviderName(p)}</span>
+                  </span>
+                ))}
+              </div>
+            ) : null}
+            {Array.isArray(authenticity?.mismatches) && authenticity!.mismatches!.length > 0 ? (
+              <div className="mt-3 rounded-md border p-3" style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)' }}>
+                <div className="text-sm font-semibold" style={{ color: 'var(--text-main)' }}>Observed Identity Mismatches</div>
+                <ul className="mt-2 space-y-2">
+                  {authenticity!.mismatches!.map((m, idx) => (
+                    <li key={idx} className="flex items-start gap-2 text-xs" style={{ color: 'var(--text-secondary)' }}>
+                      <span className="text-sm" style={{ color: 'var(--text-main)' }}><ProviderIcon name={m.provider} /></span>
+                      <span>
+                        <span className="font-medium" style={{ color: 'var(--text-main)' }}>{formatProviderName(m.provider)}</span>
+                        {m.detail ? `: ${m.detail}` : ''}
+                      </span>
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            ) : null}
+          </div>
+        );
+      })()}
       <h4 className={'text-lg font-semibold mb-3'} style={{ color: 'var(--text-main)' }}>Sources (Connected or Linked)</h4>
       <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
         {list.map((acct, idx) => (

package/src/components/ReportHeader.tsx

@@ -4,7 +4,7 @@ import Image from 'next/image';
 import { formatLocalDate } from '../utils/date';
 import countriesLib from 'i18n-iso-countries';
 import enLocale from 'i18n-iso-countries/langs/en.json';
-import { FiInfo } from 'react-icons/fi';
+import { FiInfo, FiAlertTriangle } from 'react-icons/fi';
 
 // Register English locale once at module import time
 countriesLib.registerLocale(enLocale);
@@ -39,9 +39,10 @@ interface ReportHeaderProps {
     summary?: string;
     enterpriseMatch?: { label?: string; description?: string; roleName?: string } | null;
     countries?: string[];
+    accountAuthenticity?: { label?: string; description?: string };
 }
 
-const ReportHeader = ({ badgeId, developerName, updatedAt, score = 0, badgeImageUrl, summary, enterpriseMatch, countries = [] }: ReportHeaderProps) => {
+const ReportHeader = ({ badgeId, developerName, updatedAt, score = 0, badgeImageUrl, summary, enterpriseMatch, countries = [], accountAuthenticity }: ReportHeaderProps) => {
   // Use the dynamic image if available, otherwise fall back to the score-based one.
   const finalBadgeImageUrl = badgeImageUrl || getBadgeImageUrl(score || 0);
   const tint = hexToRgba(pickTint(score || 0), 0.06);
@@ -58,6 +59,22 @@ const ReportHeader = ({ badgeId, developerName, updatedAt, score = 0, badgeImage
       className={'mb-8 p-6 rounded-xl shadow-lg border'}
       style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)', backgroundImage: `linear-gradient(${tint}, ${tint})` }}
     >
+      {(() => {
+        const label = (accountAuthenticity?.label || '').toLowerCase();
+        if (!label) return null;
+        const isCritical = label === 'likely inauthentic';
+        const isSuspicious = label === 'suspicious';
+        if (!isCritical && !isSuspicious) return null;
+        return (
+          <div className={'mb-4 rounded-md border p-3 flex items-start gap-2'} style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)' }}>
+            <span className={'mt-0.5'} style={{ color: isCritical ? '#B00020' : '#9f580a' }}><FiAlertTriangle size={18} /></span>
+            <div className={'text-sm'}>
+              <div className={'font-semibold'} style={{ color: 'var(--text-main)' }}>Account Authenticity {isCritical ? 'Warning' : 'Notice'}</div>
+              <div className={'mt-1'} style={{ color: 'var(--text-secondary)' }}>{accountAuthenticity?.description || (isCritical ? 'We detected signals that some linked accounts may be inauthentic. Review sources below.' : 'Some inconsistencies were observed across linked accounts. Review sources below.')}</div>
+            </div>
+          </div>
+        );
+      })()}
       <div className="flex flex-col md:flex-row items-center md:items-stretch gap-6">
         {/* Left Half: Badge Image with robust centered overlay */}
         <div className="w-full md:w-1/3 flex items-center justify-center self-stretch">

package/src/types.ts

@@ -268,6 +268,14 @@ export interface AssessmentResult {
   graph_insights?: GraphInsightsPayload;
   enterprise_match?: EnterpriseMatch;
   enterprise_use_cases?: EnterpriseUseCases;
+  // New: account authenticity assessment
+  account_authenticity?: {
+    label: 'Normal' | 'Suspicious' | 'Likely Inauthentic';
+    description?: string;
+    // Optional diagnostics for UI/tooling
+    oauth_connected?: string[];
+    mismatches?: Array<{ provider?: string; detail?: string }>;
+  };
 }
 export interface ClientMetadata {
   ipAddress: string;