67 lines
1.7 KiB
TypeScript
67 lines
1.7 KiB
TypeScript
import React from 'react';
|
|
import { ConversationListItemProps } from './ConversationListItem';
|
|
|
|
import classNames from 'classnames';
|
|
import { PubKey } from '../session/types';
|
|
|
|
export type Props = {
|
|
contacts: Array<ConversationListItemProps>;
|
|
searchTerm: string;
|
|
selectedContact: number;
|
|
onContactSelected: any;
|
|
};
|
|
|
|
export class UserSearchResults extends React.Component<Props> {
|
|
public constructor(props: Props) {
|
|
super(props);
|
|
}
|
|
|
|
public render() {
|
|
const { contacts, searchTerm } = this.props;
|
|
|
|
const noResults = !contacts || contacts.length <= 0;
|
|
|
|
return (
|
|
<div className="module-search-results">
|
|
{noResults ? (
|
|
<div className="module-search-results__no-results">
|
|
{window.i18n('noSearchResults', [searchTerm])}
|
|
</div>
|
|
) : (
|
|
this.renderContacts(contacts)
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
private renderContacts(items: Array<ConversationListItemProps>) {
|
|
return (
|
|
<div className="contacts-dropdown">
|
|
{items.map((contact, index) => this.renderContact(contact, index))}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
private renderContact(contact: ConversationListItemProps, index: Number) {
|
|
const { profileName, id } = contact;
|
|
const { selectedContact } = this.props;
|
|
|
|
const shortenedPubkey = PubKey.shorten(id);
|
|
const rowContent = `${profileName} ${shortenedPubkey}`;
|
|
|
|
return (
|
|
<div
|
|
className={classNames(
|
|
'contacts-dropdown-row',
|
|
selectedContact === index && 'contacts-dropdown-row-selected'
|
|
)}
|
|
key={contact.id}
|
|
onClick={() => this.props.onContactSelected(contact.id)}
|
|
role="button"
|
|
>
|
|
{rowContent}
|
|
</div>
|
|
);
|
|
}
|
|
}
|