VotingZone
packages/engagement/components/molecules/VotingZone.js · Tier: molecule · Module: engagement · Rendering: Client Component ('use client')
Purpose
Orchestrates the full citizen voting flow for a consultation:
- YES / NO selection.
- Browser-side digital-certificate verification (TLS client auth via the ALB).
- Server Action →
POST /transaction-authorization/operation-authorizations. OtpVerificationPanel— all OTP entry and error states.- On OTP success → the vote is cast via
confirmVoteWithOtp.
OTP-specific UI/state is fully delegated to OtpVerificationPanel.
Props
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
t | object | yes | — | Voting-zone dictionary. |
tOtp | object | yes | — | OTP-panel dictionary. |
tCert | object | yes | — | Certificate-error dictionary. |
isActive | boolean | yes | — | Whether the consultation accepts votes. |
questionId | number | string | yes | — | The consultation. |
accessToken | string | yes | — | Bearer token (also used for the browser mTLS cert call). |
Behaviour
An internal phase machine (select → checking-cert → cert-invalid /
requesting-auth → OTP → cast) drives the UI. Certificate verification goes straight
from the browser to the ALB (see Data & API).
Composition
- Uses:
organisms/core/OtpVerificationPanel,molecules/engagement/CitizenOnlyNotice,molecules/core/CertInvalidError,atoms/core/Icon,useAnnounce, the vote/authorization actions +certClient. - Used by:
organisms/engagement/QuestionDetailView.
Internationalisation
Copy via t / tOtp / tCert; results announced through the live region.
Accessibility
YES/NO are labelled controls; OTP entry delegates to the accessible
OtpVerificationPanel; cert failures render CertInvalidError.
Related
organisms/core/OtpVerificationPanel, molecules/core/OtpInput,
molecules/core/CertInvalidError, Local mTLS.