@umituz/web-dashboard 5.0.1 → 6.1.0

package/src/domains/onboarding/validation/validation.test.ts

@@ -0,0 +1,175 @@
+import { describe, it, expect } from 'vitest';
+import { checkFlowStructure } from './flow-structure-check';
+import { checkScreenConfig, getRecognizedScreenTypes } from './screen-config-check';
+import { checkStoredProgress } from './stored-progress-check';
+import {
+  isRecognizedPermissionStatus,
+  normalizePermissionStatus,
+} from './permission-status-check';
+import type { OnboardingScreen } from '../types/screens';
+
+// TEST_SCENARIOS.md §23
+const welcome = (id = 'a'): OnboardingScreen => ({
+  id,
+  type: 'welcome',
+  title: 'T',
+});
+
+describe('flow-structure-check (§23.1)', () => {
+  it('rejects empty flows', () => {
+    expect(checkFlowStructure([])).toEqual({
+      ok: false,
+      reason: 'flow must contain at least one screen',
+    });
+  });
+
+  it('rejects duplicate step ids', () => {
+    const outcome = checkFlowStructure([welcome('dup'), welcome('dup')]);
+    expect(outcome.ok).toBe(false);
+    if (!outcome.ok) expect(outcome.reason).toMatch(/duplicate step id/);
+  });
+
+  it('accepts a valid flow and propagates per-screen failures', () => {
+    expect(checkFlowStructure([welcome('a'), welcome('b')])).toEqual({ ok: true });
+    // goal-question without options fails at the flow level
+    const bad = checkFlowStructure([
+      welcome('a'),
+      { id: 'g', type: 'goal-question', question: 'Q', options: [], onChange: () => undefined },
+    ]);
+    expect(bad.ok).toBe(false);
+  });
+});
+
+// TEST_SCENARIOS.md §23.2
+describe('screen-config-check (§23.2)', () => {
+  it('rejects malformed screens', () => {
+    // @ts-expect-error -- deliberately malformed input (null is not a screen)
+    expect(checkScreenConfig(null).ok).toBe(false);
+    // @ts-expect-error -- deliberately malformed input (missing id)
+    expect(checkScreenConfig({ type: 'welcome' }).ok).toBe(false);
+    expect(checkScreenConfig({ id: '', type: 'welcome' } as OnboardingScreen).ok).toBe(false);
+    expect(
+      checkScreenConfig({ id: 'x', type: 'unknown' } as unknown as OnboardingScreen).ok,
+    ).toBe(false);
+    expect(
+      checkScreenConfig({ id: 'x', type: 'goal-question' } as OnboardingScreen).ok,
+    ).toBe(false);
+  });
+
+  it('requires content for content-driven screens', () => {
+    expect(
+      checkScreenConfig({
+        id: 'p',
+        type: 'pain-points',
+        painPoints: [],
+      } as unknown as OnboardingScreen).ok,
+    ).toBe(false);
+    expect(
+      checkScreenConfig({
+        id: 't',
+        type: 'tinder-cards',
+        statements: [],
+      } as unknown as OnboardingScreen).ok,
+    ).toBe(false);
+    expect(
+      checkScreenConfig({ id: 'pp', type: 'permission-priming' } as unknown as OnboardingScreen)
+        .ok,
+    ).toBe(false);
+    expect(
+      checkScreenConfig({ id: 'w', type: 'paywall', price: 9 } as unknown as OnboardingScreen).ok,
+    ).toBe(false);
+  });
+
+  it('accepts a well-formed screen', () => {
+    expect(checkScreenConfig(welcome('ok'))).toEqual({ ok: true });
+  });
+
+  it('knows every screen type the orchestrator can render', () => {
+    expect(getRecognizedScreenTypes().size).toBe(14);
+  });
+});
+
+// TEST_SCENARIOS.md §23.3
+describe('stored-progress-check (§23.3)', () => {
+  const validPayload = JSON.stringify({
+    version: 1,
+    currentStep: 2,
+    completedSteps: ['a', 'b'],
+    collected: { a: { selected: ['x'] } },
+    startedAt: '2026-01-01T10:00:00.000Z',
+    lastUpdated: '2026-01-01T10:01:00.000Z',
+  });
+
+  it('returns not-ok for missing, corrupt, or future-version payloads', () => {
+    expect(checkStoredProgress(null)).toEqual({ ok: false, reason: 'no stored progress' });
+    expect(checkStoredProgress('{ malformed').ok).toBe(false);
+    const v2 = checkStoredProgress(JSON.stringify({ version: 2 }));
+    expect(v2.ok).toBe(false);
+    if (!v2.ok) expect(v2.reason).toMatch(/unsupported storage version/);
+  });
+
+  it('rejects shape violations inside an otherwise-valid envelope', () => {
+    expect(
+      checkStoredProgress(
+        JSON.stringify({
+          version: 1,
+          currentStep: -1,
+          completedSteps: [],
+          collected: {},
+          startedAt: '2026-01-01T10:00:00.000Z',
+          lastUpdated: '2026-01-01T10:00:00.000Z',
+        }),
+      ).ok,
+    ).toBe(false);
+    expect(
+      checkStoredProgress(
+        JSON.stringify({
+          version: 1,
+          currentStep: 0,
+          completedSteps: 'nope',
+          collected: {},
+          startedAt: '2026-01-01T10:00:00.000Z',
+          lastUpdated: '2026-01-01T10:00:00.000Z',
+        }),
+      ).ok,
+    ).toBe(false);
+    expect(
+      checkStoredProgress(
+        JSON.stringify({
+          version: 1,
+          currentStep: 0,
+          completedSteps: [],
+          collected: {},
+          startedAt: 'not a date',
+          lastUpdated: '2026-01-01T10:00:00.000Z',
+        }),
+      ).ok,
+    ).toBe(false);
+  });
+
+  it('accepts a valid v1 payload and returns it typed', () => {
+    const outcome = checkStoredProgress(validPayload);
+    expect(outcome.ok).toBe(true);
+    if (outcome.ok) {
+      expect(outcome.data.currentStep).toBe(2);
+      expect(outcome.data.completedSteps).toEqual(['a', 'b']);
+    }
+  });
+});
+
+// TEST_SCENARIOS.md §23.4
+describe('permission-status-check (§23.4)', () => {
+  it('normalizes browser-level permission strings', () => {
+    expect(normalizePermissionStatus('granted')).toBe('granted');
+    expect(normalizePermissionStatus('denied')).toBe('denied');
+    expect(normalizePermissionStatus('default')).toBe('prompt');
+    expect(normalizePermissionStatus(null)).toBe('unsupported');
+    expect(normalizePermissionStatus('whatever')).toBe('unsupported');
+  });
+
+  it('recognizes exactly the four internal statuses', () => {
+    expect(isRecognizedPermissionStatus('prompt')).toBe(true);
+    expect(isRecognizedPermissionStatus('revoked')).toBe(false);
+    expect(isRecognizedPermissionStatus(42)).toBe(false);
+  });
+});

