starred/native
1
0
Fork 0
mirror of https://github.com/bulwarkmail/native.git synced 2026-11-03 00:06:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: manage filters and vacation of shared and group accounts

Browse Source 
The phone only ever read and wrote Sieve scripts and the vacation
responder of the user's own account, and the "Shared with me" list in
Account settings said to use the webmail for the rest. Port the
webmail's scoped settings (4c6c1aab) for these two panes:

- `api/sieve.ts` and `api/vacation.ts` take an optional account id and
  gate on the account's own `accountCapabilities` for
  `urn:ietf:params:jmap:sieve` and `urn:ietf:params:jmap:vacationresponse`,
  treating non-personal accounts as capable because Stalwart doesn't
  always advertise capabilities on them. Script blobs are uploaded and
  downloaded against the same account.
- Tapping a shared account in Account settings scopes Settings to it:
  only the Filters and Vacation Responder panes it supports are listed,
  behind a "Managing: <name>" banner that leads back to the own account.
  The scope is dropped when the signed-in account changes.
- The filter and vacation stores remember which account they hold,
  reset when it changes and drop replies for an account the user has
  already left, so one account's rules are never saved into another.
- The rule editor offers the managed account's folders as targets, and
  the "vacation active" banner only shows for the own account.
This commit is contained in:
Linus Rath
2026-09-24 19:01:24 +02:00
parent f63d739fb3
commit a86cd1d0eb
15 changed files with 797 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/settings/AccountSettings.tsx
+38 -13
View File
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
import { View, Text, StyleSheet, Pressable, Alert } from 'react-native';
import { useNavigation } from '@react-navigation/native';
import type { NativeStackNavigationProp } from '@react-navigation/native-stack';
import { ArrowDown, ArrowUp, Check, Plus, Star, Trash2, Users } from 'lucide-react-native';
import { ArrowDown, ArrowUp, Check, ChevronRight, Plus, Star, Trash2, Users } from 'lucide-react-native';
import { SettingsSection, SettingItem } from './settings-section';
import Button from '../Button';
import { spacing, radius, typography, type ThemePalette } from '../../theme/tokens';
@@ -10,6 +10,9 @@ import { useColors } from '../../theme/colors';
import { useAuthStore } from '../../stores/auth-store';
import { useAccountStore } from '../../stores/account-store';
import { useLocaleStore } from '../../stores/locale-store';
import { useManagedAccountStore } from '../../stores/managed-account-store';
import { setPendingSettingsTab } from '../../navigation/pending-settings-tab';
import { sharedAccountSettingsTabs } from '../../lib/capabilities';
import { jmapClient } from '../../api/jmap-client';
import { fetchMailQuota, type MailQuota } from '../../api/quota';
import { MAX_ACCOUNTS } from '../../lib/account-utils';
@@ -65,6 +68,14 @@ export function AccountSettings() {
const percent = quota && quota.total > 0 ? Math.min(100, Math.round((quota.used / quota.total) * 100)) : 0;
const sharedAccounts = session ? jmapClient.getSharedMailAccounts() : [];
const [busyId, setBusyId] = useState<string | null>(null);
const setManagedAccount = useManagedAccountStore((s) => s.setManagedAccount);
// Manage a shared/group account's filters and vacation responder: scope
// Settings to it and open its first pane (webmail: "Shared with me").
const manageShared = (account: { id: string; name: string }, firstTab: string) => {
setManagedAccount(account);
setPendingSettingsTab(firstTab);
};
const move = (id: string, delta: -1 | 1) => {
const ids = accounts.map((a) => a.id);
@@ -244,20 +255,34 @@ export function AccountSettings() {
{sharedAccounts.length > 0 && (
<SettingsSection
title={t('settings.account.shared_accounts.title', 'Shared with me')}
description={t('settings.account.shared_accounts.description_mobile', 'Group and shared accounts you can read through this account. Their filters and vacation responder are managed from the webmail.')}
description={t('settings.account.shared_accounts.description_manage', 'Group and shared accounts you can read through this account. Select one to manage its filters and vacation responder.')}
>
<View style={styles.list}>
{sharedAccounts.map((s, index) => (
<View key={s.id} style={[styles.row, index > 0 && styles.rowBorder]}>
<View style={[styles.avatar, { backgroundColor: c.muted }]}>
<Users size={14} color={c.mutedForeground} />
</View>
<View style={{ flex: 1 }}>
<Text style={styles.rowName} numberOfLines={1}>{s.name}</Text>
<Text style={styles.rowSub}>{t('settings.account.shared_accounts.shared_label', 'Shared account')}</Text>
</View>
</View>
))}
{sharedAccounts.map((s, index) => {
const firstTab = sharedAccountSettingsTabs(s.id)[0];
return (
<Pressable
key={s.id}
onPress={firstTab ? () => manageShared(s, firstTab) : undefined}
disabled={!firstTab}
accessibilityRole={firstTab ? 'button' : undefined}
style={({ pressed }) => [
styles.row,
index > 0 && styles.rowBorder,
pressed && firstTab && { backgroundColor: c.muted },
]}
>
<View style={[styles.avatar, { backgroundColor: c.muted }]}>
<Users size={14} color={c.mutedForeground} />
</View>
<View style={{ flex: 1 }}>
<Text style={styles.rowName} numberOfLines={1}>{s.name}</Text>
<Text style={styles.rowSub}>{t('settings.account.shared_accounts.shared_label', 'Shared account')}</Text>
</View>
{firstTab && <ChevronRight size={16} color={c.mutedForeground} />}
</Pressable>
);
})}
</View>
</SettingsSection>
)}
src/components/settings/FilterSettings.tsx
+40 -8
View File
@@ -12,6 +12,9 @@ import { useSettingsStore } from '../../stores/settings-store';
import { useFilterStore } from '../../stores/filter-store';
import { useVacationStore } from '../../stores/vacation-store';
import { useEmailStore } from '../../stores/email-store';
import { useManagedAccountStore } from '../../stores/managed-account-store';
import { getMailboxes } from '../../api/email';
import type { Mailbox } from '../../api/types';
import { ownMailboxes } from '../../lib/mailbox-tree';
import { useLocaleStore } from '../../stores/locale-store';
import { FilterRuleModal } from '../filters/FilterRuleModal';
@@ -106,15 +109,41 @@ export function FilterSettings({ onOpenVacation }: FilterSettingsProps = {}) {
const expandedView = useSettingsStore((s) => s.filtersExpandedView);
const updateSetting = useSettingsStore((s) => s.updateSetting);
// Sieve rules run on the user's own account, so only own folders are
// valid "file into" targets.
// Scoped to a shared/group account when Settings is managing one.
const managedAccountId = useManagedAccountStore((s) => s.managedAccountId);
// Rules run in the account whose filters they are, so only that account's
// folders are valid "file into" targets: the user's own, or the managed
// account's. Those are fetched here and presented as own folders, since the
// rule editor's folder tree leaves shared folders out (webmail does the same).
const allMailboxes = useEmailStore((s) => s.mailboxes);
const mailboxes = useMemo(() => ownMailboxes(allMailboxes), [allMailboxes]);
const vacationEnabled = useVacationStore((s) => s.isEnabled);
const [scopedMailboxes, setScopedMailboxes] = useState<Mailbox[]>([]);
useEffect(() => {
if (!managedAccountId) {
setScopedMailboxes([]);
return;
}
let cancelled = false;
getMailboxes(managedAccountId)
.then((list) => {
if (!cancelled) setScopedMailboxes(list.map((m) => ({ ...m, isShared: false })));
})
.catch(() => {
if (!cancelled) setScopedMailboxes([]);
});
return () => { cancelled = true; };
}, [managedAccountId]);
const mailboxes = useMemo(
() => (managedAccountId ? scopedMailboxes : ownMailboxes(allMailboxes)),
[managedAccountId, scopedMailboxes, allMailboxes],
);
// The responder the vacation store holds must be the user's own: the
// "active" banner is only about the own account's auto-reply.
const vacationEnabled = useVacationStore((s) => s.accountId === null && s.isEnabled);
const {
rules, isLoading, isSaving, error, isSupported, isOpaque, rawScript, vacationSettings,
fetchFilters, saveFilters, addRule, updateRule, deleteRule, reorderRules, toggleRule,
selectAccount, saveFilters, addRule, updateRule, deleteRule, reorderRules, toggleRule,
setOpaqueScript, resetToVisualBuilder, validateScript,
} = useFilterStore();
@@ -127,11 +156,14 @@ export function FilterSettings({ onOpenVacation }: FilterSettingsProps = {}) {
if (!hydrated) void hydrate();
}, [hydrated, hydrate]);
// Always name the account (null = own) so leaving a shared account never
// keeps showing, or saving into, its script.
useEffect(() => {
void fetchFilters();
}, [fetchFilters]);
void selectAccount(managedAccountId);
}, [managedAccountId, selectAccount]);
const showVacationBanner = (vacationEnabled || vacationSettings?.isEnabled) ?? false;
const showVacationBanner =
!managedAccountId && ((vacationEnabled || vacationSettings?.isEnabled) ?? false);
// Editable (Bulwark-managed) rules, in order, for reorder math.
const editableIds = useMemo(
src/components/settings/VacationSettings.tsx
+6 -2
View File
@@ -10,6 +10,7 @@ import RichTextEditor, { type RichTextEditorHandle } from '../RichTextEditor';
import { spacing, radius, typography, type ThemePalette } from '../../theme/tokens';
import { useColors } from '../../theme/colors';
import { useVacationStore } from '../../stores/vacation-store';
import { useManagedAccountStore } from '../../stores/managed-account-store';
import { useLocaleStore } from '../../stores/locale-store';
import { htmlToPlainText } from '../../lib/compose-html';
import { stripDangerousTags, escapeHtml } from '../../lib/email-html';
@@ -31,6 +32,8 @@ export function VacationSettings() {
const styles = React.useMemo(() => makeStyles(c), [c]);
const t = useLocaleStore((s) => s.t);
const store = useVacationStore();
// Scoped to a shared/group account when Settings is managing one.
const managedAccountId = useManagedAccountStore((s) => s.managedAccountId);
const [enabled, setEnabled] = useState(store.isEnabled);
const [fromDate, setFromDate] = useState(utcIsoToLocalInput(store.fromDate));
@@ -48,9 +51,10 @@ export function VacationSettings() {
// initial fetch itself failed (that's the only case that blanks the form).
const [fetchError, setFetchError] = useState<string | null>(null);
useEffect(() => {
void store.fetch().then(() => setFetchError(useVacationStore.getState().error));
void store.fetch(managedAccountId ?? undefined)
.then(() => setFetchError(useVacationStore.getState().error));
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
}, [managedAccountId]);
useEffect(() => {
if (!store.hasLoaded) return;