feat: add Member Management component docs and previews - #1697
feat: add Member Management component docs and previews#1697grandmaester wants to merge 7 commits into
Conversation
|
Preview deployment for your docs. Learn more about Mintlify Previews.
💡 Tip: Enable Workflows to automatically generate PRs for you. |
|
Preview deployment for your docs. Learn more about Mintlify Previews.
💡 Tip: Enable Workflows to automatically generate PRs for you. |
|
Preview deployment for your docs. Learn more about Mintlify Previews.
💡 Tip: Enable Workflows to automatically generate PRs for you. |
Summary
|
| @@ -0,0 +1,202 @@ | |||
| --- | |||
There was a problem hiding this comment.
@grandmaester we should only add component view files and remove all the other supporting files form our repo like this SKILL.md which is not necessary for the live previews.
There was a problem hiding this comment.
@SurajThotakura Are you suggesting to just add doc content changes? Skill is new addition on this to make sure this will be done much easier for future components
| "@auth0/universal-components-core": "^2.0.1", | ||
| "@auth0/universal-components-react": "^2.0.1", | ||
| "@auth0/universal-components-core": "^3.1.2", | ||
| "@auth0/universal-components-react": "file:./auth0-universal-components-react-3.1.2.tgz", |
There was a problem hiding this comment.
This will be removed in sometime, once we deploy change for exporting view components on the react package
3760f66 to
b826187
Compare
Adds documentation and interactive previews for the two My Organization member components, stacked on the 3.1.2 upgrade branch. Docs (English only for now), following the configure-org-domains pattern: - organization-member-management.mdx - organization-member-detail.mdx Both added to the My Organization nav group, since navigation is manual. Previews: - New mocks for both components, wired through mocks/index.ts, getComponentMock.ts, and routes/index.ts. - Modals are intentionally left live rather than suppressed. These two components essentially are their modal flows (invite, revoke, revoke-and-resend, assign roles, remove from organization), so a preview with the dialogs pinned shut would show almost nothing usable. Each confirm handler mutates in-memory state behind a short delay and then closes, so flows complete without a tenant or any API call. Fixes a latent Spinner fault while here: ComponentLoader.jsx rendered <Spinner> without importing it, resolving out of the calling page's MDX scope. Every consuming page therefore carried an otherwise-unused `import Spinner`, and any disturbance to scope surfaced as a confusing "Expected component `Spinner` to be defined" error that masqueraded as the root cause. The spinner markup is now inlined so the snippet is self-contained, and the seven dead imports are removed. Adds a creating-universal-component-mocks skill documenting the harness wiring, how to verify a View is a runtime (not type-only) export, reading prop contracts from the installed .d.ts, and the version-bump checklist. Note: @auth0/universal-components-react is pinned to a checked-in tarball because published 3.1.2 does not export OrganizationMemberManagementView at runtime (a barrel omission upstream; the detail View is present). Revert to the registry range once a release includes it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
b826187 to
3ede61b
Compare
* docs: fix universal components live preview * fix: update ui-components * docs: address pr comments * docs: address pr comments
Description
Adds documentation and interactive previews for the two My Organization member components:
OrganizationMemberManagementandOrganizationMemberDetail.Docs (English only for now)
organization-member-management.mdxandorganization-member-detail.mdx, underget-started/universal-components/web/components/, following theconfigure-org-domainspage structure:ReleaseStageNotice(beta) → liveComponentLoaderpreview → React / Next.js / shadcn tabs → setup, install, get started, full integration example → Required/Display/Action/Customization props with per-prop deep dives → Available Messages and Styling Options accordions → advanced customization (subcomponents + hooks). Content is ported from the internal component reference so the public docs and the internal source of truth stay aligned.Both pages are added to the My Organization group in
main/config/navigation/universal-components.json, since navigation is manual.Previews
New mocks for both components, wired through
src/mocks/index.ts,src/helpers/getComponentMock.ts, andsrc/routes/index.ts.Unlike the previously integrated components, modals are deliberately left live here rather than suppressed. These two components essentially are their modal flows — invite, revoke, revoke-and-resend, assign roles, remove from organization — so a preview with the dialogs pinned shut would show almost nothing usable. Each confirm handler mutates in-memory state behind a short delay and then closes, so the flows complete end to end without a tenant or any API call. Mocks avoid
Date.now()/Math.random(), using fixed ISO timestamps and a state-backed sequence counter, so previews render deterministically.Spinner fix
ComponentLoader.jsxrendered<Spinner>without importing it, resolving out of the calling page's MDX scope. Every consuming page therefore carried an otherwise-unusedimport Spinner, and any disturbance to scope surfaced as a confusingExpected component `Spinner` to be definederror that masqueraded as the root cause — which is exactly how it presented while debugging these previews. The spinner markup is now inlined so the snippet is self-contained, and the seven dead imports are removed.snippets/Spinner.jsxis left in place but is now unreferenced.Mock-authoring skill
universal-components/.claude/skills/creating-universal-component-mocks/SKILL.md— auto-invoking guidance for the next component. Documents the harness wiring and the four files that must share the same kebab-case key, verifying a*Viewis a runtime (not type-only) export, reading prop contracts from the installed.d.tsrather than component source in another repo, flat vs. nested mock shapes, both modal policies, and how to type-check a mock against the real contract (whichtsc -bcannot do throughany).Note on the package source
@auth0/universal-components-reactis pinned to a checked-in tarball rather than the registry range used by #1712, because published 3.1.2 does not exportOrganizationMemberManagementViewat runtime — a barrel omission upstream. (OrganizationMemberDetailViewis published.) Without the tarball the management preview cannot mount at all. This should revert to a plain registry version range once a release includes the missing export; flagging it explicitly so it isn't merged unnoticed.References
Testing
Then
cd main && mint devand load the two new pages. Both previews render with seeded data; every modal opens, completes, and closes. Verified both*Viewsymbols and both route keys are present in the shipped bundle, and that all component pages still compile with noSpinnerreference remaining.Checklist
CONTRIBUTING.md.🤖 Generated with Claude Code