feat: hide calendar tasks in settings when the organisation turns them off

src/components/settings/CalendarSettings.tsx

@@ -7,6 +7,7 @@ import {
   type TimeFormat,
 } from '../../stores/settings-store';
 import { useLocaleStore } from '../../stores/locale-store';
+import { usePolicyFeature, useSettingLocked } from '../../stores/policy-store';
 import { AUTO_TIME_ZONE, getDeviceTimeZone, isValidTimeZone } from '../../lib/calendar-timezone';
 import { deviceSyncAvailable } from '../../device-sync/app/available';
 import { CALENDAR_AUTHORITY } from '../../device-sync/types';
@@ -49,6 +50,10 @@ export function CalendarSettings() {
   const birthdayCal = useSettingsStore((s) => s.showBirthdayCalendar);
   const tasksEnabled = useSettingsStore((s) => s.enableCalendarTasks);
   const showTasksOnCal = useSettingsStore((s) => s.showTasksOnCalendar);
+  // An organisation can turn tasks off: the option goes, as in the webmail
+  // (calendar-settings.tsx), and the policy pins it off.
+  const tasksAllowed = usePolicyFeature('calendarTasksEnabled');
+  const tasksLocked = useSettingLocked('enableCalendarTasks');
 
   // Android with the native module only (#34).
   const deviceSync = React.useMemo(() => deviceSyncAvailable(), []);
@@ -185,17 +190,20 @@ export function CalendarSettings() {
           />
         </SettingItem>
 
-        <SettingItem
-          label={t('calendar.settings.enable_tasks', 'Enable tasks')}
-          description={t('calendar.settings.enable_tasks_desc', 'Show a tasks view in the calendar for managing to-dos')}
-        >
-          <ToggleSwitch
-            checked={tasksEnabled}
-            onChange={(v) => update('enableCalendarTasks', v)}
-          />
-        </SettingItem>
+        {tasksAllowed && (
+          <SettingItem
+            label={t('calendar.settings.enable_tasks', 'Enable tasks')}
+            description={t('calendar.settings.enable_tasks_desc', 'Show a tasks view in the calendar for managing to-dos')}
+            locked={tasksLocked}
+          >
+            <ToggleSwitch
+              checked={tasksEnabled}
+              onChange={(v) => update('enableCalendarTasks', v)}
+            />
+          </SettingItem>
+        )}
 
-        {tasksEnabled && (
+        {tasksAllowed && tasksEnabled && (
           <SettingItem
             label={t('calendar.settings.show_tasks_on_calendar', 'Show tasks on calendar')}
             description={t(

src/components/settings/__tests__/org-policy-settings.test.ts

@@ -26,4 +26,12 @@ describe('organisation policy on the settings pages', () => {
     expect(page).toContain('disabled={themeLocked}');
     expect(page).toContain("{themeLocked && (");
   });
+
+  it('hides the tasks option when the organisation turns tasks off, and marks it locked', () => {
+    const page = settings('CalendarSettings');
+    expect(page).toContain("const tasksAllowed = usePolicyFeature('calendarTasksEnabled');");
+    expect(page).toContain("const tasksLocked = useSettingLocked('enableCalendarTasks');");
+    expect(page).toMatch(/\{tasksAllowed && \(\s*<SettingItem\s+label=\{t\('calendar\.settings\.enable_tasks'[\s\S]*?locked=\{tasksLocked\}/);
+    expect(page).toContain('{tasksAllowed && tasksEnabled && (');
+  });
 });