Page MenuHomePhorge
Files F32168512

D15037.1765054877.diff
No OneTemporary
Actions

Size
9 KB
Referenced Files
None
Subscribers
None

D15037.1765054877.diff
View Options

diff --git a/lib/shared/markdown.js b/lib/shared/markdown.js
--- a/lib/shared/markdown.js
+++ b/lib/shared/markdown.js
@@ -45,7 +45,7 @@
prevCapture: string,
) => ?Capture);
-export type ReactElement = React$Element<any>;
+export type ReactElement = React.MixedElement;
type ReactElements = React.Node;
export type Output<Result> = (node: ASTNode, state?: ?State) => Result;
diff --git a/native/account/logged-out-modal.react.js b/native/account/logged-out-modal.react.js
--- a/native/account/logged-out-modal.react.js
+++ b/native/account/logged-out-modal.react.js
@@ -439,7 +439,7 @@
return null;
}
- const signInButtons: Array<React.Element<any>> = [];
+ const signInButtons: Array<React.Node> = [];
if (!usingRestoreFlow) {
signInButtons.push(
<PromptButton
diff --git a/native/calendar/entry.react.js b/native/calendar/entry.react.js
--- a/native/calendar/entry.react.js
+++ b/native/calendar/entry.react.js
@@ -95,7 +95,7 @@
function dummyNodeForEntryHeightMeasurement(
entryText: string,
-): React.Element<typeof View> {
+): React.MixedElement {
const text = entryText === '' ? ' ' : entryText;
return (
<View style={[unboundStyles.entry, unboundStyles.textContainer]}>
diff --git a/native/chat/inline-engagement.react.js b/native/chat/inline-engagement.react.js
--- a/native/chat/inline-engagement.react.js
+++ b/native/chat/inline-engagement.react.js
@@ -35,7 +35,7 @@
sidebarInfo: ?ThreadInfo,
reactions: ReactionInfo,
deleted: boolean,
-): React.Element<typeof View> {
+): React.MixedElement {
return (
<View>
<DummyInlineEngagementNode
diff --git a/native/chat/inner-robotext-message.react.js b/native/chat/inner-robotext-message.react.js
--- a/native/chat/inner-robotext-message.react.js
+++ b/native/chat/inner-robotext-message.react.js
@@ -28,7 +28,7 @@
threadID: string,
sidebarInfo: ?ThreadInfo,
reactions: ReactionInfo,
-): React.Element<typeof View> {
+): React.MixedElement {
return (
<View>
<View style={unboundStyles.robotextContainer}>
diff --git a/native/chat/inner-text-message.react.js b/native/chat/inner-text-message.react.js
--- a/native/chat/inner-text-message.react.js
+++ b/native/chat/inner-text-message.react.js
@@ -32,7 +32,7 @@
sidebarInfo: ?ThreadInfo,
reactions: ReactionInfo,
deleted: boolean,
-): React.Element<typeof View> {
+): React.MixedElement {
return (
<View>
<DummyTextNode withoutMarkdown={deleted}>{text}</DummyTextNode>
diff --git a/native/chat/swipeable-message.react.js b/native/chat/swipeable-message.react.js
--- a/native/chat/swipeable-message.react.js
+++ b/native/chat/swipeable-message.react.js
@@ -1,6 +1,5 @@
// @flow
-import type { IconProps } from '@expo/vector-icons';
import * as Haptics from 'expo-haptics';
import * as React from 'react';
import { View } from 'react-native';
@@ -86,17 +85,16 @@
return interpolate(translateX, [0, 80, 120, 130], [0, 30, 120, 130]);
}
-type SwipeSnakeProps<IconGlyphs: string> = {
+type SwipeSnakeProps = {
+isViewer: boolean,
+translateX: SharedValue<number>,
+color: string,
- +children: React.Element<React.ComponentType<IconProps<IconGlyphs>>>,
+opacityInterpolator?: number => number, // must be worklet
+translateXInterpolator?: number => number, // must be worklet
+ +iconName: string,
+ +iconSize: number,
};
-function SwipeSnake<IconGlyphs: string>(
- props: SwipeSnakeProps<IconGlyphs>,
-): React.Node {
+function SwipeSnake(props: SwipeSnakeProps): React.Node {
const { translateX, isViewer, opacityInterpolator, translateXInterpolator } =
props;
const transformStyle = useAnimatedStyle(() => {
@@ -140,16 +138,13 @@
];
}, [iconAlign, screenWidth, color]);
- const { children } = props;
+ const { iconName, iconSize } = props;
const iconColor = tinycolor(color).isDark()
? colors.dark.listForegroundLabel
: colors.light.listForegroundLabel;
const coloredIcon = React.useMemo(
- () =>
- React.cloneElement(children, {
- color: iconColor,
- }),
- [children, iconColor],
+ () => <CommIcon name={iconName} size={iconSize} color={iconColor} />,
+ [iconName, iconSize, iconColor],
);
const swipeSnake = React.useMemo(
@@ -286,10 +281,6 @@
const threadColor = `#${props.threadColor}`;
const tinyThreadColor = tinycolor(threadColor);
- const replyIcon = React.useMemo(
- () => <CommIcon name="reply-filled" size={14} />,
- [],
- );
const replySwipeSnake = React.useMemo(
() => (
<SwipeSnake
@@ -302,17 +293,13 @@
: interpolateOpacityForNonViewerPrimarySnake
}
key="reply"
- >
- {replyIcon}
- </SwipeSnake>
+ iconName="reply-filled"
+ iconSize={14}
+ />
),
- [isViewer, replyIcon, threadColor, translateX],
+ [isViewer, threadColor, translateX],
);
- const sidebarIcon = React.useMemo(
- () => <CommIcon name="sidebar-filled" size={16} />,
- [],
- );
const sidebarSwipeSnakeWithReplySwipeSnake = React.useMemo(
() => (
<SwipeSnake
@@ -327,11 +314,11 @@
: interpolateTranslateXForNonViewerSecondarySnake
}
key="sidebar"
- >
- {sidebarIcon}
- </SwipeSnake>
+ iconName="sidebar-filled"
+ iconSize={16}
+ />
),
- [isViewer, sidebarIcon, tinyThreadColor, translateX],
+ [isViewer, tinyThreadColor, translateX],
);
const sidebarSwipeSnakeWithoutReplySwipeSnake = React.useMemo(
@@ -346,11 +333,11 @@
: interpolateOpacityForNonViewerPrimarySnake
}
key="sidebar"
- >
- {sidebarIcon}
- </SwipeSnake>
+ iconName="sidebar-filled"
+ iconSize={16}
+ />
),
- [isViewer, sidebarIcon, threadColor, translateX],
+ [isViewer, threadColor, translateX],
);
const panGestureHandler = React.useMemo(
diff --git a/native/components/node-height-measurer.react.js b/native/components/node-height-measurer.react.js
--- a/native/components/node-height-measurer.react.js
+++ b/native/components/node-height-measurer.react.js
@@ -50,7 +50,7 @@
// These are the dummies currently being rendered
currentlyMeasuring: $ReadOnlyArray<{
+measureKey: string,
- +dummy: React.Element<any>,
+ +dummy: React.MixedElement,
}>,
// When certain parameters change we need to remeasure everything. In order to
// avoid considering any onLayouts that got queued before we issued the
@@ -504,10 +504,11 @@
render(): React.Node {
const { currentlyMeasuring, iteration } = this.state;
const dummies = currentlyMeasuring.map(({ measureKey, dummy }) => {
- const { children } = dummy.props;
- const style = [dummy.props.style, styles.dummy];
+ const { children } = (dummy as any).props;
+ const style = [(dummy as any).props.style, styles.dummy];
const onLayout = (event: LayoutChangeEvent) =>
this.onDummyLayout(measureKey, iteration, event);
+ // $FlowFixMe[incompatible-call]
const node = React.cloneElement(dummy, {
style,
onLayout,
diff --git a/web/navigation-panels/navigation-panel.react.js b/web/navigation-panels/navigation-panel.react.js
--- a/web/navigation-panels/navigation-panel.react.js
+++ b/web/navigation-panels/navigation-panel.react.js
@@ -8,50 +8,61 @@
import type { AppState } from '../redux/redux-setup.js';
import { useSelector } from '../redux/redux-utils.js';
+type NavigationPanelContextType = {
+ +currentTab: ?string,
+ +css: { [key: string]: string },
+};
+
+const NavigationPanelContext = React.createContext<NavigationPanelContextType>({
+ currentTab: null,
+ css: {},
+});
+
type NavigationPanelItemProps = {
+tab: string,
+children: React.Node,
};
function NavigationPanelItem(props: NavigationPanelItemProps): React.Node {
- const { children } = props;
- return children;
+ const { children, tab } = props;
+ const { currentTab, css } = React.useContext(NavigationPanelContext);
+ return (
+ <div
+ className={classNames({
+ [css.current_tab]: currentTab === tab,
+ })}
+ >
+ {children}
+ </div>
+ );
}
-type NavigationPanelContainerProps<T> = {
+type NavigationPanelContainerProps<T: ?string> = {
+tabSelector: AppState => T,
- +children: React.ChildrenArray<?React.Element<typeof NavigationPanelItem>>,
+ +children: React.ChildrenArray<?React.MixedElement>,
+horizontal?: boolean,
};
-function NavigationPanelContainer<T>(
+function NavigationPanelContainer<T: ?string>(
props: NavigationPanelContainerProps<T>,
): React.Node {
const { children, tabSelector, horizontal = false } = props;
const currentTab = useSelector(tabSelector);
const css = horizontal ? horizontalCSS : verticalCSS;
- const items = React.useMemo(
- () =>
- React.Children.map(children, child => {
- if (!child) {
- return null;
- }
- return (
- <div
- key={child.props.tab}
- className={classNames({
- [css.current_tab]: currentTab === child.props.tab,
- })}
- >
- {child}
- </div>
- );
- }),
- [children, css.current_tab, currentTab],
+ const navigationPanelContextValue = React.useMemo(
+ () => ({
+ currentTab,
+ css,
+ }),
+ [css, currentTab],
);
- return <div className={css.navigationPanelContainer}>{items}</div>;
+ return (
+ <NavigationPanelContext.Provider value={navigationPanelContextValue}>
+ <div className={css.navigationPanelContainer}>{children}</div>
+ </NavigationPanelContext.Provider>
+ );
}
const NavigationPanel = {

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 6, 9:01 PM (15 h, 52 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5840830
Default Alt Text
D15037.1765054877.diff (9 KB)

Event Timeline