{{!
  Copyright IBM Corp. 2016, 2025
  SPDX-License-Identifier: BUSL-1.1
}}

<Page::Header @title={{this.title}}>
  <:breadcrumbs>
    <Page::Breadcrumbs @breadcrumbs={{this.breadcrumbs}} />
  </:breadcrumbs>
</Page::Header>

<div class="box is-fullwidth is-sideless is-paddingless is-marginless">
  <InfoTableRow @label="Code">
    <MaskedInput @name="code" @value={{this.totpCode}} @displayOnly={{true}} @allowCopy={{true}} />
    <label class="has-left-padding-s">
      <div>Valid for {{this.remainingTime}} seconds</div>
      <progress id="code-validity" value={{this.remainingTime}} max={{@totpCodePeriod}} />
    </label>
  </InfoTableRow>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
  <div class="control">
    <Hds::Button @text="Back" @color="secondary" {{on "click" this.redirectPreviousPage}} />
  </div>
</div>