Page MenuHomePhabricator
Files F3383258

D7321.diff
No OneTemporary
Actions

D7321.diff
View Options

diff --git a/native/components/color-rows.react.js b/native/components/color-rows.react.js
--- a/native/components/color-rows.react.js
+++ b/native/components/color-rows.react.js
@@ -11,10 +11,11 @@
type Props = {
+pendingColor: string,
+setPendingColor: SetState<string>,
+ +outerRingSelectedColor?: string,
};
function ColorRows(props: Props): React.Node {
- const { pendingColor, setPendingColor } = props;
+ const { pendingColor, setPendingColor, outerRingSelectedColor } = props;
const colorSelectorButtons = React.useMemo(
() =>
@@ -24,9 +25,10 @@
color={color}
pendingColor={pendingColor}
setPendingColor={setPendingColor}
+ outerRingSelectedColor={outerRingSelectedColor}
/>
)),
- [pendingColor, setPendingColor],
+ [outerRingSelectedColor, pendingColor, setPendingColor],
);
const firstRow = React.useMemo(
diff --git a/native/components/color-selector-button.react.js b/native/components/color-selector-button.react.js
--- a/native/components/color-selector-button.react.js
+++ b/native/components/color-selector-button.react.js
@@ -12,22 +12,33 @@
+color: string,
+pendingColor: string,
+setPendingColor: SetState<string>,
+ +outerRingSelectedColor?: string,
};
function ColorSelectorButton(props: ColorSelectorButtonProps): React.Node {
- const { color, pendingColor, setPendingColor } = props;
+ const { color, pendingColor, setPendingColor, outerRingSelectedColor } =
+ props;
const styles = useStyles(unboundStyles);
const colorSplotchStyle = React.useMemo(() => {
return [styles.button, { backgroundColor: `#${color}` }];
}, [color, styles.button]);
+ const outerRingSelectedStyle = React.useMemo(() => {
+ const result = [styles.outerRingSelected];
+ if (outerRingSelectedColor) {
+ result.push({ backgroundColor: `#${outerRingSelectedColor}` });
+ }
+
+ return result;
+ }, [outerRingSelectedColor, styles.outerRingSelected]);
+
const onPendingColorSelected = React.useCallback(() => {
setPendingColor(color);
}, [setPendingColor, color]);
const isSelected = tinycolor.equals(pendingColor, color);
return (
- <View style={isSelected ? styles.outerRingSelected : styles.outerRing}>
+ <View style={isSelected ? outerRingSelectedStyle : styles.outerRing}>
<TouchableOpacity
style={colorSplotchStyle}
onPress={onPendingColorSelected}

File Metadata

Mime Type
text/plain
Expires
Fri, Nov 29, 2:34 PM (21 h, 33 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2597263
Default Alt Text
D7321.diff (2 KB)

Event Timeline