Release 1.9.3 (#602)

Co-authored-by: Rafael Ferreira <rafaelblink@gmail.com>
Co-authored-by: sctEdwin <72842751+sctEdwin@users.noreply.github.com>
Co-authored-by: Deepak Agarwal <deepak710agarwal@gmail.com>

CHANGELOG.md

@@ -2,6 +2,11 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+
+## 1.9.3 - 2021-04-21
+[FIX] sound notification on/off (#567)
+[FIX] Invalid font size for hiragana and katakana (#559)
+
 ## 1.9.2 - 2021-04-13
 bump version
 

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@rocket.chat/livechat",
-	"version": "1.9.2",
+	"version": "1.9.3",
 	"files": [
 		"/build"
 	],

src/components/Composer/index.js

@@ -63,6 +63,9 @@ export class Composer extends Component {
 	}
 
 	handleInput = (onChange) => () => {
+		if (this.state.inputLock) {
+			return;
+		}
 		onChange && onChange(sanitize(this.el.innerText));
 	}
 
@@ -147,6 +150,9 @@ export class Composer extends Component {
 
 	constructor(props) {
 		super(props);
+		this.state = {
+			inputLock: false,
+		};
 		this.value = this.props.value;
 		this.handleNotifyEmojiSelect = this.handleNotifyEmojiSelect.bind(this);
 
@@ -228,7 +234,13 @@ export class Composer extends Component {
 		return 0;
 	}
 
+	handleInputLock(locked) {
+		this.setState({ inputLock: locked });
+		return 0;
+	}
+
 	render = ({ pre, post, value, placeholder, onChange, onSubmit, onUpload, className, style }) => (
+
 		<div className={createClassName(styles, 'composer', { }, [className])} style={style}>
 			{pre}
 			<div
@@ -247,6 +259,17 @@ export class Composer extends Component {
 						onClick: this.handleClick,
 					}
 				)}
+
+				onCompositionStart={() => {
+					this.handleInputLock(true);
+				}}
+
+				onCompositionEnd={() => {
+					this.handleInputLock(false);
+					onChange && onChange(this.el.innerText);
+				}}
+
+
 				className={createClassName(styles, 'composer__input')}
 			/>
 			{post}

src/components/Messages/MessageText/emoji.js

@@ -1,6 +1,6 @@
 import shortnameToUnicode from '../../Emoji/shortnameToUnicode';
 
-const emojiUnicode = '\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]'; // unicode emoji from https://www.regextester.com/106421
+const emojiUnicode = '\u00a9|\u00ae|[\u2000-\u3039]|[\u3100-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]'; // unicode emoji from https://www.regextester.com/106421
 
 const emojiRanges = [
 	emojiUnicode, // unicode emoji from https://www.regextester.com/106421

src/components/Tooltip/index.js

@@ -55,17 +55,29 @@ const TooltipContext = createContext();
 export class TooltipContainer extends Component {
 	state = {
 		tooltip: null,
+		activeChild: null,
+		event: null,
+		placement: null,
 	}
 
-	showTooltip = (event, { content, placement = 'bottom' }) => {
+	showTooltip = (event, { content, placement = 'bottom', childIndex }) => {
 		const triggerBounds = event.target.getBoundingClientRect();
-		this.setState({ tooltip: <Tooltip floating placement={placement} triggerBounds={triggerBounds}>{content}</Tooltip> });
+		this.setState({ tooltip: <Tooltip floating placement={placement} triggerBounds={triggerBounds}>{content}</Tooltip>, activeChild: childIndex, event, placement, content });
 	}
 
 	hideTooltip = () => {
 		this.setState({ tooltip: null });
 	}
 
+	UNSAFE_componentWillReceiveProps(props) {
+		if (this.state.tooltip) {
+			const activeChildren = props?.children?.props?.children[this.state.activeChild];
+			if (activeChildren && activeChildren.props.content !== this.state.content) {
+				this.showTooltip(this.state.event, { content: activeChildren.props.content, placement: this.state.placement, childIndex: this.state.activeChild });
+			}
+		}
+	}
+
 	render({ children }) {
 		return (
 			<TooltipContext.Provider value={{ ...this.state, showTooltip: this.showTooltip, hideTooltip: this.hideTooltip }}>
@@ -81,11 +93,12 @@ export class TooltipContainer extends Component {
 
 export const TooltipTrigger = ({ children, content, placement }) => (
 	<TooltipContext.Consumer>
-		{({ showTooltip, hideTooltip }) => toChildArray(children).map((child) => cloneElement(child, {
-			onMouseEnter: (event) => showTooltip(event, { content, placement }),
+		{({ showTooltip, hideTooltip }) => toChildArray(children).map((child, index) => cloneElement(child, {
+			onMouseEnter: (event) => showTooltip(event, { content, placement, childIndex: index }),
 			onMouseLeave: (event) => hideTooltip(event),
-			onFocusCapture: (event) => showTooltip(event, { content, placement }),
+			onFocusCapture: (event) => showTooltip(event, { content, placement, childIndex: index }),
 			onBlurCapture: (event) => hideTooltip(event),
+			content,
 		}))}
 	</TooltipContext.Consumer>
 );