CringeStudios/IRC_Client
5
0
Fork 0
forked from CringeStudios/gamja
Code Pull Requests Activity

Add shouldComponentUpdate to member list

Browse Source
This commit is contained in:
Simon Ser 2020-07-13 11:09:16 +02:00
parent b40fc76e82
commit f284468aa6
No known key found for this signature in database
GPG Key ID: 0FDE7BE0E88F5E48
1 changed files with 36 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
components/member-list.js
View File

@ -1,25 +1,43 @@
import { html, Component } from "/lib/index.js";
function MemberItem(props) {
function handleClick(event) {
event.preventDefault();
props.onClick();
class MemberItem extends Component {
constructor(props) {
super(props);
this.handleClick = this.handleClick.bind(this);
}
var url = "irc:///" + encodeURIComponent(props.nick) + ",isnick";
return html`
<li>
<a href=${url} class="nick" onClick=${handleClick}>${props.nick}</a>
</li>
`;
shouldComponentUpdate(nextProps) {
return this.props.nick !== nextProps.nick;
}
handleClick(event) {
event.preventDefault();
this.props.onClick();
}
render() {
var url = "irc:///" + encodeURIComponent(this.props.nick) + ",isnick";
return html`
<li>
<a href=${url} class="nick" onClick=${this.handleClick}>${this.props.nick}</a>
</li>
`;
}
}
export default function MemberList(props) {
return html`
<ul>
${Array.from(props.members.entries()).sort().map(([nick, membership]) => html`
<${MemberItem} key=${nick} nick=${nick} membership=${membership} onClick=${() => props.onNickClick(nick)}/>
`)}
</ul>
`;
export default class MemberList extends Component {
shouldComponentUpdate(nextProps) {
return this.props.members !== nextProps.members;
}
render() {
return html`
<ul>
${Array.from(this.props.members.entries()).sort().map(([nick, membership]) => html`
<${MemberItem} key=${nick} nick=${nick} membership=${membership} onClick=${() => this.props.onNickClick(nick)}/>
`)}
</ul>
`;
}
}