Differential D7833 Diff 26951 web/chat/edit-message-provider.js

Changeset View

Standalone View

web/chat/edit-message-provider.js

// @flow		// @flow

import invariant from 'invariant';		import invariant from 'invariant';
import * as React from 'react';		import * as React from 'react';

import ModalOverlay from 'lib/components/modal-overlay.react.js';		import ModalOverlay from 'lib/components/modal-overlay.react.js';
import type { ChatMessageInfoItem } from 'lib/selectors/chat-selectors.js';		import type { ChatMessageInfoItem } from 'lib/selectors/chat-selectors.js';
import type { ThreadInfo } from 'lib/types/thread-types';		import type { ThreadInfo } from 'lib/types/thread-types';

		export type ModalPosition = {
		+left: number,
		+top: number,
		+width: number,
		+height: number,
		};

export type EditState = {		export type EditState = {
+messageInfo: ChatMessageInfoItem,		+messageInfo: ChatMessageInfoItem,
+threadInfo: ThreadInfo,		+threadInfo: ThreadInfo,
+editedMessageDraft: ?string,		+editedMessageDraft: ?string,
+isError: boolean,		+isError: boolean,
		+position?: ModalPosition,
};		};

type EditModalContextType = {		type EditModalContextType = {
+renderEditModal: (params: EditState) => void,		+renderEditModal: (params: EditState) => void,
+clearEditModal: () => void,		+clearEditModal: () => void,
+editState: ?EditState,		+editState: ?EditState,
+setDraft: string => void,		+setDraft: string => void,
+setError: boolean => void,		+setError: boolean => void,
		+updatePosition: ModalPosition => void,
};		};

const EditModalContext: React.Context<EditModalContextType> =		const EditModalContext: React.Context<EditModalContextType> =
React.createContext<EditModalContextType>({		React.createContext<EditModalContextType>({
renderEditModal: () => {},		renderEditModal: () => {},
clearEditModal: () => {},		clearEditModal: () => {},
editState: null,		editState: null,
setDraft: () => {},		setDraft: () => {},
setError: () => {},		setError: () => {},
		updatePosition: () => {},
});		});

type Props = {		type Props = {
+children: React.Node,		+children: React.Node,
};		};
function EditModalProvider(props: Props): React.Node {		function EditModalProvider(props: Props): React.Node {
const { children } = props;		const { children } = props;

Show All 30 Lines	(isError: boolean) => {
invariant(editState, 'editState should be set in setError');		invariant(editState, 'editState should be set in setError');
setEditState({		setEditState({
...editState,		...editState,
isError,		isError,
});		});
},		},
[editState, setEditState],		[editState, setEditState],
);		);

		const updatePosition = React.useCallback(
		(position: ModalPosition) => {
		invariant(editState, 'editState should be set in updatePosition');
		setEditState({
		...editState,
		position,
		});
		},
		[editState, setEditState],
		);

const value = React.useMemo(		const value = React.useMemo(
() => ({		() => ({
renderEditModal,		renderEditModal,
clearEditModal: clearEditModal,		clearEditModal: clearEditModal,
editState,		editState,
setDraft,		setDraft,
setError,		setError,
		updatePosition,
}),		}),
[renderEditModal, clearEditModal, editState, setDraft, setError],		[
		renderEditModal,
		clearEditModal,
		editState,
		setDraft,
		setError,
		updatePosition,
		],
);		);

const modalOverlay = React.useMemo(() => {		const modalOverlay = React.useMemo(() => {
if (!modal) {		if (!modal) {
return null;		return null;
}		}
return <ModalOverlay onClose={clearEditModal}>{modal}</ModalOverlay>;		return <ModalOverlay onClose={clearEditModal}>{modal}</ModalOverlay>;
}, [clearEditModal, modal]);		}, [clearEditModal, modal]);
Show All 16 Lines