// Tableau de bord en disposition bureau.
//
// Cette couche ne crée aucune donnée : elle redistribue en grille ce que le
// tableau de bord téléphone affiche déjà, depuis les mêmes projections
// (`VASCO_RUNTIME.dashboard`, `TODO_REPORTS`, `AGENDA_TODAY`, `ACTIVITE`) et les
// mêmes chargeurs (`VascoApi`). Chaque geste appelle le même rappel et ouvre la
// même feuille que sur le téléphone.
//
// Sous le seuil de bureau, le composant rend exactement la version enveloppée
// précédente : le rendu téléphone ne change pas d'un pixel. Le fichier est donc
// chargé après toutes les couches qui remplacent `Dashboard`, et enveloppe la
// dernière version, jamais la référence figée.

const VASCO_DESKTOP_LEGACY_DASHBOARD = Dashboard;

function vascoDesktopPlural(count, one, many) {
  return count > 1 ? many : one;
}

function vascoDesktopCapability(capabilities, name) {
  return (capabilities && capabilities[name]) || null;
}

// Refus serveur : le motif vient du serveur, jamais d'un texte inventé ici.
function vascoDesktopRefusal(capability) {
  return typeof dbReason === 'function' ? dbReason(capability) : 'Action indisponible';
}

function vascoDesktopBlocked(capability) {
  return Boolean(capability && capability.enabled === false);
}

function VascoDesktopTypeBadge({ type }) {
  const tokens = window.VascoUI.tokens;
  return <span className="mono" data-vasco-report-type={type} style={{
    flexShrink: 0, minWidth: tokens.control.large, textAlign: 'center',
    padding: `${tokens.space.xs}px ${tokens.space.sm}px`,
    borderRadius: tokens.radius.sm, background: tokens.color.accentTint,
    color: tokens.color.accent, ...tokens.type.caption,
  }}>{type}</span>;
}

// Toutes les lignes de panneau partagent la même hauteur, la même séparation et
// le même geste clavier : `InteractiveRow` du socle porte le bouton, le focus et
// l'étiquette ; la teinte de survol vient de la feuille de style de la scène.
function VascoDesktopRowList({ children }) {
  const tokens = window.VascoUI.tokens;
  return <div style={{ display: 'flex', flexDirection: 'column' }}>
    {React.Children.map(children, (child, index) => <React.Fragment key={index}>
      {index > 0 && <div aria-hidden="true" style={{ height: 1, background: tokens.color.border }} />}
      {child}
    </React.Fragment>)}
  </div>;
}

