Conversation list model

packages/tutanota-utils/lib/Utils.ts

@@ -1,4 +1,5 @@
 import { TypeRef } from "./TypeRef.js"
+import { arrayEquals } from "./ArrayUtils.js"
 
 export interface ErrorInfo {
 	readonly name: string | null
@@ -217,19 +218,21 @@ export function makeSingleUse<T>(fn: Callback<T>): Callback<T> {
  * If the cached argument has changed then {@param fn} will be called with new argument and result will be cached again.
  * Only remembers the last argument.
  */
-export function memoized<T, R>(fn: (arg0: T) => R): (arg0: T) => R {
-	let lastArg: T
-	let lastResult: R
+export function memoized<F extends (...args: any[]) => any>(fn: F): F {
+	let lastArgs: unknown[]
+	let lastResult: Parameters<F>
 	let didCache = false
-	return (arg) => {
-		if (!didCache || arg !== lastArg) {
-			lastArg = arg
+
+	const memoizedFunction = (...args: Parameters<F>) => {
+		if (!didCache || !arrayEquals(lastArgs, args)) {
+			lastArgs = args
 			didCache = true
-			lastResult = fn(arg)
+			lastResult = fn(...args)
 		}
 
 		return lastResult
 	}
+	return memoizedFunction as F
 }
 
 /**

packages/tutanota-utils/test/UtilsTest.ts

@@ -1,6 +1,8 @@
 import o from "@tutao/otest"
-import { clone, deepEqual, getChangedProps } from "../lib/Utils.js"
+import { clone, deepEqual, getChangedProps, memoized } from "../lib/Utils.js"
 import { arrayEquals } from "../lib/index.js"
+import { func, matchers, when } from "testdouble"
+import { verify } from "@tutao/tutanota-test-utils"
 
 o.spec("utils", function () {
 	o("deep clone an instance", function () {
@@ -142,4 +144,46 @@ o.spec("utils", function () {
 		o(getChangedProps(undefined, undefined)).deepEquals([])
 		o(getChangedProps(null, null)).deepEquals([])
 	})
+
+	o.spec("memoized", function () {
+		o.test("when called twice with the same argument it is called once", function () {
+			const fnToMemoize = func<(_: number) => number>()
+			when(fnToMemoize(matchers.anything())).thenReturn(42)
+			const memoizedFn = memoized(fnToMemoize)
+			o(memoizedFn(1)).equals(42)
+			o(memoizedFn(1)).equals(42)
+			verify(fnToMemoize(matchers.anything()), { times: 1 })
+		})
+
+		o.test("when called twice with the different arguments it is called twice", function () {
+			const fnToMemoize = func<(_: number) => number>()
+			when(fnToMemoize(1)).thenReturn(11)
+			when(fnToMemoize(2)).thenReturn(12)
+			const memoizedFn = memoized(fnToMemoize)
+			o(memoizedFn(1)).equals(11)
+			o(memoizedFn(2)).equals(12)
+			verify(fnToMemoize(1), { times: 1 })
+			verify(fnToMemoize(2), { times: 1 })
+		})
+
+		o.test("when called twice with the same arguments it is called once", function () {
+			const fnToMemoize = func<(l: number, r: number) => number>()
+			when(fnToMemoize(matchers.anything(), matchers.anything())).thenReturn(42)
+			const memoizedFn = memoized(fnToMemoize)
+			o(memoizedFn(1, 2)).equals(42)
+			o(memoizedFn(1, 2)).equals(42)
+			verify(fnToMemoize(matchers.anything(), matchers.anything()), { times: 1 })
+		})
+
+		o.test("when called twice with different arguments it is called twice", function () {
+			const fnToMemoize = func<(l: number, r: number) => number>()
+			when(fnToMemoize(1, 1)).thenReturn(11)
+			when(fnToMemoize(1, 2)).thenReturn(12)
+			const memoizedFn = memoized(fnToMemoize)
+			o(memoizedFn(1, 1)).equals(11)
+			o(memoizedFn(1, 2)).equals(12)
+			verify(fnToMemoize(1, 1), { times: 1 })
+			verify(fnToMemoize(1, 2), { times: 1 })
+		})
+	})
 })

src/common/misc/DeviceConfig.ts

@@ -22,6 +22,10 @@ export enum ListAutoSelectBehavior {
 	OLDER,
 	NEWER,
 }
+export const enum MailListDisplayMode {
+	CONVERSATIONS = "conversations",
+	MAILS = "mails",
+}
 
 export type LastExternalCalendarSyncEntry = {
 	lastSuccessfulSync: number | undefined | null
@@ -53,6 +57,7 @@ interface ConfigObject {
 	_testAssignments: PersistedAssignmentData | null
 	offlineTimeRangeDaysByUser: Record<Id, number>
 	conversationViewShowOnlySelectedMail: boolean
+	mailListDisplayMode: MailListDisplayMode
 	/** Stores each users' definition about contact synchronization */
 	syncContactsWithPhonePreference: Record<Id, boolean>
 	/** Whether mobile calendar navigation is in the "per week" or "per month" mode */
@@ -87,13 +92,13 @@ interface ConfigObject {
  * Device config for internal user auto login. Only one config per device is stored.
  */
 export class DeviceConfig implements UsageTestStorage, NewsItemStorage {
-	public static Version = 4
-	public static LocalStorageKey = "tutanotaConfig"
+	public static readonly Version = 5
+	public static readonly LocalStorageKey = "tutanotaConfig"
 
 	private config!: ConfigObject
 	private lastSyncStream: Stream<Map<Id, LastExternalCalendarSyncEntry>> = stream(new Map())
 
-	constructor(private readonly _version: number, private readonly localStorage: Storage | null) {
+	constructor(private readonly localStorage: Storage | null) {
 		this.init()
 	}
 
@@ -134,6 +139,7 @@ export class DeviceConfig implements UsageTestStorage, NewsItemStorage {
 			_signupToken: signupToken,
 			offlineTimeRangeDaysByUser: loadedConfig.offlineTimeRangeDaysByUser ?? {},
 			conversationViewShowOnlySelectedMail: loadedConfig.conversationViewShowOnlySelectedMail ?? false,
+			mailListDisplayMode: loadedConfig.mailListDisplayMode ?? MailListDisplayMode.CONVERSATIONS,
 			syncContactsWithPhonePreference: loadedConfig.syncContactsWithPhonePreference ?? {},
 			isCalendarDaySelectorExpanded: loadedConfig.isCalendarDaySelectorExpanded ?? false,
 			mailAutoSelectBehavior: loadedConfig.mailAutoSelectBehavior ?? (isApp() ? ListAutoSelectBehavior.NONE : ListAutoSelectBehavior.OLDER),
@@ -398,6 +404,15 @@ export class DeviceConfig implements UsageTestStorage, NewsItemStorage {
 		this.writeToStorage()
 	}
 
+	getMailListDisplayMode(): MailListDisplayMode {
+		return this.config.mailListDisplayMode
+	}
+
+	setMailListDisplayMode(setting: MailListDisplayMode) {
+		this.config.mailListDisplayMode = setting
+		this.writeToStorage()
+	}
+
 	getUserSyncContactsWithPhonePreference(id: Id): boolean | null {
 		return this.config.syncContactsWithPhonePreference[id] ?? null
 	}
@@ -510,6 +525,12 @@ export function migrateConfig(loadedConfig: any) {
 	if (loadedConfig._version < 3) {
 		migrateConfigV2to3(loadedConfig)
 	}
+
+	// version 4 had no migration
+
+	if (loadedConfig._version < 5) {
+		loadedConfig.mailListDisplayMode = MailListDisplayMode.MAILS
+	}
 }
 
 /**
@@ -558,4 +579,4 @@ export interface DeviceConfigCredentials {
 	readonly encryptedPassphraseKey: Base64 | null
 }
 
-export const deviceConfig: DeviceConfig = new DeviceConfig(DeviceConfig.Version, client.localStorage() ? localStorage : null)
+export const deviceConfig: DeviceConfig = new DeviceConfig(client.localStorage() ? localStorage : null)

src/common/misc/ListModel.ts

@@ -62,7 +62,7 @@ type PrivateListState<ItemType> = Omit<ListState<ItemType>, "items" | "activeInd
 export class ListModel<ItemType, IdType> {
 	constructor(private readonly config: ListModelConfig<ItemType, IdType>) {}
 
-	private loadState: "created" | "initialized" = "created"
+	private initialLoading: Promise<unknown> | null = null
 	private loading: Promise<unknown> = Promise.resolve()
 	private filter: ListFilter<ItemType> | null = null
 	private rangeSelectionAnchorItem: ItemType | null = null
@@ -115,7 +115,7 @@ export class ListModel<ItemType, IdType> {
 	private waitUtilInit(): Promise<unknown> {
 		const deferred = defer()
 		const subscription = this.rawStateStream.map(() => {
-			if (this.loadState === "initialized") {
+			if (this.initialLoading != null) {
 				Promise.resolve().then(() => {
 					subscription.end(true)
 					deferred.resolve(undefined)
@@ -126,25 +126,25 @@ export class ListModel<ItemType, IdType> {
 	}
 
 	async loadInitial() {
-		if (this.loadState !== "created") {
-			return
+		// execute the loading only once
+		if (this.initialLoading == null) {
+			this.initialLoading = this.doLoad()
 		}
-		this.loadState = "initialized"
-		await this.doLoad()
+		await this.initialLoading
 	}
 
 	async loadMore() {
 		if (this.rawState.loadingStatus === ListLoadingState.Loading) {
 			return this.loading
 		}
-		if (this.loadState !== "initialized" || this.rawState.loadingStatus !== ListLoadingState.Idle) {
+		if (this.initialLoading == null || this.rawState.loadingStatus !== ListLoadingState.Idle) {
 			return
 		}
 		await this.doLoad()
 	}
 
 	async retryLoading() {
-		if (this.loadState !== "initialized" || this.rawState.loadingStatus !== ListLoadingState.ConnectionLost) {
+		if (this.initialLoading == null || this.rawState.loadingStatus !== ListLoadingState.ConnectionLost) {
 			return
 		}
 		await this.doLoad()
@@ -574,6 +574,8 @@ export class ListModel<ItemType, IdType> {
 
 	canInsertItem(entity: ItemType): boolean {
 		if (this.state.loadingStatus === ListLoadingState.Done) {
+			// If the entire list is loaded, it is always safe to add items, because we can assume we have the entire
+			// range loaded
 			return true
 		}
 

src/common/misc/TranslationKey.ts

@@ -1889,6 +1889,10 @@ export type TranslationKeyType =
 	| "yourMessage_label"
 	| "you_label"
 	| "emptyString_msg"
+	| "mailListGrouping_label"
+	| "mailListGroupingDontGroup_label"
+	| "mailListGroupingGroupByConversation_label"
+	| "mailListGroupingHelp_msg"
 	// Put in temporarily, will be removed soon
 	| "localAdminGroup_label"
 	| "assignAdminRightsToLocallyAdministratedUserError_msg"

src/common/settings/EditNotificationEmailDialog.ts

@@ -163,7 +163,7 @@ export function show(existingTemplate: NotificationMailTemplate | null, customer
 		m.redraw()
 	})
 	// Even though savedHtml is always sanitized changing it might lead to mXSS
-	const sanitizePreview = memoized<string, string>((html) => {
+	const sanitizePreview = memoized<(html: string) => string>((html) => {
 		return htmlSanitizer.sanitizeHTML(html).html
 	})