A LiveComponent for handling session tokens.

TokenComponent manages the client-side session token, allowing the parent LiveView to do the following:

• Redirect when a user is already signed in.
• Store a new token upon registration or authentication.
• Clear a token upon sign-out.

See USAGE.md for example code.

Assigns

• @id (Optional) An HTML element ID.
• @token: A Base64-encoded session token to be stored in the client.

The parent LiveView may use Phoenix.LiveView.send_update/3 to set or clear a token in the client.

Clear a Token

send_update(TokenComponent, id: "token-component", token: :clear)

Store a Token

send_update(TokenComponent, id: "token-component", token: base64_encoded_token)

Events

The following events are handled internally by TokenComponent:

• "token-exists": Sent by the client when sessionStorage contains a userToken.
• "token-stored": Sent by the client when a token has been stored in sessionStorage.
• "token-cleared": Sent by the client when a token has been cleared from sessionStorage.
• "error": Sent by the client when an error occurs.

Messages

• {:token_exists, token: token}
  • :token is a Base64-encoded token found by the client.
  • The parent LiveView may use this token to authenticate users.
• {:token_stored, token: token}
  • :token is a Base64-encoded token stored by the client.
  • The parent LiveView may compare the returned token against the token sent to the component to ensure there has been no tampering.
• {:token_cleared}
  • A token has been cleared from the client.
• {:error, payload}
  • payload contains the message, name, and stack returned by the browser upon timeout or other client-side errors.