diff --git a/src/ContactEdit.tsx b/src/ContactEdit.tsx index 30a8ada..78dd13b 100644 --- a/src/ContactEdit.tsx +++ b/src/ContactEdit.tsx @@ -15,13 +15,23 @@ import * as EteSync from './api/EteSync'; import { ContactType } from './pim-types'; +const telTypes = [ + {type: 'Home'}, + {type: 'Work'}, + {type: 'Cell'}, + {type: 'Other'}, +]; + +const emailTypes = telTypes; + +const addressTypes = [ + {type: 'Home'}, + {type: 'Work'}, + {type: 'Other'}, +]; + const TypeSelector = (props: any) => { - const types = [ - {type: 'Home'}, - {type: 'Work'}, - {type: 'Cell'}, - {type: 'Other'}, - ]; + const types = props.types as {type: string}[]; return ( { props.onChange(props.name, payload, props.value.value) } @@ -88,8 +100,9 @@ class ContactEdit extends React.Component { state: { uid: string, fn: string; - phones: ValueType[]; - emails: ValueType[]; + phone: ValueType[]; + email: ValueType[]; + address: ValueType[]; journalUid: string; }; @@ -106,8 +119,9 @@ class ContactEdit extends React.Component { this.state = { uid: '', fn: '', - phones: [new ValueType()], - emails: [new ValueType()], + phone: [new ValueType()], + email: [new ValueType()], + address: [new ValueType()], journalUid: '', }; @@ -128,8 +142,9 @@ class ContactEdit extends React.Component { )) ); - this.state.phones = propToValueType(contact.comp, 'tel'); - this.state.emails = propToValueType(contact.comp, 'email'); + this.state.phone = propToValueType(contact.comp, 'tel'); + this.state.email = propToValueType(contact.comp, 'email'); + this.state.address = propToValueType(contact.comp, 'adr'); } else { this.state.uid = uuid.v4(); @@ -224,8 +239,9 @@ class ContactEdit extends React.Component { }); } - setProperties('tel', this.state.phones); - setProperties('email', this.state.emails); + setProperties('tel', this.state.phone); + setProperties('email', this.state.email); + setProperties('adr', this.state.address); this.props.onSave(contact, this.state.journalUid, this.props.contact); } @@ -273,18 +289,19 @@ class ContactEdit extends React.Component {
Phone numbers this.addValueType('phones')} + onClick={() => this.addValueType('phone')} tooltip="Add phone number" >
- {this.state.phones.map((x, idx) => ( + {this.state.phone.map((x, idx) => ( this.removeValueType(name, idx)} onChange={(name: string, type: string, value: string) => ( this.handleValueTypeChange(name, idx, {type, value}) @@ -295,18 +312,42 @@ class ContactEdit extends React.Component {
Emails this.addValueType('emails')} + onClick={() => this.addValueType('email')} tooltip="Add email address" >
- {this.state.emails.map((x, idx) => ( + {this.state.email.map((x, idx) => ( + this.removeValueType(name, idx)} + onChange={(name: string, type: string, value: string) => ( + this.handleValueTypeChange(name, idx, {type, value}) + )} + /> + ))} + +
+ Addresses + this.addValueType('address')} + tooltip="Add address" + > + + +
+ {this.state.address.map((x, idx) => ( this.removeValueType(name, idx)} onChange={(name: string, type: string, value: string) => ( this.handleValueTypeChange(name, idx, {type, value})