Page MenuHomePhorge
Files F32507369

D7321.1767041735.diff
No OneTemporary
Actions

Size
2 KB
Referenced Files
None
Subscribers
None

D7321.1767041735.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
Mon, Dec 29, 8:55 PM (15 h, 29 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5865858
Default Alt Text
D7321.1767041735.diff (2 KB)

Event Timeline