diff --git a/src/Journal/index.tsx b/src/Journal/index.tsx index b9a92cb..73f9cc2 100644 --- a/src/Journal/index.tsx +++ b/src/Journal/index.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Tabs, Tab } from 'material-ui/Tabs'; -import AddressBook from '../components/AddressBook'; +import SearchableAddressBook from '../components/SearchableAddressBook'; import Contact from '../components/Contact'; import Calendar from '../components/Calendar'; import Event from '../components/Event'; @@ -29,7 +29,7 @@ interface PropsType { interface PropsTypeInner extends PropsType { } -const JournalAddressBook = journalView(AddressBook, Contact); +const JournalAddressBook = journalView(SearchableAddressBook, Contact); const PersistCalendar = historyPersistor('Calendar')(Calendar); const JournalCalendar = journalView(PersistCalendar, Event); diff --git a/src/Pim/PimMain.tsx b/src/Pim/PimMain.tsx index b890c6a..9f363b2 100644 --- a/src/Pim/PimMain.tsx +++ b/src/Pim/PimMain.tsx @@ -9,7 +9,7 @@ import { Location, History } from 'history'; import Container from '../widgets/Container'; -import AddressBook from '../components/AddressBook'; +import SearchableAddressBook from '../components/SearchableAddressBook'; import Calendar from '../components/Calendar'; import { EventType, ContactType } from '../pim-types'; @@ -92,7 +92,7 @@ class PimMain extends React.PureComponent { label={addressBookTitle} > - + , + onItemClick: (contact: ContactType) => void, + }; + + state: { + searchQuery: string; + }; + + constructor(props: any) { + super(props); + this.state = {searchQuery: ''}; + this.handleInputChange = this.handleInputChange.bind(this); + } + + handleInputChange(event: React.ChangeEvent) { + const name = event.target.name; + const value = event.target.value; + this.setState({ + [name]: value + }); + } + + render() { + const { + entries, + ...rest, + } = this.props; + + const reg = new RegExp(this.state.searchQuery, 'i'); + + return ( + + + {this.state.searchQuery && + this.setState({'searchQuery': ''})}> + + + } + ent.fn.match(reg)} {...rest} /> + + ); + } +} + +export default SearchableAddressBook;