Hydro/packages/ui-default/templates/home_security.html

{% extends "layout/home_base.html" %}
{% block home_content %}
<div data-heading-extract-to="#menu-item-home_security">
<div class="row">
  {% if handler.user.mail.endsWith('.local') %}
    <div class="medium-12 columns">
      <div class="section">
        <div class="section__body">
          <blockquote class="warn">{{ _("You haven't set an email.")}}</blockquote>
        </div>
      </div>
    </div>
  {% endif %}
  <div class="medium-6 columns">
    <div class="section">
      <div class="section__header">
        <h1 class="section__title" id="password" data-heading>{{ _('Change Password') }}</h1>
      </div>
      <div class="section__body">
        <form method="post">
          {{ form.form_text({
               type:'password',
               label:"SuperUser's Password" if sudoUid else 'Current Password',
               columns:10,
               name:'current',
               required:true
             }) }}
          {{ form.form_text({
               type:'password',
               label:'New Password',
               columns:10,
               name:'password',
               required:true
             }) }}
          {{ form.form_text({
               type:'password',
               label:'Repeat Password',
               columns:10,
               name:'verifyPassword',
               required:true
             }) }}
          <div class="row"><div class="columns">
            <input type="hidden" name="operation" value="change_password">
            <input type="submit" class="rounded primary button" value="{{ _('Change Password') }}">
          </div></div>
        </form>
      </div>
    </div>
  </div>
  <div class="medium-6 columns">
    <div class="section">
      <div class="section__header">
        <h1 class="section__title" id="linked-accounts" data-heading>{{ _('Linked Accounts') }}</h1>
      </div>
      <div class="section__body">
        <ul class="platform-list">
          <li class="platform-list__item">
            <div class="media">
              <div class="media__left medium">
                <span class="autherlist__icon icon icon-mail"></span>
              </div>
              <div class="media__body medium typo">
                <p>{{ _('Email Account') }}: {{ handler.user.mail }}</p>
              </div>
              <div class="media__right medium">
                <button type="button" class="rounded button" data-operation="change_mail">{{ _('Change') }}</button>
              </div>
            </div>
          </li>
          <form method="post">
            <input type="hidden" name="operation" value="unlink_account">
            {%- for relation in relations -%}{% if relation.platform != 'mail' %}
            {% set platform = handler.loginMethods.find(eval("r => r.id === '" + relation.platform + "'")) %}
            <li class="platform-list__item">
              <div class="media">
                {% if platform.icon %}
                  <div class="media__left medium">{{ platform.icon|safe }}</div>
                {% endif %}
                <div class="media__body medium typo">
                  <p>{{ platform.name }}: {{ relation.id }}</p>
                </div>
                <div class="media__right medium">
                  <button type="submit" name="platform" value="{{ relation.platform }}" class="rounded button">{{ _('Unlink') }}</button>
                </div>
              </div>
            </li>
            {%- endif -%}{%- endfor -%}
          </form>
          <form method="post">
            <input type="hidden" name="operation" value="link_account">
            {%- for method in handler.loginMethods -%}
              {%- if not relations.some(eval("r => r.platform === '" + method.id + "'")) -%}
              <li class="platform-list__item">
                <div class="media">
                  {% if method.icon %}
                    <div class="media__left medium">{{ method.icon|safe }}</div>
                  {% endif %}
                  <div class="media__body">
                    <p>{{ method.name }}</p>
                  </div>
                  <div class="media__right">
                    <button type="submit" name="platform" value="{{ method.id }}" class="rounded button">{{ _('Link') }}</button>
                  </div>
                  </div>
                </li>
              {%- endif -%}
            {%- endfor -%}
          </form>
        </ul>
      </div>
    </div>
  </div>
