Implement new model, hooks and reconcilation code for new GYU notification settings (#11089)

* Define new notification settings model

* Add new hooks

* make ts-strict happy

* add unit tests

* chore: make eslint/prettier happier :)

* make ts-strict happier

* Update src/notifications/NotificationUtils.ts

Co-authored-by: Robin <robin@robin.town>

* Add tests for hooks

* chore: fixed lint issues

* Add comments

---------

Co-authored-by: Robin <robin@robin.town>

src/hooks/useAsyncRefreshMemo.ts

@@ -0,0 +1,48 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { DependencyList, useCallback, useEffect, useState } from "react";
+
+type Fn<T> = () => Promise<T>;
+
+/**
+ * Works just like useMemo or our own useAsyncMemo, but additionally exposes a method to refresh the cached value
+ * as if the dependency had changed
+ * @param fn function to memoize
+ * @param deps React hooks dependencies for the function
+ * @param initialValue initial value
+ * @return tuple of cached value and refresh callback
+ */
+export function useAsyncRefreshMemo<T>(fn: Fn<T>, deps: DependencyList, initialValue: T): [T, () => void];
+export function useAsyncRefreshMemo<T>(fn: Fn<T>, deps: DependencyList, initialValue?: T): [T | undefined, () => void];
+export function useAsyncRefreshMemo<T>(fn: Fn<T>, deps: DependencyList, initialValue?: T): [T | undefined, () => void] {
+    const [value, setValue] = useState<T | undefined>(initialValue);
+    const refresh = useCallback(() => {
+        let discard = false;
+        fn()
+            .then((v) => {
+                if (!discard) {
+                    setValue(v);
+                }
+            })
+            .catch((err) => console.error(err));
+        return () => {
+            discard = true;
+        };
+    }, deps); // eslint-disable-line react-hooks/exhaustive-deps
+    useEffect(refresh, [refresh]);
+    return [value, refresh];
+}

src/hooks/useNotificationSettings.tsx

@@ -0,0 +1,81 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { IPushRules, MatrixClient } from "matrix-js-sdk/src/matrix";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+
+import { NotificationSettings } from "../models/notificationsettings/NotificationSettings";
+import { PushRuleDiff } from "../models/notificationsettings/PushRuleDiff";
+import { reconcileNotificationSettings } from "../models/notificationsettings/reconcileNotificationSettings";
+import { toNotificationSettings } from "../models/notificationsettings/toNotificationSettings";
+
+async function applyChanges(cli: MatrixClient, changes: PushRuleDiff): Promise<void> {
+    await Promise.all(changes.deleted.map((change) => cli.deletePushRule("global", change.kind, change.rule_id)));
+    await Promise.all(changes.added.map((change) => cli.addPushRule("global", change.kind, change.rule_id, change)));
+    await Promise.all(
+        changes.updated.map(async (change) => {
+            if (change.enabled !== undefined) {
+                await cli.setPushRuleEnabled("global", change.kind, change.rule_id, change.enabled);
+            }
+            if (change.actions !== undefined) {
+                await cli.setPushRuleActions("global", change.kind, change.rule_id, change.actions);
+            }
+        }),
+    );
+}
+
+type UseNotificationSettings = {
+    model: NotificationSettings | null;
+    hasPendingChanges: boolean;
+    reconcile: (model: NotificationSettings) => void;
+};
+
+export function useNotificationSettings(cli: MatrixClient): UseNotificationSettings {
+    const supportsIntentionalMentions = useMemo(() => cli.supportsIntentionalMentions(), [cli]);
+
+    const pushRules = useRef<IPushRules | null>(null);
+    const [model, setModel] = useState<NotificationSettings | null>(null);
+    const [hasPendingChanges, setPendingChanges] = useState<boolean>(false);
+    const updatePushRules = useCallback(async () => {
+        const rules = await cli.getPushRules();
+        const model = toNotificationSettings(rules, supportsIntentionalMentions);
+        const pendingChanges = reconcileNotificationSettings(rules, model, supportsIntentionalMentions);
+        pushRules.current = rules;
+        setPendingChanges(
+            pendingChanges.updated.length > 0 || pendingChanges.added.length > 0 || pendingChanges.deleted.length > 0,
+        );
+        setModel(model);
+    }, [cli, supportsIntentionalMentions]);
+
+    useEffect(() => {
+        updatePushRules().catch((err) => console.error(err));
+    }, [cli, updatePushRules]);
+
+    const reconcile = useCallback(
+        (model: NotificationSettings) => {
+            if (pushRules.current !== null) {
+                setModel(model);
+                const changes = reconcileNotificationSettings(pushRules.current, model, supportsIntentionalMentions);
+                applyChanges(cli, changes)
+                    .then(updatePushRules)
+                    .catch((err) => console.error(err));
+            }
+        },
+        [cli, updatePushRules, supportsIntentionalMentions],
+    );
+
+    return { model, hasPendingChanges, reconcile };
+}

src/hooks/usePushers.ts

@@ -0,0 +1,23 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { IPusher, MatrixClient } from "matrix-js-sdk/src/matrix";
+
+import { useAsyncRefreshMemo } from "./useAsyncRefreshMemo";
+
+export function usePushers(client: MatrixClient): [IPusher[], () => void] {
+    return useAsyncRefreshMemo<IPusher[]>(() => client.getPushers().then((it) => it.pushers), [client], []);
+}

src/hooks/useThreepids.ts

@@ -0,0 +1,24 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { MatrixClient } from "matrix-js-sdk/src/matrix";
+import { IThreepid } from "matrix-js-sdk/src/@types/threepids";
+
+import { useAsyncRefreshMemo } from "./useAsyncRefreshMemo";
+
+export function useThreepids(client: MatrixClient): [IThreepid[], () => void] {
+    return useAsyncRefreshMemo<IThreepid[]>(() => client.getThreePids().then((it) => it.threepids), [client], []);
+}