66 lines
1.7 KiB
TypeScript
66 lines
1.7 KiB
TypeScript
import React, { FC, memo, useCallback } from '../../../lib/teact/teact';
|
|
import { getDispatch, withGlobal } from '../../../lib/teact/teactn';
|
|
|
|
import { SettingsScreens } from '../../../types';
|
|
import { ApiAvailableReaction } from '../../../api/types';
|
|
|
|
import useHistoryBack from '../../../hooks/useHistoryBack';
|
|
|
|
import ReactionStaticEmoji from '../../common/ReactionStaticEmoji';
|
|
import RadioGroup from '../../ui/RadioGroup';
|
|
|
|
type OwnProps = {
|
|
isActive?: boolean;
|
|
onScreenSelect: (screen: SettingsScreens) => void;
|
|
onReset: () => void;
|
|
};
|
|
|
|
type StateProps = {
|
|
availableReactions?: ApiAvailableReaction[];
|
|
selectedReaction?: string;
|
|
};
|
|
|
|
const SettingsQuickReaction: FC<OwnProps & StateProps> = ({
|
|
isActive,
|
|
onReset,
|
|
onScreenSelect,
|
|
availableReactions,
|
|
selectedReaction,
|
|
}) => {
|
|
const { setDefaultReaction } = getDispatch();
|
|
useHistoryBack(isActive, onReset, onScreenSelect, SettingsScreens.General);
|
|
|
|
const options = availableReactions?.filter((l) => !l.isInactive).map((l) => {
|
|
return {
|
|
label: <><ReactionStaticEmoji reaction={l.reaction} />{l.title}</>,
|
|
value: l.reaction,
|
|
};
|
|
}) || [];
|
|
|
|
const handleChange = useCallback((reaction: string) => {
|
|
setDefaultReaction({ reaction });
|
|
}, [setDefaultReaction]);
|
|
|
|
return (
|
|
<div className="settings-content settings-item custom-scroll settings-quick-reaction">
|
|
<RadioGroup
|
|
name="quick-reaction-settings"
|
|
options={options}
|
|
selected={selectedReaction}
|
|
onChange={handleChange}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default memo(withGlobal<OwnProps>(
|
|
(global) => {
|
|
const { availableReactions, appConfig } = global;
|
|
|
|
return {
|
|
availableReactions,
|
|
selectedReaction: appConfig?.defaultReaction,
|
|
};
|
|
},
|
|
)(SettingsQuickReaction));
|