Skip to content

Commit

Permalink
fix: out-of-date click handler
Browse files Browse the repository at this point in the history
  • Loading branch information
ealush committed Aug 29, 2020
1 parent 058fa06 commit 2e19179
Show file tree
Hide file tree
Showing 8 changed files with 16 additions and 16 deletions.
2 changes: 1 addition & 1 deletion dist/index.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/index.js.map

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "emoji-picker-react",
"version": "3.2.2",
"version": "3.2.3",
"description": "Emoji picker component for react applications",
"main": "dist/index.js",
"typings": "emoji-picker-react.d.ts",
Expand Down
2 changes: 1 addition & 1 deletion src/components/EmojiList/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,12 @@ const createEmojiList = (name, { emojiListRef, searchTerm }) => {
activeSkinTone,
filterResult,
seenGroups = {},
onEmojiClick,
variationMenu,
failedToLoad = null,
preload,
},
dispatch,
onEmojiClick,
} = useContext(PickerContext);

const unsetEmojiName = useCallback(() => setEmojiName('', emojiListRef));
Expand Down
9 changes: 2 additions & 7 deletions src/components/RecentlyUsed/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,9 @@ import Emoji from '../Emoji';

const RecentlyUsed = ({ emojiListRef }) => {
const {
state: {
recentlyUsed,
groupNames,
onEmojiClick,
filterResult,
failedToLoad = {},
},
state: { recentlyUsed, groupNames, filterResult, failedToLoad = {} },
dispatch,
onEmojiClick,
} = useContext(PickerContext);

const unsetEmojiName = useCallback(() => setEmojiName('', emojiListRef));
Expand Down
3 changes: 2 additions & 1 deletion src/components/VariationsMenu/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ import './style.css';

const VariationsMenu = ({ closeVariations }) => {
const {
state: { variationMenu, activeSkinTone, onEmojiClick },
state: { variationMenu, activeSkinTone },
onEmojiClick,
} = useContext(PickerContext);

if (!variationMenu) {
Expand Down
8 changes: 6 additions & 2 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,9 @@ const EmpojiPicker = ({
}) => {
const emojiListRef = useRef(null);
const isMounted = useRef(true);
const onClickRef = useRef(onEmojiClick);

onClickRef.current = onEmojiClick;

useEffect(
() => () => {
Expand All @@ -45,7 +48,6 @@ const EmpojiPicker = ({
const [state, useReducerDispatch] = useReducer(reducer, {
activeSkinTone: skinTone,
emojiUrl,
onEmojiClick: clickHandler(onEmojiClick),
seenGroups: { [GROUP_NAME_PEOPLE]: true },
recentlyUsed: getRecentlyUsed(),
preload,
Expand Down Expand Up @@ -74,7 +76,9 @@ const EmpojiPicker = ({
};

return (
<PickerContext.Provider value={{ state, dispatch }}>
<PickerContext.Provider
value={{ state, dispatch, onEmojiClick: clickHandler(onClickRef) }}
>
<aside
className="emoji-picker-react"
onScroll={closeVariations}
Expand Down
4 changes: 2 additions & 2 deletions src/lib/clickHandler/index.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
import { setRecentlyUsed } from '../recentlyUsed';
import emojiOutput from '../emojiOutput';

const clickHandler = (onEmojiClick = Function.prototype) => (
const clickHandler = (onClickRef = {}) => (
e,
unified,
emoji,
activeSkinTone
) => {
const output = emojiOutput(unified, emoji, activeSkinTone);
setRecentlyUsed(output);
return onEmojiClick(e, output);
return onClickRef.current && onClickRef.current(e, output);
};

export default clickHandler;

0 comments on commit 2e19179

Please sign in to comment.