function VascoDesktopRow({ ariaLabel, onClick = null, leading = null, trailing = null,
  primary, secondary = null }) {
  const tokens = window.VascoUI.tokens;
  const { InteractiveRow } = window.VascoUI;
  const text = <span style={{ flex: 1, minWidth: 0, display: 'block' }}>
    <span style={{ display: 'block', color: tokens.color.ink, ...tokens.type.row,
      overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{primary}</span>
    {secondary && <span style={{ display: 'block', marginTop: tokens.space.xs,
      color: tokens.color.secondary, ...tokens.type.supporting,
      overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{secondary}</span>}
  </span>;
  const shared = {
    width: '100%', minHeight: tokens.layout.panel.rowHeight,
    padding: `0 ${tokens.space.xs}px`, borderRadius: 0, border: 'none',
    background: 'transparent', gap: tokens.space.md,
  };
  if (!onClick) {
    return <div style={{ ...shared, display: 'flex', alignItems: 'center',
      fontFamily: tokens.type.body }}>{leading}{text}{trailing}</div>;
  }
  return <InteractiveRow ariaLabel={ariaLabel} onClick={onClick} style={shared}
    data-vasco-panel-row="true" leading={leading} trailing={trailing}>{text}</InteractiveRow>;
}

// ── À finaliser ─────────────────────────────────────────────────────────────
// Source : `TODO_REPORTS`, la file de /api/v1/dashboard/reports projetée par
// api-client.js. Geste : ouvrir la feuille de validation du téléphone, centrée
// sur le document touché comme le fait déjà une notification.
function VascoDesktopFinalizePanel({ reports, capability, onOpenAll, onOpenReport }) {
  const tokens = window.VascoUI.tokens;
  const { InlineAction, Panel } = window.VascoUI;
  const counts = reports.reduce((acc, report) => {
    acc[report.type] = (acc[report.type] || 0) + 1;
    return acc;
  }, {});
  const spread = Object.keys(counts).sort().map((type) => `${counts[type]} ${type}`).join(' · ');
  const blocked = vascoDesktopBlocked(capability);
  return <Panel title="À finaliser" count={reports.length}
    unavailable={blocked ? vascoDesktopRefusal(capability) : null}
    empty={reports.length ? null : 'Aucun document à valider.'}
    action={!blocked && reports.length
      ? <InlineAction onClick={onOpenAll} ariaLabel="Ouvrir la file de validation">Tout ouvrir</InlineAction>
      : null}
    footer={!blocked && spread ? <span className="mono" style={{
      color: tokens.color.secondary, ...tokens.type.caption }}>{spread}</span> : null}>
    <VascoDesktopRowList>
      {reports.map((report) => <VascoDesktopRow key={report.id}
        ariaLabel={`Ouvrir ${report.procedure} de ${report.patient}`}
        onClick={() => onOpenReport(report)}
        leading={<VascoDesktopTypeBadge type={report.type} />}
        primary={report.patient}
        secondary={report.procedure}
        trailing={<span className="mono" style={{ flexShrink: 0,
          color: tokens.color.secondary, ...tokens.type.caption }}>{report.started}</span>} />)}
    </VascoDesktopRowList>
  </Panel>;
}

// ── Aujourd'hui ─────────────────────────────────────────────────────────────
// Source : `AGENDA_TODAY`, rempli par `VascoApi.loadAgenda()` depuis la même
// fenêtre que l'onglet Agenda. La charge du jour vient de `day_load`, comme la
// carte « Charge du jour » du téléphone. Geste : ouvrir l'agenda, le seul que la
// carte « Prochain RDV » propose sur le téléphone.
function VascoDesktopTodayPanel({ dayLoad, nextTime, onOpenAgenda, capability }) {
  const tokens = window.VascoUI.tokens;
  const { InlineAction, Panel } = window.VascoUI;
  const [state, setState] = React.useState('loading');
  const [rows, setRows] = React.useState([]);
  const [failure, setFailure] = React.useState(null);

  const load = React.useCallback(async () => {
    const api = window.VascoApi;
    if (!api || typeof api.loadAgenda !== 'function') {
      setState('error');
      setFailure('L’agenda du jour n’est pas raccordé.');
      return;
    }
    setState('loading');
    setFailure(null);
    try {
      await api.loadAgenda();
      setRows((window.AGENDA_TODAY || []).slice());
      setState('ready');
    } catch (error) {
      setRows([]);
      setState('error');
      setFailure(error?.message || 'Agenda indisponible');
    }
  }, []);

  React.useEffect(() => { void load(); }, [load]);

  // `day_load` est le décompte du serveur, pas la liste chargée : les deux
  // projections peuvent différer. On nomme donc la mesure au lieu de poser deux
  // nombres contradictoires côte à côte sans dire d'où ils viennent.
  const spread = dayLoad ? `Charge du jour : ${[
    `${dayLoad.consultations} ${vascoDesktopPlural(dayLoad.consultations, 'consultation et suivi', 'consultations et suivis')}`,
    `${dayLoad.procedures} ${vascoDesktopPlural(dayLoad.procedures, 'intervention', 'interventions')}`,
    `${dayLoad.emergencies} ${vascoDesktopPlural(dayLoad.emergencies, 'urgence', 'urgences')}`,
  ].join(' · ')}` : null;
  const blocked = vascoDesktopBlocked(capability);

  return <Panel title="Aujourd’hui"
    count={state === 'ready' ? rows.length : null}
    busy={state === 'loading'}
    busyLabel="Chargement de la journée…"
    unavailable={blocked ? vascoDesktopRefusal(capability) : state === 'error' ? failure : null}
    onRetry={!blocked && state === 'error' ? load : null}
    empty={state === 'ready' && !rows.length ? 'Aucun rendez-vous aujourd’hui.' : null}
    action={state === 'ready' && rows.length
      ? <InlineAction onClick={onOpenAgenda} ariaLabel="Ouvrir l’agenda">Ouvrir l’agenda</InlineAction>
      : null}
    footer={spread ? <span className="mono" style={{
      color: tokens.color.secondary, ...tokens.type.caption }}>{spread}</span> : null}>
    <VascoDesktopRowList>
      {rows.map((row, index) => <VascoDesktopRow key={`${row.time}-${index}`}
        ariaLabel={`Ouvrir l’agenda sur ${row.time}, ${row.label}`}
        onClick={onOpenAgenda}
        leading={<span className="mono" data-vasco-agenda-time={row.time} style={{
          flexShrink: 0, minWidth: tokens.control.large,
          color: nextTime === row.time ? tokens.color.accent : tokens.color.ink,
          ...tokens.type.row, fontWeight: 700,
        }}>{row.time}</span>}
        primary={row.label}
        secondary={row.sub} />)}
    </VascoDesktopRowList>
  </Panel>;
}

// ── Suivis en retard ────────────────────────────────────────────────────────
// Source et feuille : celles de `postop-followup.jsx`, sans les recopier. La
// ligne ouvre le dossier à l'onglet post-opératoire, comme la feuille mobile.
function VascoDesktopFollowUpPanel({ accent, onOpenPatient }) {
  const tokens = window.VascoUI.tokens;
  const { InlineAction, Panel } = window.VascoUI;
  const runtime = window.VascoApi?.dashboard?.overdueFollowUps;
  const [state, setState] = React.useState('loading');
  const [payload, setPayload] = React.useState(null);
  const [failure, setFailure] = React.useState(null);
  const [open, setOpen] = React.useState(false);

  const load = React.useCallback(async () => {
    if (!runtime) {
      setState('error');
      setFailure('Les surveillances en retard ne sont pas raccordées.');
      return;
    }
    setState('loading');
    setFailure(null);
    try {
      setPayload(await runtime.load());
      setState('ready');
    } catch (error) {
      setPayload(null);
      setState('error');
      setFailure(error?.message || 'Chargement impossible');
    }
  }, [runtime]);

  React.useEffect(() => { void load(); }, [load]);

  const items = state === 'ready' ? (payload?.items || []) : [];
  const visible = items.slice(0, 5);
  return <>
    <Panel title="Suivis en retard"
      count={state === 'ready' ? (payload?.count ?? 0) : null}
      busy={state === 'loading'}
      busyLabel="Chargement des surveillances…"
      unavailable={state === 'error' ? failure : null}
      onRetry={state === 'error' ? load : null}
      empty={state === 'ready' && !items.length ? 'Aucune surveillance en retard.' : null}
      action={state === 'ready' && items.length
        ? <InlineAction onClick={() => setOpen(true)} ariaLabel="Ouvrir les surveillances en retard">
          Tout ouvrir
        </InlineAction>
        : null}
      footer={visible.length < items.length ? <span className="mono" style={{
        color: tokens.color.secondary, ...tokens.type.caption,
      }}>{items.length - visible.length} de plus</span> : null}>
      <VascoDesktopRowList>
        {visible.map((item) => {
          const destination = window.VascoPostopFollowUp?.dashboardTarget(item) || null;
          return <VascoDesktopRow key={item.episodeId}
            ariaLabel={destination
              ? `Ouvrir le dossier de ${item.patient.displayName}`
              : `${item.patient.displayName}, patient archivé`}
            onClick={destination
              ? () => onOpenPatient && onOpenPatient(destination.patientId, destination.tab)
              : null}
            primary={item.patient.displayName}
            secondary={item.patient.archived ? 'Patient archivé' : item.interventionLabel}
            trailing={<span className="mono" style={{ flexShrink: 0,
              color: tokens.color.danger, ...tokens.type.caption,
            }}>{item.daysOverdue} J</span>} />;
        })}
      </VascoDesktopRowList>
    </Panel>
    {open && <OverdueFollowUpsSheet payload={payload} state={state} error={failure}
      busy={state === 'loading'} accent={accent} onClose={() => setOpen(false)}
      onReload={load} onOpenPatient={onOpenPatient || (() => {})} />}
  </>;
}

// ── Assistant ───────────────────────────────────────────────────────────────
// Source : la route d'historique de l'écran Assistant. Geste : ouvrir la
// conversation choisie, par l'aiguillage d'onglet qui sert déjà au Compte.
function VascoDesktopAssistantPanel({ onOpenConversation, onOpenHistory }) {
  const tokens = window.VascoUI.tokens;
  const { InlineAction, Panel } = window.VascoUI;
  const runtime = window.VascoApi?.assistant;
  const [state, setState] = React.useState('loading');
  const [items, setItems] = React.useState([]);
  const [failure, setFailure] = React.useState(null);

  const load = React.useCallback(async () => {
    if (!runtime || typeof runtime.listConversations !== 'function') {
      setState('error');
      setFailure('L’historique de l’assistant n’est pas raccordé.');
      return;
    }
    setState('loading');
    setFailure(null);
    try {
      setItems(await runtime.listConversations());
      setState('ready');
    } catch (error) {
      setItems([]);
      setState('error');
      setFailure(error?.message || 'Historique indisponible');
    }
  }, [runtime]);

  React.useEffect(() => { void load(); }, [load]);

  return <Panel title="Assistant"
    count={state === 'ready' ? items.length : null}
    busy={state === 'loading'}
    busyLabel="Chargement des conversations…"
    unavailable={state === 'error' ? failure : null}
    onRetry={state === 'error' ? load : null}
    empty={state === 'ready' && !items.length ? 'Aucune conversation enregistrée.' : null}
    action={state === 'ready'
      ? <InlineAction onClick={onOpenHistory} ariaLabel="Ouvrir l’historique de l’assistant">
        Ouvrir l’assistant
      </InlineAction>
      : null}>
    <VascoDesktopRowList>
      {items.slice(0, 4).map((conversation) => <VascoDesktopRow key={conversation.id}
        ariaLabel={`Ouvrir ${conversation.title}`}
        onClick={() => onOpenConversation(conversation)}
        primary={conversation.title}
        secondary={conversation.preview || null}
        trailing={<span className="mono" style={{ flexShrink: 0,
          color: tokens.color.secondary, ...tokens.type.caption }}>{conversation.date}</span>} />)}
    </VascoDesktopRowList>
  </Panel>;
}

// ── Mon activité ────────────────────────────────────────────────────────────
// Source : `ACTIVITE`, projeté depuis `dashboard.activity`. Même geste que la
// carte du téléphone : ouvrir les statistiques du Compte.
function VascoDesktopActivityPanel({ onOpenStats, capability }) {
  const tokens = window.VascoUI.tokens;
  const { InlineAction, Panel } = window.VascoUI;
  const activity = window.ACTIVITE || null;
  const kpis = (activity?.kpis || []).filter((kpi) => kpi.key === 'crs' || kpi.key === 'rdvs');
  const blocked = vascoDesktopBlocked(capability);
  return <Panel title="Mon activité"
    unavailable={blocked ? vascoDesktopRefusal(capability) : null}
    empty={!blocked && !kpis.length ? 'Activité indisponible pour cette période.' : null}
    action={!blocked && kpis.length
      ? <InlineAction onClick={onOpenStats} ariaLabel="Ouvrir les statistiques">Détail</InlineAction>
      : null}
    footer={!blocked && activity?.periode ? <span className="mono" style={{
      color: tokens.color.secondary, ...tokens.type.caption }}>{activity.periode}</span> : null}>
    <div style={{ display: 'flex', gap: tokens.space.xxl, flexWrap: 'wrap' }}>
      {kpis.map((kpi) => <div key={kpi.key} style={{ minWidth: 0 }}>
        <div style={{ display: 'flex', alignItems: 'baseline', gap: tokens.space.xs }}>
          <span className="digit" style={{ color: tokens.color.ink, ...tokens.type.title }}>{kpi.value}</span>
          <span className="mono" style={{ color: tokens.color.success, ...tokens.type.caption }}>{kpi.delta}</span>
        </div>
        <div style={{ marginTop: tokens.space.xs, color: tokens.color.secondary,
          ...tokens.type.supporting }}>{kpi.label.toLowerCase()}</div>
      </div>)}
    </div>
  </Panel>;
}

// ── Recherche CCAM ──────────────────────────────────────────────────────────
// Le référentiel n'est pas raccordé sur cet environnement. Le panneau ne promet
// rien : il affiche le motif renvoyé par le serveur, comme la carte du téléphone.
function VascoDesktopCcamPanel({ capability, onOpen }) {
  const tokens = window.VascoUI.tokens;
  const { Panel } = window.VascoUI;
  const blocked = vascoDesktopBlocked(capability);
  return <Panel title="Recherche CCAM"
    unavailable={blocked ? vascoDesktopRefusal(capability) : null}>
    <VascoDesktopRowList>
      <VascoDesktopRow ariaLabel="Rechercher un acte CCAM" onClick={onOpen}
        leading={<svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none"
          stroke={tokens.color.secondary} strokeWidth="1.7" strokeLinecap="round"
          strokeLinejoin="round" style={{ flexShrink: 0 }}>
          <circle cx="11" cy="11" r="7" /><path d="M20 20l-3.5-3.5" />
        </svg>}
        primary="Code, acte, catégorie…" />
    </VascoDesktopRowList>
  </Panel>;
}

// ── La page ─────────────────────────────────────────────────────────────────
function VascoDesktopDashboardPage({ accent, onChangeTab, onOpenPatient, onSlideToChat,
  onOpenStats, runtime = null, dictationRuntime = null }) {
  const tokens = window.VascoUI.tokens;
  const { Button, PageHeader, PageGrid, PageColumn, icons } = window.VascoUI;
  const payload = window.VASCO_RUNTIME && window.VASCO_RUNTIME.dashboard;
  const capabilities = payload?.capabilities || null;
  const practitionerName = payload?.practitioner?.display_name || 'Dr.X';
  const patientsRemaining = payload?.summary?.patients_remaining ?? 0;
  const timeZone = payload?.time_zone || 'Europe/Paris';

  const [reports, setReports] = React.useState(() => (window.TODO_REPORTS || []).slice());
  const [crSheet, setCrSheet] = React.useState(null);
  const [focusReportId, setFocusReportId] = React.useState(null);
  const [dictating, setDictating] = React.useState(false);
  const [pickingDictationPatient, setPickingDictationPatient] = React.useState(false);
  const [ccamOpen, setCcamOpen] = React.useState(false);

  const nextTime = payload?.next_appointment
    ? new Intl.DateTimeFormat('fr-FR', {
      hour: '2-digit', minute: '2-digit', hour12: false, timeZone,
    }).format(new Date(payload.next_appointment.starts_at))
    : null;

  // « Avec un patient » promettait un patient qu'il ne donnait jamais : au
  // téléphone c'est le micro d'accueil qui arme le dossier avant d'ouvrir le
  // parcours, et cette page de bureau ne monte pas ce micro. On arme donc par
  // la feuille de choix du parcours lui-même, avant d'ouvrir, plutôt que de
  // laisser un bouton ouvrir une dictée sans patient.
  const startDictation = (mode, name) => {
    const capability = vascoDesktopCapability(capabilities, name);
    if (vascoDesktopBlocked(capability)) {
      showToast(vascoDesktopRefusal(capability), 'error');
      return;
    }
    if (mode !== 'full') { setDictating(mode); return; }
    if (!dictationRuntime?.patients) {
      showToast('La recherche patient est indisponible', 'error');
      return;
    }
    setPickingDictationPatient(true);
  };

  const openAgenda = () => onChangeTab && onChangeTab('AGE');

  const actions = <>
    {/* Le micro de l'accueil devient l'action principale de l'en-tête : même
        tracé que l'onglet Dictée, à la moitié d'un petit contrôle. */}
    <Button variant="accent" size="medium" data-vasco-action="dictate"
      icon={<icons.Nav id="DICT" color="currentColor" size={tokens.control.small / 2} />}
      onClick={() => startDictation('quick', 'start_quick_dictation')}>Dicter</Button>
    <Button size="medium" data-vasco-action="dictate-with-patient"
      onClick={() => startDictation('full', 'start_dictation')}>Avec un patient</Button>
    <RappelBell accent={accent} runtime={runtime}
      capability={vascoDesktopCapability(capabilities, 'manage_reminders')}
      activeCount={payload?.reminders_preview?.active_count ?? null} />
    <NotifBell accent={accent} runtime={runtime}
      capability={vascoDesktopCapability(capabilities, 'open_notifications')}
      dismissCapability={vascoDesktopCapability(capabilities, 'dismiss_notifications')}
      activeCount={payload?.notifications_preview?.active_count ?? null}
      onNavigate={(route) => onChangeTab && onChangeTab(route)}
      onOpenPatient={(id) => onOpenPatient && onOpenPatient(id)}
      onOpenReport={(documentId) => { setFocusReportId(documentId); setCrSheet('all'); }} />
  </>;

  const subtitle = <>
    <span>{patientsRemaining} {vascoDesktopPlural(patientsRemaining, 'patient restant', 'patients restants')} aujourd’hui</span>
    <span style={{ margin: `0 ${tokens.space.xs}px` }}>·</span>
    <span><span className="digit">{reports.length}</span> CR à finaliser</span>
  </>;

  return <div data-vasco-desktop-dashboard="true" className="vasco-scroll" style={{
    position: 'absolute', inset: 0, overflowY: 'auto', overflowX: 'hidden',
    background: tokens.color.canvas, color: tokens.color.ink, fontFamily: tokens.type.body,
  }}>
    <PageHeader
      eyebrow={`${window.DATE_TODAY?.num || ''} · ${window.DATE_TODAY?.dow || ''}`}
      title={<>Bonjour, <span style={{ color: accent, fontStyle: 'italic' }}>{practitionerName}</span></>}
      subtitle={subtitle}
      actions={actions} />

    <PageGrid style={{ paddingBottom: tokens.space.xxxl }}>
      <PageColumn span={8}>
        <VascoDesktopFinalizePanel reports={reports}
          capability={vascoDesktopCapability(capabilities, 'review_reports')}
          onOpenAll={() => { setFocusReportId(null); setCrSheet('all'); }}
          onOpenReport={(report) => { setFocusReportId(report.id); setCrSheet('all'); }} />
        <VascoDesktopTodayPanel dayLoad={payload?.day_load || null} nextTime={nextTime}
          capability={vascoDesktopCapability(capabilities, 'open_day_load')}
          onOpenAgenda={openAgenda} />
      </PageColumn>
      <PageColumn span={4}>
        <VascoDesktopFollowUpPanel accent={accent} onOpenPatient={onOpenPatient} />
        <VascoDesktopAssistantPanel
          onOpenHistory={() => onChangeTab && onChangeTab('IA', { openHistory: true })}
          onOpenConversation={(conversation) => {
            if (onChangeTab) onChangeTab('IA', { conversationId: conversation.id });
            else if (onSlideToChat) onSlideToChat();
          }} />
        <VascoDesktopActivityPanel onOpenStats={onOpenStats}
          capability={vascoDesktopCapability(capabilities, 'open_activity')} />
        <VascoDesktopCcamPanel capability={vascoDesktopCapability(capabilities, 'search_ccam')}
          onOpen={() => setCcamOpen(true)} />
      </PageColumn>
    </PageGrid>

    {crSheet && <CRValidationSheet pending={reports} filter={crSheet} runtime={runtime}
      capability={vascoDesktopCapability(capabilities, 'validate_reports')}
      focusReportId={focusReportId}
      onChangeFilter={(filter) => { setFocusReportId(null); setCrSheet(filter); }}
      onValidate={(document) => setReports((previous) => previous.filter((item) => item.id !== document.id))}
      onClose={() => { setFocusReportId(null); setCrSheet(null); }} />}

    {ccamOpen && <CCAMBottomSheet onClose={() => setCcamOpen(false)} />}

    {pickingDictationPatient && <DictationV6PatientSheet runtime={dictationRuntime}
      title="Dicter avec un patient"
      onPick={(picked) => {
        window.VascoDictationArmedPatients.arm(picked);
        setPickingDictationPatient(false);
        setDictating('full');
      }}
      onClose={() => setPickingDictationPatient(false)} />}

    {dictating && <DictationFlow mode={dictating} runtime={dictationRuntime}
      onClose={() => setDictating(false)}
      onSent={(conversation) => {
        void runtime?.refresh().catch(() => {});
        if (onChangeTab) onChangeTab('IA', { conversationId: conversation.id });
      }} />}
  </div>;
}

Dashboard = function VascoDashboardForLayout(props) {
  if (window.VascoUI.useLayout() !== 'desktop') {
    return <VASCO_DESKTOP_LEGACY_DASHBOARD {...props} />;
  }
  return <VascoDesktopDashboardPage {...props} />;
};
window.Dashboard = Dashboard;