Add observability crypto utils

What does this MR do and why?

This MR adds a crypto util that encrypts and decrypts messages coming from the react app in the iframe used to log a user into the react app. This will be used by the updates that will be introduced in !197536 (merged) This MR is pointed at !199631 (merged) but doesn't have any dependencies on that branch. It's only pointed there to avoid conflicts in the gitlab.pot file

Related MR Slicing

This MR is a slice of a feature that logs a user into the o11y service. Here are the related slices

1. Add observability message validator component (!199631 - merged)
2. Add observability crypto utils (!199632 - closed) <- you are here
3. Log a user into the O11y service react app (!197536 - merged) <- full functionality here

The overall sequence looks like this:

sequenceDiagram
    participant RC as Rails Controller
    participant OB as O11y Backend
    participant RV as Rails View
    participant VC as Vue Component
    participant RA as React App (iframe)

    RC->>OB: POST /auth/login<br/>{email, password}
    OB-->>RC: 200 OK<br/>{jwt: "eyJ0eXAi..."}
    
    RC->>RV: render view<br/>@data = tokens, encryption key...
    RV-->>RC: HTML with JWT in data attribute
    
    RC->>VC: serve page with<br/>Vue component
    RV->>VC: mount component<br/>data-jwt="eyJ0eXAi..."
    
    VC->>RA: create iframe<br/>src="app.html"
    RA-->>VC: iframe loaded<br/>ready event
    VC->>RA: postMessage<br/>{type: 'AUTH_TOKEN', jwt: 'eyJ0eXAi...'}
    RA-->>VC: postMessage<br/>{type: 'AUTH_SUCCESS'}

With this change used in this part of the sequence:

sequenceDiagram
    participant VC as Vue Component
    participant RA as React App (iframe)

    RA-->>VC: iframe loaded<br/>ready event
    VC->>RA: postMessage<br/>{type: 'AUTH_TOKEN', jwt: 'eyJ0eXAi...'}
    RA-->>VC: postMessage<br/>{type: 'AUTH_SUCCESS'}

Duo generated description

This code adds secure encryption capabilities for passing sensitive data between different parts of a web application (specifically between Vue and React components).

The main functionality includes:

• Encryption/decryption functions that use industry-standard AES-GCM encryption to protect sensitive information like user authentication tokens
• Security features like message expiration (messages older than 5 minutes are rejected), data tampering detection, and validation of encryption keys
• Utility functions for generating secure random values and checking if the browser supports the required encryption features
• Comprehensive error handling with user-friendly error messages in multiple languages

The code is designed to safely transmit authentication data between different application components while preventing unauthorized access, data tampering, and replay attacks. It includes extensive test coverage to ensure the encryption works correctly with various data types and handles edge cases properly.

This is particularly useful for applications that need to securely share user login information between different frontend frameworks while maintaining strong security standards.

References

Update login process to use observability_group_o11y_setting table

Screenshots or screen recordings

No UI changes

How to set up and validate locally

You can verify this by testing the full experience outlined here: !197536 (merged)

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.