Differential D6968 Diff 23481 web/sidebar/community-drawer-item-handlers.react.js

Changeset View

Standalone View

web/sidebar/community-drawer-item-handlers.react.js

// @flow		// @flow

import * as React from 'react';		import * as React from 'react';
import { useDispatch } from 'react-redux';		import { useDispatch } from 'react-redux';

import type { ThreadInfo } from 'lib/types/thread-types.js';		import type { ThreadInfo } from 'lib/types/thread-types.js';

import type { CommunityDrawerItemHandler } from './community-drawer-item-handler.react.js';		import type { CommunityDrawerItemHandler } from './community-drawer-item-handler.react.js';
import { updateCalendarCommunityFilter } from '../redux/action-types.js';		import { updateCalendarCommunityFilter } from '../redux/action-types.js';
import { useCommunityIsPicked } from '../selectors/calendar-selectors.js';		import { useCommunityIsPickedCalendar } from '../selectors/calendar-selectors.js';
import {		import {
useOnClickThread,		useOnClickThread,
useThreadIsActive,		useThreadIsActive,
} from '../selectors/thread-selectors.js';		} from '../selectors/thread-selectors.js';
import type { NavigationTab } from '../types/nav-types.js';		import type { NavigationTab } from '../types/nav-types.js';

export type HandlerProps = {		export type HandlerProps = {
+setHandler: (handler: CommunityDrawerItemHandler) => void,		+setHandler: (handler: CommunityDrawerItemHandler) => void,
Show All 21 Lines	function CalendarDrawerItemHandler(props: HandlerProps): React.Node {
const dispatch = useDispatch();		const dispatch = useDispatch();

const onClick = React.useCallback(() => {		const onClick = React.useCallback(() => {
dispatch({		dispatch({
type: updateCalendarCommunityFilter,		type: updateCalendarCommunityFilter,
payload: threadInfo.id,		payload: threadInfo.id,
});		});
}, [dispatch, threadInfo.id]);		}, [dispatch, threadInfo.id]);
const isActive = useCommunityIsPicked(threadInfo.id);		const isActive = useCommunityIsPickedCalendar(threadInfo.id);

const handler = React.useMemo(		const handler = React.useMemo(
() => ({ onClick, isActive }),		() => ({ onClick, isActive }),
[onClick, isActive],		[onClick, isActive],
);		);
React.useEffect(() => {		React.useEffect(() => {
setHandler(handler);		setHandler(handler);
}, [handler, setHandler]);		}, [handler, setHandler]);
Show All 18 Lines