feat: show background activity status

Ariver

2026-05-18 6a74e8e739c3d2db2db737b1ecb0117eb88a4129

 VoiceSnapGo/frontend/src/components/settings/PermissionsPage.svelte

@@ -10,7 +10,7 @@
    required: boolean
  }

  const permissionOrder = ['microphone', 'accessibility', 'inputMonitoring']
  const permissionOrder = ['microphone', 'accessibility', 'inputMonitoring', 'backgroundActivity']

  let statuses = $state<PermissionStatus[]>([])
  let loading = $state(true)
@@ -56,13 +56,15 @@
  }

  function stateText(item: PermissionStatus) {
    if (!item.required) return item.granted ? t('permissions.enabled') : t('permissions.disabled')
    if (item.granted) return t('permissions.granted')
    if (loading) return t('permissions.checking')
    return t('permissions.missing')
  }

  function allGranted() {
    return statuses.length > 0 && statuses.every(item => item.granted)
    const required = statuses.filter(item => item.required)
    return required.length > 0 && required.every(item => item.granted)
  }
</script>

@@ -95,7 +97,12 @@
        </div>
        <div class="permission-info">
          <div class="permission-heading">
            <span class="permission-title">{titleFor(item.id)}</span>
            <span class="permission-title">
              {titleFor(item.id)}
              {#if !item.required}
                <span class="optional-badge">{t('permissions.optional')}</span>
              {/if}
            </span>
            <span class="permission-state" class:granted={item.granted}>{stateText(item)}</span>
          </div>
          <p class="permission-desc">{descFor(item.id)}</p>
@@ -250,10 +257,22 @@
  }

  .permission-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-size-lg);
    font-weight: 650;
  }

  .optional-badge {
    border-radius: 999px;
    background: var(--color-bg-secondary);
    color: var(--color-secondary-label);
    font-size: var(--font-size-xs);
    font-weight: 600;
    padding: 2px 7px;
  }

  .permission-state {
    color: var(--color-red);
    font-size: var(--font-size-sm);