[go: up one dir, main page]

Skip to content

Update ObservabilityController to use presenter

What does this MR do and why?

Update ObservabilityController to use presenter

This updates the ObservabilityController to use the presenter to generate the JWT tokens for the Observability service and pass them to the view.

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 O11yToken class (!197515 - merged)
  2. Add ObservabilityPresenter (!197533 - merged)
  3. Update ObservabilityController to use presenter (!197535 - merged) <- you are here
  4. Log a user into the O11y service react app (!197536 - merged) <- full functionality here

Here's a sequence diagram outlining the entire login process

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'}

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

  1. In rails console enable the feature flag and set the group settings (Replace YOUR_EMAIL)
    group = Group.find_by_path('toolbox')
    Feature.enable(:observability_sass_features, group)
    group.create_observability_group_o11y_setting!(
       o11y_service_url: "http://localhost:8080",
       o11y_service_user_email: YOUR_EMAIL,
       o11y_service_password: "passwordmcpasswordface",
       o11y_service_post_message_encryption_key: "your-super-secret-encryption-key-here-32-chars-minimum",
    )

Keep this console session open to re-use later

  1. Get an instance of GitLab O11y running locally
    1. Install Docker Desktop if you haven't already.
    2. Download GitLab O11y's docker compose file
    3. Replace YOUR_EMAIL with your email and start everything
 O11Y_ENCRYPTION_KEY=your-production-encryption-key-here-32-chars-minimum O11Y_EMAIL=YOUR_EMAIL O11Y_PASSWORD=passwordmcpasswordface ALLOWED_ORIGINS="http://localhost:3000" O11Y_NAME=O11y ORG_DISPLAY_NAME=GitLab docker compose -f docker-compose.yaml up -d

This should create a new user and organization in the O11y service that will be used to login.

  1. Open the o11y service in your browser http://localhost:8080/ and make sure it's running - you should see a login screen - not an account creation screen
  2. Update app/views/groups/observability/show.html.haml to print the contents of @data. Add this to line 8:

-# Debug: Print @data contents
  .gl-p-4.gl-bg-gray-50.gl-mb-4
    %h3.gl-heading-3 Debug: @data contents
    %pre.gl-bg-white.gl-p-3.gl-border.gl-rounded= @data.inspect
    - if @data.respond_to?(:to_h)
      %h4.gl-heading-4 JSON representation:
      %pre.gl-bg-white.gl-p-3.gl-border.gl-rounded= JSON.pretty_generate(@data.to_h)

View it at: http://localhost:3000/groups/toolbox/-/observability/services

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.

Edited by Dakota Dux

Merge request reports

Loading