77 lines
2.3 KiB
JavaScript
77 lines
2.3 KiB
JavaScript
/* Please direct questions to Hansi Xu (Wallace LaWall on Discord) */
|
|
|
|
import React from 'react';
|
|
import './chats.css'
|
|
import Chat from './Chat'
|
|
import Contact from './Contact'
|
|
|
|
class ChatWindow extends React.Component {
|
|
render() {
|
|
return (
|
|
<div class="chatcomponent">
|
|
<UserList />
|
|
<MessageList />
|
|
</div>
|
|
)
|
|
}
|
|
test() {
|
|
alert("test")
|
|
}
|
|
}
|
|
|
|
class UserList extends React.Component {
|
|
render() {
|
|
return (
|
|
<div class="contactlist">
|
|
<Contact pfpsrc="./chief.jpg" name="Master Chief"/>
|
|
<Contact pfpsrc="./freeman.jpg" name="Gordon Freeman" />
|
|
<Contact pfpsrc="./shogun.jpg" name="Raiden Shogun" selected="true" />
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
class MessageList extends React.Component {
|
|
render() {
|
|
return (
|
|
<div class="messagelist">
|
|
<div class="chatbubble-container">
|
|
<div class="chatbubble right">
|
|
Got time for tennis this week, Raiden?
|
|
</div>
|
|
</div>
|
|
<div class="chatbubble-container">
|
|
<div class="chatbubble left">
|
|
Foolish question. If I do not even have free time, How am I to pursue eternity and fulfill my promise to the people of Inazuma?
|
|
</div>
|
|
</div>
|
|
<div class="chatbubble-container">
|
|
<div class="chatbubble right">
|
|
Aiight, see you at 4
|
|
</div>
|
|
</div>
|
|
<div class="chatbubble-container">
|
|
<div class="chatbubble left">
|
|
As you wish.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
// class ChatWindow extends React.Component {
|
|
// render() {
|
|
// return (
|
|
// <div>
|
|
// <ChatUserList />
|
|
// {/* <MessageList /> */}
|
|
// </div>
|
|
// )
|
|
// }
|
|
// }
|
|
class ChatInput extends React.Component {
|
|
render() {
|
|
return (<p>Placeholder</p>)
|
|
}
|
|
}
|
|
export default ChatWindow; |