diff --git a/app/javascript/chat/__tests__/compose.test.jsx b/app/javascript/chat/__tests__/compose.test.jsx
index a64e8661c..ac157644b 100644
--- a/app/javascript/chat/__tests__/compose.test.jsx
+++ b/app/javascript/chat/__tests__/compose.test.jsx
@@ -117,7 +117,7 @@ describe('', () => {
expect(input.textContent).toEqual('');
expect(input.getAttribute('maxLength')).toEqual('1000');
- expect(input.getAttribute('placeholder')).toEqual('Write message...');
+ expect(input.getAttribute('placeholder')).toContain('Write message to');
// Ensure send button is pressent
getByText(/send/i);
diff --git a/app/javascript/chat/chat.jsx b/app/javascript/chat/chat.jsx
index 1f1e5e513..8ab6522db 100644
--- a/app/javascript/chat/chat.jsx
+++ b/app/javascript/chat/chat.jsx
@@ -1467,7 +1467,9 @@ export default class Chat extends Component {
}
renderActiveChatChannel = (channelHeader) => {
const { state, props } = this;
-
+ const channelName = state.activeChannel
+ ? state.activeChannel.channel_name
+ : ' ';
return (
@@ -1522,6 +1524,7 @@ export default class Chat extends Component {
handleKeyUp={this.handleKeyUp}
handleKeyDownEdit={this.handleKeyDownEdit}
activeChannelId={state.activeChannelId}
+ activeChannelName={channelName}
startEditing={state.startEditing}
markdownEdited={state.markdownEdited}
editMessageMarkdown={state.activeEditMessage.markdown}
diff --git a/app/javascript/chat/compose.jsx b/app/javascript/chat/compose.jsx
index 473bc0f2d..5d430bf25 100644
--- a/app/javascript/chat/compose.jsx
+++ b/app/javascript/chat/compose.jsx
@@ -15,6 +15,7 @@ const Compose = ({
editMessageMarkdown,
handleEditMessageClose,
handleFilePaste,
+ activeChannelName,
}) => {
const [value, setValue] = useState('');
@@ -36,8 +37,9 @@ const Compose = ({
};
const placeholder = useMemo(
- () => (startEditing ? "Let's connect" : 'Write message...'),
- [startEditing],
+ () =>
+ startEditing ? "Let's connect" : `Write message to ${activeChannelName}`,
+ [startEditing, activeChannelName],
);
const label = useMemo(
() => (startEditing ? "Let's connect" : 'Compose a message'),
@@ -119,6 +121,7 @@ Compose.propTypes = {
editMessageMarkdown: PropTypes.string.isRequired,
handleEditMessageClose: PropTypes.func.isRequired,
handleFilePaste: PropTypes.func.isRequired,
+ activeChannelName: PropTypes.string.isRequired,
};
export default Compose;