@if (form) {
  <form class="form-group m-b-8" [formGroup]="form">
    <div class="d-flex gap-8 a-i-center">
      <label class="c8y-radio">
        <input
          type="radio"
          value="dashboard"
          data-cy="c8y-config-context-selector--dashboard-mode"
          formControlName="context"
        />
        <span class="a-s-center"></span>
        <span translate>Dashboard</span>
      </label>
      <label class="c8y-radio">
        <input
          type="radio"
          value="widget"
          data-cy="c8y-config-context-selector--config-mode"
          formControlName="context"
        />
        <span class="a-s-center"></span>
        <span translate>Widget</span>
      </label>
    </div>
    @if (form.controls.context.value === 'widget') {
      <label class="c8y-checkbox m-t-8">
        <input
          type="checkbox"
          data-cy="c8y-config-context-selector--hide-in-widget"
          formControlName="hideInWidget"
        />
        <span></span>
        <span translate>Hide in widget</span>
      </label>
    }
  </form>
}