webui/components/settings/backup/self-update.html

<html>
  <head>
    <title>Self Update</title>
    <script type="module">
      import { store } from "/components/settings/external/self-update-store.js";
    </script>
  </head>

  <body>
    <div x-data="{ get settings() { return $store.settings.settings } }">
      <template x-if="settings">
        <div>
        <div class="section-title"
             :class="{'settings-update-title-attention': $store.settings.hasUpdateAttention}">
          Self Update
        </div>
        <div class="section-description">
          Update Agent Zero deliberately, with a backup path available before anything changes.
        </div>

        <div class="settings-update-card"
             :class="{'settings-update-card-attention': $store.settings.hasUpdateAttention}">
          <div class="settings-update-card-icon" aria-hidden="true">
            <x-icon
                  :name="$store.settings.hasUpdateAttention ? 'release_alert' : 'system_update_alt'"></x-icon>
          </div>
          <div class="settings-update-card-copy">
            <div class="settings-update-card-title" x-text="$store.settings.updateAttentionTitle"></div>
            <div class="settings-update-card-message" x-text="$store.settings.updateAttentionMessage"></div>
            <template x-if="!$store.settings.additional?.is_dockerized">
              <div class="settings-update-card-message">
                Self-update is currently available only in dockerized installs.
              </div>
            </template>
            <div class="settings-update-card-meta">
              <span class="settings-update-card-badge" x-text="$store.settings.updateAttentionLabel"></span>
            </div>
          </div>
          <div class="settings-update-card-actions">
            <button
              class="btn btn-field"
              @click="$store.selfUpdateStore.openModal()"
              :disabled="!$store.settings.additional?.is_dockerized"
            >
              Review Update
            </button>
          </div>
        </div>

        <div class="field">
          <div class="field-label">
            <div class="field-title">Update notifications</div>
            <div class="field-description">
              Check for newer releases quietly. Toasts are intentionally rate-limited; the update status here stays visible.
            </div>
          </div>
          <div class="field-control">
            <label class="toggle">
              <input type="checkbox" x-model="settings.update_check_enabled" />
              <span class="toggler"></span>
            </label>
          </div>
        </div>
        </div>
      </template>
    </div>
  </body>
</html>