ts
import { LitElement, customElement, css, html } from '@umbraco-cms/backoffice/external/lit';

@customElement('hangfire-dashboard')
export class HangfireDashboard extends LitElement {
  render() {
    return html`
      <iframe name="hangfireIframe" class="hangfireContent" id="Hangfire" frameborder="0" scrolling="yes" marginheight="0" marginwidth="0"
        src="/umbraco/backoffice/hangfire/" allowfullscreen="true"
        webkitallowfullscreen="true" mozallowfullscreen="true"
        oallowfullscreen msallowfullscreen="true">
      </iframe>
    `;
  }

  static styles = css`
    :host {
        display: block;
        padding: 24px;
        height: 94%;
    }

    .hangfireContent {
        min-width: 100% !important;
        min-height: 100% !important;
    }
  `
}

declare global {
  interface HTMLElementTagNameMap {
    'hangfire-dashboard': HangfireDashboard
  }
}

cs
// in a Compose method:
AddHangfireDashboard( builder );

private static void AddHangfireDashboard( IUmbracoBuilder builder ) {
  builder.Services.Configure<UmbracoPipelineOptions>( options => {
    options.AddFilter( new UmbracoPipelineFilter( HangfireConstants.HangfireDashboard ) {
      Endpoints = app => app.UseEndpoints( endpoints => {
        endpoints.MapHangfireDashboard(
            pattern: "/umbraco/backoffice/hangfire",
            options: new DashboardOptions() {
              // Authorization = [] // something here maybe?
            } );
      } ).UseHangfireDashboard()
    } );
  } );
}