package/src/index.ts

@@ -1,16 +1,6 @@
 export * from './domains/layouts';
 export * from './domains/settings';
 export * from './domains/calendar';
-export {
-  AuthLayout,
-  LoginForm,
-  RegisterForm,
-  useAuth,
-  type LoginCredentials,
-  type RegisterData,
-  type User,
-} from './domains/auth';
-
 export {
   useAnalytics,
   MetricCard,

package/src/styles/dashboard.contract.test.ts

@@ -1,3 +1,4 @@
+// @vitest-environment node
 import { readFileSync } from "node:fs";
 import { describe, expect, it } from "vitest";
 

package/src/styles/dashboard.css

@@ -697,165 +697,6 @@
   margin: var(--udb-space-2) 0;
   background: var(--color-border);
 }
-.udb-auth {
-  display: flex;
-  flex-direction: column;
-  min-height: 100dvh;
-  background: var(--color-background);
-}
-.udb-auth__header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--udb-space-3);
-  padding: var(--udb-space-4) var(--udb-space-6);
-}
-.udb-auth__brand {
-  display: flex;
-  align-items: center;
-  gap: var(--udb-space-2);
-}
-.udb-auth__brand-name {
-  font-size: var(--udb-font-size-lg);
-  font-weight: var(--font-weight-bold);
-  letter-spacing: -0.02em;
-  color: var(--color-foreground);
-}
-.udb-auth__home-link {
-  font-size: var(--udb-font-size-md);
-  color: var(--color-muted-foreground);
-  text-decoration: none;
-}
-.udb-auth__home-link:hover {
-  color: var(--color-foreground);
-  text-decoration: underline;
-}
-.udb-auth__main {
-  display: flex;
-  flex: 1;
-  align-items: center;
-  justify-content: center;
-  padding: var(--udb-space-6) var(--udb-space-4);
-}
-.udb-auth__column {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  max-width: 420px;
-}
-.udb-auth__card {
-  background: var(--color-card);
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-xl);
-  box-shadow: var(--shadow-lg);
-  padding: var(--udb-space-8) var(--udb-space-7);
-}
-.udb-auth__tagline {
-  margin: 0 0 var(--udb-space-5);
-  text-align: center;
-  font-size: var(--udb-font-size-xs);
-  font-weight: var(--font-weight-bold);
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  color: var(--color-primary);
-}
-.udb-auth__social {
-  margin-top: var(--udb-space-5);
-}
-.udb-auth__footer {
-  padding: var(--udb-space-4) var(--udb-space-6);
-}
-.udb-auth__footer-inner {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: var(--udb-space-2);
-  text-align: center;
-  font-size: var(--udb-font-size-xs);
-  color: var(--color-muted-foreground);
-}
-.udb-auth__footer-inner > p {
-  margin: 0;
-}
-.udb-auth__footer-links {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-wrap: wrap;
-  gap: var(--udb-space-4);
-}
-.udb-auth__footer-link {
-  font-size: var(--udb-font-size-xs);
-  color: var(--color-muted-foreground);
-  text-decoration: none;
-}
-.udb-auth__footer-link:hover {
-  color: var(--color-foreground);
-  text-decoration: underline;
-}
-.udb-divider-row {
-  display: flex;
-  align-items: center;
-  gap: var(--udb-space-3);
-  margin: var(--udb-space-5) 0;
-}
-.udb-divider-row::before,
-.udb-divider-row::after {
-  content: "";
-  flex: 1;
-  height: 1px;
-  background: var(--color-border);
-}
-.udb-divider-row__label {
-  font-size: var(--udb-font-size-xs);
-  font-weight: var(--font-weight-medium);
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  color: var(--color-muted-foreground);
-  white-space: nowrap;
-}
-.udb-social-grid {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: var(--udb-space-3);
-}
-.udb-social-grid__btn {
-  width: 100%;
-}
-.udb-social-grid__icon {
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-}
-.udb-social-btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: var(--udb-space-2);
-  height: 40px;
-  padding: 0 var(--udb-space-3);
-  border: 1px solid var(--udb-border-strong);
-  border-radius: var(--radius-md);
-  background: var(--color-card);
-  color: var(--color-foreground);
-  font-family: inherit;
-  font-size: var(--udb-font-size-md);
-  font-weight: var(--font-weight-medium);
-  cursor: pointer;
-}
-.udb-social-btn:hover {
-  background: var(--color-muted);
-}
-.udb-social-btn__icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-}
-.udb-social-btn__icon svg {
-  width: 16px;
-  height: 16px;
-}
 @keyframes udb-spin {
   to {
     transform: rotate(360deg);
@@ -864,271 +705,6 @@
 .udb-spin {
   animation: udb-spin 1s linear infinite;
 }
-.udb-form {
-  display: flex;
-  flex-direction: column;
-  gap: var(--udb-space-4);
-  width: 100%;
-}
-.udb-form__header {
-  display: flex;
-  flex-direction: column;
-  gap: var(--udb-space-1);
-  text-align: center;
-}
-.udb-form__title {
-  margin: 0;
-  font-size: var(--udb-font-size-2xl);
-  font-weight: var(--font-weight-bold);
-  letter-spacing: -0.02em;
-  line-height: 1.2;
-  color: var(--color-foreground);
-}
-.udb-form__title--lg {
-  font-size: var(--udb-font-size-3xl);
-}
-.udb-form__subtitle {
-  margin: 0;
-  font-size: var(--udb-font-size-md);
-  color: var(--color-muted-foreground);
-}
-.udb-form__subtitle-strong {
-  color: var(--color-foreground);
-  font-weight: var(--font-weight-medium);
-}
-.udb-form__row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--udb-space-3);
-  font-size: var(--udb-font-size-md);
-}
-.udb-form__footer-text {
-  margin: 0;
-  text-align: center;
-  font-size: var(--udb-font-size-md);
-  color: var(--color-muted-foreground);
-}
-.udb-form__group {
-  display: flex;
-  flex-direction: column;
-  gap: var(--udb-space-3);
-}
-.udb-field {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-.udb-field__label {
-  font-size: var(--udb-font-size-md);
-  font-weight: var(--font-weight-medium);
-  color: var(--color-foreground);
-}
-.udb-field__required {
-  margin-left: 2px;
-  color: var(--color-destructive);
-}
-.udb-field__error {
-  margin: 0;
-  font-size: var(--udb-font-size-sm);
-  color: var(--color-destructive);
-}
-.udb-form-alert {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--udb-space-2);
-  padding: 10px var(--udb-space-3);
-  border-radius: var(--radius-md);
-  background: var(--color-destructive-soft, color-mix(in srgb, var(--color-destructive, #dc2626) 10%, transparent));
-  color: var(--color-destructive);
-  font-size: var(--udb-font-size-md);
-}
-.udb-form-alert__icon {
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-  margin-top: 2px;
-}
-.udb-check-label {
-  display: flex;
-  align-items: center;
-  gap: var(--udb-space-2);
-  font-size: var(--udb-font-size-md);
-  color: var(--color-muted-foreground);
-  cursor: pointer;
-}
-.udb-check-label--multiline {
-  align-items: flex-start;
-}
-.udb-check-label__text {
-  flex: 1;
-  line-height: 1.45;
-}
-.udb-link-btn {
-  display: inline;
-  border: none;
-  padding: 0;
-  background: transparent;
-  font-family: inherit;
-  font-size: var(--udb-font-size-md);
-  color: var(--color-primary);
-  cursor: pointer;
-}
-.udb-link-btn:hover {
-  text-decoration: underline;
-}
-.udb-link-btn:disabled {
-  pointer-events: none;
-  opacity: 0.55;
-}
-.udb-link-btn--strong {
-  font-weight: 600;
-}
-.udb-text-link {
-  color: var(--color-primary);
-  text-decoration: none;
-}
-.udb-text-link:hover {
-  text-decoration: underline;
-}
-.udb-submit-btn {
-  width: 100%;
-  height: 44px;
-}
-.udb-submit-btn--pill {
-  height: 48px;
-  border-radius: var(--udb-radius-pill);
-}
-.udb-btn__spinner {
-  animation: udb-spin 1s linear infinite;
-}
-.udb-password-wrap {
-  position: relative;
-  width: 100%;
-}
-.udb-input--with-toggle {
-  padding-right: 44px;
-}
-.udb-password-toggle {
-  position: absolute;
-  right: 2px;
-  top: 50%;
-  transform: translateY(-50%);
-}
-.udb-password-toggle__icon {
-  width: 16px;
-  height: 16px;
-  color: var(--color-muted-foreground);
-}
-.udb-input--error {
-  border-color: var(--color-destructive);
-}
-.udb-input--error:focus-visible {
-  border-color: var(--color-destructive);
-  box-shadow: 0 0 0 3px var(--color-destructive-soft, color-mix(in srgb, var(--color-destructive, #dc2626) 10%, transparent));
-}
-.udb-strength {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-  margin-top: var(--udb-space-1);
-}
-.udb-strength__bars {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: var(--udb-space-2);
-}
-.udb-strength__bar {
-  height: 4px;
-  border-radius: var(--udb-radius-pill);
-  background: var(--udb-border-strong);
-  transition: background-color 0.2s ease;
-}
-.udb-strength__bar--weak {
-  background: var(--color-destructive);
-}
-.udb-strength__bar--fair {
-  background: var(--color-warning);
-}
-.udb-strength__bar--good {
-  background: var(--color-primary);
-}
-.udb-strength__bar--strong {
-  background: var(--color-success);
-}
-.udb-strength__label {
-  margin: 0;
-  font-size: var(--udb-font-size-xs);
-  color: var(--color-muted-foreground);
-}
-.udb-strength__label--weak {
-  color: var(--color-destructive);
-}
-.udb-strength__label--fair {
-  color: var(--color-warning);
-}
-.udb-strength__label--good {
-  color: var(--color-primary);
-}
-.udb-strength__label--strong {
-  color: var(--color-success);
-}
-.udb-success-badge {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 48px;
-  height: 48px;
-  margin: 0 auto var(--udb-space-4);
-  border-radius: 50%;
-  background: var(--color-success-soft, color-mix(in srgb, var(--color-success, #16a34a) 12%, transparent));
-}
-.udb-success-badge__icon {
-  width: 24px;
-  height: 24px;
-  color: var(--color-success);
-}
-.udb-steps-list {
-  display: flex;
-  flex-direction: column;
-  gap: var(--udb-space-3);
-  margin: var(--udb-space-4) 0 0;
-  padding: 0;
-  list-style: none;
-}
-.udb-steps-list__item {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--udb-space-2);
-  font-size: var(--udb-font-size-md);
-  color: var(--color-foreground);
-}
-.udb-steps-list__icon {
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-  margin-top: 2px;
-  color: var(--color-success);
-}
-.udb-back-link {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  margin-top: var(--udb-space-4);
-  border: none;
-  padding: 0;
-  background: transparent;
-  font-family: inherit;
-  font-size: var(--udb-font-size-md);
-  color: var(--color-muted-foreground);
-  cursor: pointer;
-}
-.udb-back-link:hover {
-  color: var(--color-foreground);
-}
-.udb-back-link__icon {
-  width: 14px;
-  height: 14px;
 }
 .udb-settings {
   display: flex;
@@ -1616,42 +1192,6 @@
 .udb-table__td--center {
   text-align: center;
 }
-.udb-org {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  line-height: 1.2;
-}
-.udb-org__name {
-  font-size: var(--udb-font-size-md);
-  font-weight: var(--font-weight-medium);
-  color: var(--color-foreground);
-}
-.udb-org__meta {
-  font-size: 10px;
-  text-transform: capitalize;
-  color: var(--color-muted-foreground);
-}
-.udb-org-menu {
-  padding: var(--udb-space-2);
-}
-.udb-org-menu__label {
-  flex: 1;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.udb-org-menu__check {
-  width: 14px;
-  height: 14px;
-  color: var(--color-primary);
-}
-.udb-menu__item--active {
-  background: var(--color-primary-soft, color-mix(in srgb, var(--color-primary, #2563eb) 10%, transparent));
-  color: var(--color-primary);
-  font-weight: var(--font-weight-medium);
-}
 .udb-matrix__cell {
   display: inline-flex;
   align-items: center;