From 7f1c25793a9f9f63caccb1282db489ff051a74ec Mon Sep 17 00:00:00 2001
From: Laurent Cozic <laurent@cozic.net>
Date: Tue, 14 Jul 2020 19:17:25 +0000
Subject: [PATCH] Desktop: Fixes #3449: Fixed style caching

---
 .../NoteBody/CodeMirror/styles/index.ts       |  2 +-
 ReactNativeClient/lib/theme.js                | 20 +++++++++++++++----
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/styles/index.ts b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/styles/index.ts
index 3557f0c5d..4f6390674 100644
--- a/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/styles/index.ts
+++ b/ElectronClient/gui/NoteEditor/NoteBody/CodeMirror/styles/index.ts
@@ -2,7 +2,7 @@ import { NoteBodyEditorProps } from '../../../utils/types';
 const { buildStyle } = require('lib/theme');
 
 export default function styles(props: NoteBodyEditorProps) {
-	return buildStyle('AceEditor', props.theme, (theme: any) => {
+	return buildStyle('CodeMirror', props.theme, (theme: any) => {
 		return {
 			root: {
 				position: 'relative',
diff --git a/ReactNativeClient/lib/theme.js b/ReactNativeClient/lib/theme.js
index 05b611feb..8a4805399 100644
--- a/ReactNativeClient/lib/theme.js
+++ b/ReactNativeClient/lib/theme.js
@@ -336,19 +336,31 @@ function themeStyle(theme) {
 	return themeCache_[cacheKey];
 }
 
-const cachedStyles_ = {};
+const cachedStyles_ = {
+	themeId: null,
+	styles: {},
+};
 
+// cacheKey must be a globally unique key, and must change whenever
+// the dependencies of the style change. If the style depends only
+// on the theme, a static string can be provided as a cache key.
 function buildStyle(cacheKey, themeId, callback) {
-	if (cachedStyles_[cacheKey]) cachedStyles_[cacheKey].style;
+	// We clear the cache whenever switching themes
+	if (cachedStyles_.themeId !== themeId) {
+		cachedStyles_.themeId = themeId;
+		cachedStyles_.styles = {};
+	}
+
+	if (cachedStyles_.styles[cacheKey]) return cachedStyles_.styles[cacheKey].style;
 
 	const s = callback(themeStyle(themeId));
 
-	cachedStyles_[cacheKey] = {
+	cachedStyles_.styles[cacheKey] = {
 		style: s,
 		timestamp: Date.now(),
 	};
 
-	return cachedStyles_[cacheKey].style;
+	return cachedStyles_.styles[cacheKey].style;
 }
 
 module.exports = { themeStyle, buildStyle, themeById };