Files
flipper/desktop/static/setup.ts
ZHANG Qichuan 9a4d94c971 Add option for automatic dark theme (#2759)
Summary:
Add an setting option to allow automatic dark theme

A feature requested by swrobel https://github.com/facebook/flipper/issues/2708

## Changelog

### UI change
Replace the `Enable Dark Theme` Toggle button with a Radio group containing three Radio buttons.

The available options are `Dark`, `Light` and `Use System Default`, of which `Use System Default` is the default value

<img width="548" alt="Screenshot 2021-08-31 at 3 32 44 PM" src="https://user-images.githubusercontent.com/410850/131462798-4e74f757-41fc-4a3f-ba28-53d00fc1cf03.png">

### Data structure change

The `darkMode` property of [Settings](c0cd32564a/desktop/app/src/reducers/settings.tsx (L20)) is changed from `boolean` to `string`, the available values are `dark`, `light` and `auto`

Pull Request resolved: https://github.com/facebook/flipper/pull/2759

Test Plan:
### Test 1
- Step: Choose `Dark` in the Settings page and click on `Apply and Restart` button
- Expect: The application is displayed in Dark mode
### Test 2
- Step: Choose `Light` in the Settings page and click on `Apply and Restart` button
- Expect: The application is displayed in Light mode
### Test 3
- Step: Choose `Use System Default` in the Settings page and click on `Apply and Restart` button
- Expect: The application is displayed in System Default mode

Reviewed By: mweststrate

Differential Revision: D30666966

Pulled By: passy

fbshipit-source-id: a63e91f2d0dbff96890e267062cb75bffd0007f4
2021-09-08 03:28:35 -07:00

66 lines
1.5 KiB
TypeScript

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
import path from 'path';
import os from 'os';
import fs from 'fs';
export type Config = {
pluginPaths?: string[];
disabledPlugins?: string[];
lastWindowPosition?: {
x: number;
y: number;
width: number;
height: number;
};
updater?: boolean | undefined;
launcherMsg?: string | undefined;
updaterEnabled?: boolean;
launcherEnabled?: boolean;
darkMode: 'system' | 'light' | 'dark';
};
export default function setup(argv: any) {
// ensure .flipper folder and config exist
const flipperDir = path.join(os.homedir(), '.flipper');
if (!fs.existsSync(flipperDir)) {
fs.mkdirSync(flipperDir);
}
const configPath = path.join(flipperDir, 'config.json');
let config: Config = {
pluginPaths: [],
disabledPlugins: [],
darkMode: 'light',
};
try {
config = {
...config,
...JSON.parse(fs.readFileSync(configPath).toString()),
};
} catch (e) {
// file not readable or not parsable, overwrite it with the new config
console.warn(`Failed to read ${configPath}: ${e}`);
console.info('Writing new default config.');
fs.writeFileSync(configPath, JSON.stringify(config));
}
// Non-persistent CLI arguments.
config = {
...config,
updaterEnabled: argv.updater,
launcherEnabled: argv.launcher,
launcherMsg: argv.launcherMsg,
};
return {config, configPath};
}