This repository has been archived by the owner on Jan 18, 2024. It is now read-only.
[configure-splash-screen] Refactor and integrate with @expo/config
#2297
[configure-splash-screen] feat: update CLI command and package.json w…
…ith new bin and main entries
- Loading branch information
commit aa090b537b39c3d4b80ffb772bfa54afb920f8d8
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,196 @@ | ||
| import { Command } from 'commander'; | ||
| import path from 'path'; | ||
|
|
||
| import configureAndroid from './android'; | ||
| import configureIos from './ios'; | ||
| import { | ||
| SplashScreenImageResizeMode, | ||
| SplashScreenStatusBarStyle, | ||
| Platform, | ||
| PlatformType, | ||
| } from './constants'; | ||
| import { AndroidSplashScreenJsonConfig, IosSplashScreenJsonConfig } from './types'; | ||
| import { validateEnumValue } from './validators'; | ||
|
|
||
| const AVAILABLE_OPTIONS_NAMES = [ | ||
| 'imageResizeMode', | ||
| 'platform', | ||
| 'backgroundColor', | ||
| 'imagePath', | ||
| 'darkModeBackgroundColor', | ||
| 'darkModeImagePath', | ||
| 'statusBarHidden', | ||
| 'statusBarStyle', | ||
| 'darkModeStatusBarStyle', | ||
| 'statusBarTranslucent', | ||
| 'statusBarBackgroundColor', | ||
| 'darkModeStatusBarBackgroundColor', | ||
| ] as const; | ||
|
|
||
| type CLIOptionName = typeof AVAILABLE_OPTIONS_NAMES[number]; | ||
|
|
||
| type CLIOptions = Partial<Record<CLIOptionName, string>>; | ||
|
There was a problem hiding this comment. Wouldn't type of |
||
|
|
||
| interface Configuration { | ||
| platform: PlatformType; | ||
| android: AndroidSplashScreenJsonConfig; | ||
| ios: IosSplashScreenJsonConfig; | ||
| } | ||
|
|
||
| async function action(configuration: Configuration) { | ||
| const { platform, android, ios } = configuration; | ||
| const rootDir = path.resolve(); | ||
bbarthec marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| switch (platform) { | ||
| case Platform.ANDROID: | ||
| await configureAndroid(rootDir, android); | ||
| break; | ||
| case Platform.IOS: | ||
| await configureIos(rootDir, ios); | ||
| break; | ||
| case Platform.ALL: | ||
| default: | ||
| await configureAndroid(rootDir, android); | ||
| await configureIos(rootDir, ios); | ||
| break; | ||
| } | ||
| } | ||
|
|
||
| function configurationFromOptions({ | ||
| platform, | ||
| imageResizeMode, | ||
| backgroundColor, | ||
| imagePath, | ||
| statusBarHidden, | ||
| statusBarStyle, | ||
| statusBarTranslucent, | ||
| statusBarBackgroundColor, | ||
| darkModeBackgroundColor, | ||
| darkModeImagePath, | ||
| darkModeStatusBarStyle, | ||
| darkModeStatusBarBackgroundColor, | ||
| }: CLIOptions): Configuration { | ||
| let resolvedPlatform: PlatformType = Platform.ALL; | ||
| try { | ||
| resolvedPlatform = (platform && validateEnumValue(platform, Platform)) || Platform.ALL; | ||
| } catch (e) { | ||
| throw new Error(`'platform': ${e.message}`); | ||
| } | ||
|
|
||
| if (!backgroundColor) { | ||
| throw new Error( | ||
| `'backgroundColor': Required option is not provided. Provide a valid color string.` | ||
| ); | ||
| } | ||
|
Comment on lines
+78
to
+82
There was a problem hiding this comment. I think recent releases of There was a problem hiding this comment. Yeah, it does, but I couldn't get this option covered by tests then 😞 Commander.js simply kills the process with exit code |
||
|
|
||
| const resolvedStatusBarHidden = | ||
| statusBarHidden === undefined ? undefined : Boolean(statusBarHidden); | ||
|
There was a problem hiding this comment. Passing Actually while writing this comment I had deja vu, so if we already talked about this then sorry |
||
| const resolvedStatusBarTranslucent = | ||
| statusBarTranslucent === undefined ? undefined : Boolean(statusBarTranslucent); | ||
|
|
||
| const genericConfig = { | ||
| imageResizeMode, | ||
| backgroundColor, | ||
| imagePath, | ||
| }; | ||
| const genericStatusBarConfig = { | ||
| hidden: resolvedStatusBarHidden, | ||
| style: statusBarStyle, | ||
| }; | ||
| const genericDarkModeConfig = { | ||
| backgroundColor: darkModeBackgroundColor, | ||
| imagePath: darkModeImagePath, | ||
| }; | ||
|
|
||
| const result: Configuration = { | ||
| platform: resolvedPlatform, | ||
| android: { | ||
| ...genericConfig, | ||
| statusBar: { | ||
| ...genericStatusBarConfig, | ||
| translucent: resolvedStatusBarTranslucent, | ||
| backgroundColor: statusBarBackgroundColor, | ||
| }, | ||
| darkMode: { | ||
| ...genericDarkModeConfig, | ||
| statusBar: { | ||
| style: darkModeStatusBarStyle, | ||
| backgroundColor: darkModeStatusBarBackgroundColor, | ||
| }, | ||
| }, | ||
| }, | ||
| ios: { | ||
| ...genericConfig, | ||
| statusBar: genericStatusBarConfig, | ||
| darkMode: genericDarkModeConfig, | ||
| }, | ||
| }; | ||
|
|
||
| return result; | ||
| } | ||
|
|
||
| function getAvailableOptions(o: object) { | ||
| return Object.values(o) | ||
| .map(v => `"${v}"`) | ||
| .join(' | '); | ||
| } | ||
|
|
||
| export default () => | ||
| new Command() | ||
| .description( | ||
| 'Idempotent operation that configures native splash screens using provided backgroundColor and optional .png file. Supports light and dark modes configuration. Dark mode is supported only on iOS 13+ and Android 10+.' | ||
bbarthec marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| ) | ||
| .allowUnknownOption(false) | ||
| .passCommandToAction(false) | ||
| .option( | ||
| '-p, --platform <platform>', | ||
| `Selected platform to configure. Available values: ${getAvailableOptions(Platform)}.` | ||
| ) | ||
| .option( | ||
| '-b, --background-color <color>', | ||
| `Valid css-formatted color (hex (#RRGGBB[AA]), rgb[a], hsl[a], named color (https://drafts.csswg.org/css-color/#named-colors)) that would be used as the background color for native splash screen view.` | ||
| ) | ||
| .option( | ||
| '-i, --image-path <path>', | ||
| 'Path to valid .png image that will be displayed in native splash screen.' | ||
| ) | ||
| .option( | ||
| '-r, --image-resize-mode <resizeMode>', | ||
| `ResizeMode to be used for native splash screen image. Available values: ${getAvailableOptions( | ||
| SplashScreenImageResizeMode | ||
| )} (only available for android platform)).` | ||
| ) | ||
| .option( | ||
| '--dark-mode-background-color <color>', | ||
| `Color (see 'background-color' supported formats) that would be used as the background color for native splash screen in dark mode.` | ||
| ) | ||
| .option( | ||
| '--dark-mode-image-path <path>', | ||
| 'Path to valid .png image that will be displayed in native splash screen in dark mode only.' | ||
| ) | ||
| .option( | ||
| '--status-bar-style <style>', | ||
| `Customizes the color of the StatusBar icons. Available values: ${getAvailableOptions( | ||
| SplashScreenStatusBarStyle | ||
| )}.` | ||
| ) | ||
| .option('--status-bar-hidden', `Hides the StatusBar.`) | ||
| .option( | ||
| '--status-bar-background-color <color>', | ||
| `(only for Android platform) Customizes the background color of the StatusBar. Accepts a valid color (see 'background-color' supported formats).` | ||
| ) | ||
| .option( | ||
| '--status-bar-translucent', | ||
| `(only for Android platform) Makes the StatusBar translucent (enables drawing under the StatusBar area).` | ||
| ) | ||
| .option( | ||
| '--dark-mode-status-bar-style <style>', | ||
| `(only for Android platform) The very same as 'statusbar-style' option, but applied only in dark mode. Available only if 'statusbar-style' is provided.` | ||
| ) | ||
| .option( | ||
| '--dark-mode-status-bar-background-color <color>', | ||
| `(only for Android platform) The very same as 'status-bar-background-color', but applied only in the dark mode. Available only if 'statusbar-style' is provided.` | ||
| ) | ||
| .action(async (options: CLIOptions) => { | ||
| const configuration = configurationFromOptions(options); | ||
| await action(configuration); | ||
| }); | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why this sophisticated
const AVAILABLE_OPTIONS_NAMESand then thistypeofinstead of a simple enum or a union type?