bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Chats: add upload button to chat input

Browse source
This commit is contained in:
Alex Gleason 2020-09-05 21:48:25 -05:00
parent 84e5175481
commit 6dc38adeaa
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
2 changed files with 21 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/soapbox/features/chats/components/chat_box.js
View file

@ -10,6 +10,7 @@ import {
} from 'soapbox/actions/chats'; } from 'soapbox/actions/chats';
import { OrderedSet as ImmutableOrderedSet } from 'immutable'; import { OrderedSet as ImmutableOrderedSet } from 'immutable';
import ChatMessageList from './chat_message_list'; import ChatMessageList from './chat_message_list';
import UploadButton from 'soapbox/features/compose/components/upload_button';
const messages = defineMessages({ const messages = defineMessages({
placeholder: { id: 'chat_box.input.placeholder', defaultMessage: 'Send a message…' }, placeholder: { id: 'chat_box.input.placeholder', defaultMessage: 'Send a message…' },
@ -91,6 +92,10 @@ class ChatBox extends ImmutablePureComponent {
this.markRead(); this.markRead();
} }
handleFiles = (files) => {
// TODO: Upload attachment
}
render() { render() {
const { chatMessageIds, chatId, intl } = this.props; const { chatMessageIds, chatId, intl } = this.props;
if (!chatMessageIds) return null; if (!chatMessageIds) return null;
@ -99,6 +104,7 @@ class ChatBox extends ImmutablePureComponent {
<div className='chat-box' onMouseOver={this.handleHover}> <div className='chat-box' onMouseOver={this.handleHover}>
<ChatMessageList chatMessageIds={chatMessageIds} chatId={chatId} /> <ChatMessageList chatMessageIds={chatMessageIds} chatId={chatId} />
<div className='chat-box__actions simple_form'> <div className='chat-box__actions simple_form'>
<UploadButton onSelectFile={this.handleFiles} />
<textarea <textarea
rows={1} rows={1}
placeholder={intl.formatMessage(messages.placeholder)} placeholder={intl.formatMessage(messages.placeholder)}

15
app/styles/chats.scss
View file

@ -185,6 +185,19 @@
background: var(--foreground-color); background: var(--foreground-color);
margin-top: auto; margin-top: auto;
padding: 6px; padding: 6px;
position: relative;
.icon-button {
position: absolute;
right: 10px;
top: 8px;
width: auto;
height: auto;
background: transparent !important;
border: 0;
padding: 0;
margin: 0;
}
textarea { textarea {
width: 100%; width: 100%;
@ -192,11 +205,13 @@
margin: 0; margin: 0;
box-sizing: border-box; box-sizing: border-box;
padding: 6px; padding: 6px;
padding-right: 25px;
background: var(--background-color); background: var(--background-color);
border: 0; border: 0;
border-radius: 6px; border-radius: 6px;
color: var(--primary-text-color); color: var(--primary-text-color);
font-size: 15px; font-size: 15px;
overflow: hidden;
} }
} }
} }