</div>
<div class="row nojs--hide">
  <div class="columns">
    <div class="section">
      <div class="section__header">
        <h1 class="section__title" id="authenticator" data-heading>{{ _('Authenticators') }}</h1>
        <div class="section__tools">
          <button class="primary rounded button" name="auth_enable"><span class="icon icon-wrench"></span> {{ _('Add Authenticator') }}</button>
        </div>
      </div>
      <div class="section__body">
        <ul class="autherlist">
          {%- if handler.user.tfa -%}
          <li class="autherlist__item">
            <div class="media">
              <div class="media__left medium">
                <span class="autherlist__icon icon icon-platform--mobile }}"></span>
              </div>
              <div class="media__body medium typo">
                <p>{{ _('Authenticator') }}: {{ _('Two Factor Authentication') }}</p>
              </div>
              <div class="media__right medium">
                <form method="POST">
                  <input type="hidden" name="operation" value="disable_tfa">
                  <input type="submit" value="{{ _('Remove') }}" class="rounded button">
                </form>
              </div>
            </div>
          </li>
          {%- endif -%}
          {%- for authenticator in authenticators -%}
          <li class="autherlist__item">
            <div class="media">
              <div class="media__left medium">
                <span class="autherlist__icon icon icon-{{ 'fingerprint' if authenticator.authenticatorAttachment === 'platform' else 'usb' }}"></span>
              </div>
              <div class="media__body medium typo">
                <p>{{ _('Authenticator') }}: {{ authenticator.name }} ({{ authenticator.credentialID.buffer.toString('base64')|truncate(6, end='') }})</p>
                <p>{{ _('Type') }}: {{ authenticator.credentialDeviceType }}:{{ authenticator.fmt }}</p>
                <p>{{ _('Registered at') }}: {{ datetimeSpan(authenticator.regat)|safe }}</p>
              </div>
              <div class="media__right medium">
                <form method="POST">
                  <input type="hidden" name="id" value="{{ authenticator.credentialID.buffer.toString('base64') }}">
                  <input type="hidden" name="operation" value="disable_authn">
                  <input type="submit" value="{{ _('Remove') }}" class="rounded button">
                </form>
              </div>
            </div>
          </li>
          {%- endfor -%}
        </ul>
      </div>
    </div>
  </div>
</div>
<div class="row">
  <div class="columns">
    <div class="section">
      <div class="section__header">
        <h1 class="section__title" id="session" data-heading>{{ _('Active Sessions') }}</h1>
      </div>
      <div class="section__body">
        <ul class="sessionlist">
          {%- for session in sessions -%}
          <li class="sessionlist__item">
            <div class="media">
              <div class="media__left medium">
                <span class="sessionlist__icon icon icon-platform--{{ platformIcon(session.updateUaInfo.os.name) }}"></span>
              </div>
              <div class="media__body medium typo">
                <p>{{ _('Last Update At') }}: {{ datetimeSpan(session.updateAt)|safe }}</p>
                {% if session.createHost %}
                  <p>{{ _('Hostname') }}: {{ session.createHost }}</p>
                {% endif %}
                <p>{{ _('Location') }}: {{ _(session.updateGeoip.display) }} ({{ session.updateIp }})</p>
                <p>{{ _('Operating System') }}: {{ session.updateUaInfo.os.name }} {{ session.updateUaInfo.os.version }}</p>
                <p>{{ _('Browser') }}: {{ session.updateUaInfo.browser.name }} {{ session.updateUaInfo.browser.version }}</p>
                {% if session.isCurrent %}
                <p class="sessionlist__current-session"><span class="icon icon-check"></span> {{ _('This is the current session') }}</p>
                {% endif %}
              </div>
              {% if not session.isCurrent %}
              <div class="media__right medium">
                <form method="post">
                  <input type="hidden" name="operation" value="delete_token">
                  <input type="hidden" name="tokenDigest" value="{{ session._id }}">
                  <input type="submit" value="{{ _('Logout This Session') }}" class="rounded button">
                </form>
              </div>
              {% endif %}
            </div>
          </li>
          {%- endfor -%}
        </ul>
      </div>
      <div class="section__body">
        <form method="post">
          <input type="hidden" name="operation" value="delete_all_tokens">
          <input type="submit" value="{{ _('Logout All Sessions') }}" class="primary rounded button">
        </form>
        {% if geoipProvider %}
        <div class="typo">
          <p><small>IP geo-location data is provided by {{ geoipProvider|safe }}.</small></p>
        </div>
        {% endif %}
      </div>
    </div>
    </div>
  </div>
</div>
{% endblock %}