Server: Fixes #11910: Disable faulty dark theme to prevent published notes from being unreadable

packages/server/package.json

@@ -31,7 +31,6 @@
     "@types/uuid": "9.0.7",
     "bcryptjs": "2.4.3",
     "bulma": "1.0.2",
-    "bulma-prefers-dark": "0.1.0-beta.1",
     "compare-versions": "6.1.1",
     "dayjs": "1.11.12",
     "formidable": "2.1.2",

packages/server/src/routes/default.ts

@@ -19,7 +19,6 @@ interface PathToFileMap {
 // example if they are in node_modules, use the map below.
 const pathToFileMap: PathToFileMap = {
 	'css/bulma.min.css': 'node_modules/bulma/css/bulma.min.css',
-	'css/bulma-prefers-dark.min.css': 'node_modules/bulma-prefers-dark/css/bulma-prefers-dark.min.css',
 	'css/fontawesome/css/all.min.css': 'node_modules/@fortawesome/fontawesome-free/css/all.min.css',
 	'js/zxcvbn.js': 'node_modules/zxcvbn/dist/zxcvbn.js',
 	'js/zxcvbn.js.map': 'node_modules/zxcvbn/dist/zxcvbn.js.map',
@@ -49,6 +48,23 @@ async function findLocalFile(path: string): Promise<string> {
 	return localPath;
 }
 
+const patchFile = (path: string, fileContent: Buffer): Buffer => {
+	const patches: Record<string, (fileContent: Buffer)=> Buffer> = {
+		'css/bulma.min.css': fileContent => {
+			// We apply the patch here rather than with `yarn patch` because that would mean
+			// modifying a minified file, which is likely to break on each new update of Bulma. Dark
+			// theme is disabled mostly because we don't want it in published notes, which may have
+			// their own style inherited from clipped web pages. Having dark theme in the web UI is
+			// not that useful because it's not frequently accessed by users.
+			return Buffer.from(fileContent.toString().replace('prefers-color-scheme:dark', 'prefers-color-scheme:dark-disabled-by-patch'), 'utf-8');
+		},
+	};
+
+	if (patches[path]) return patches[path](fileContent);
+
+	return fileContent;
+};
+
 const router = new Router(RouteType.Web);
 
 router.public = true;
@@ -70,7 +86,8 @@ router.get('', async (path: SubPath, ctx: AppContext) => {
 	let mimeType: string = mime.fromFilename(localPath);
 	if (!mimeType) mimeType = 'application/octet-stream';
 
-	const fileContent: Buffer = await fs.readFile(localPath);
+	let fileContent: Buffer = await fs.readFile(localPath);
+	fileContent = patchFile(path.raw, fileContent);
 
 	const koaResponse = ctx.response;
 	koaResponse.body = fileContent;

yarn.lock

@@ -8841,7 +8841,6 @@ __metadata:
     "@types/zxcvbn": 4.4.5
     bcryptjs: 2.4.3
     bulma: 1.0.2
-    bulma-prefers-dark: 0.1.0-beta.1
     compare-versions: 6.1.1
     dayjs: 1.11.12
     formidable: 2.1.2
@@ -18081,13 +18080,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"bulma-prefers-dark@npm:0.1.0-beta.1":
-  version: 0.1.0-beta.1
-  resolution: "bulma-prefers-dark@npm:0.1.0-beta.1"
-  checksum: 26a88776a97ed0b57307a1aee60380a1b484ebd27d101c9995b5d220ff79fe909b060577c42c674c2863c52d4de85396c6f36031b3f7828386e21c1eda1e4445
-  languageName: node
-  linkType: hard
-
 "bulma@npm:1.0.2":
   version: 1.0.2
   resolution: "bulma@npm:1.0.2"