infra
/
etesync
2
0
Fork 0
Code Issues Pull Requests Packages Activity

Implement contact and calendar event deletion.

master
Tom Hacohen 2017-12-28 17:30:09 +00:00
parent 507c0e3a1a
commit 78b292f1c4
3 changed files with 104 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/Pim/index.tsx
View File

@ -96,6 +96,7 @@ const CollectionRoutes = withRouter(
componentView: any,
items: {[key: string]: any},
onItemSave: (item: Object, journalUid: string, originalContact?: Object) => void;
onItemDelete: (item: Object, journalUid: string) => void;
onItemCancel: () => void;
};
@ -111,7 +112,11 @@ const CollectionRoutes = withRouter(
exact={true}
render={({match}) => (
<Container style={{maxWidth: 400}}>
<ComponentEdit collections={props.collections} onSave={props.onItemSave} />
<ComponentEdit
collections={props.collections}
onSave={props.onItemSave}
onDelete={props.onItemDelete}
/>
</Container>
)}
/>
@ -120,13 +125,16 @@ const CollectionRoutes = withRouter(
exact={true}
render={({match}) => (
<Container style={{maxWidth: 400}}>
<ComponentEdit
initialCollection={(props.items[match.params.itemUid] as any).journalUid}
item={props.items[match.params.itemUid]}
collections={props.collections}
onSave={props.onItemSave}
onCancel={props.onItemCancel}
/>
{(match.params.itemUid in props.items) &&
<ComponentEdit
initialCollection={(props.items[match.params.itemUid] as any).journalUid}
item={props.items[match.params.itemUid]}
collections={props.collections}
onSave={props.onItemSave}
onDelete={props.onItemDelete}
onCancel={props.onItemCancel}
/>
}
</Container>
)}
/>
@ -194,6 +202,7 @@ class Pim extends React.PureComponent {
this.onEventSave = this.onEventSave.bind(this);
this.onContactSave = this.onContactSave.bind(this);
this.onCancel = this.onCancel.bind(this);
this.onItemDelete = this.onItemDelete.bind(this);
}
onEventSave(event: EventType, journalUid: string, originalEvent?: EventType) {
@ -230,6 +239,23 @@ class Pim extends React.PureComponent {
});
}
onItemDelete(item: any, journalUid: string) {
const syncJournal = this.props.syncInfo.get(journalUid);
if (syncJournal === undefined) {
return;
}
const journal = syncJournal.journal;
let action = EteSync.SyncEntryAction.Delete;
let deleteItem = store.dispatch(
createJournalEntry(this.props.etesync, journal, syncJournal.journalEntries, action, item.toIcal()));
(deleteItem as any).then(() => {
this.props.history.push(routeResolver.getRoute('pim'));
});
}
onCancel() {
this.props.history.goBack();
}
@ -261,6 +287,7 @@ class Pim extends React.PureComponent {
componentEdit={ContactEdit}
componentView={Contact}
onItemSave={this.onContactSave}
onItemDelete={this.onItemDelete}
onItemCancel={this.onCancel}
/>
)}
@ -276,6 +303,7 @@ class Pim extends React.PureComponent {
componentEdit={EventEdit}
componentView={Event}
onItemSave={this.onEventSave}
onItemDelete={this.onItemDelete}
onItemCancel={this.onCancel}
/>
)}

34
src/components/ContactEdit.tsx
View File

@ -4,12 +4,16 @@ import RaisedButton from 'material-ui/RaisedButton';
import TextField from 'material-ui/TextField';
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import { red500, fullWhite } from 'material-ui/styles/colors';
import IconDelete from 'material-ui/svg-icons/action/delete';
import IconAdd from 'material-ui/svg-icons/content/add';
import IconClear from 'material-ui/svg-icons/content/clear';
import IconCancel from 'material-ui/svg-icons/content/clear';
import IconSave from 'material-ui/svg-icons/content/save';
import ConfirmationDialog from '../widgets/ConfirmationDialog';
import * as uuid from 'uuid';
import * as ICAL from 'ical.js';
@ -117,6 +121,7 @@ class ContactEdit extends React.PureComponent {
title: string;
journalUid: string;
showDeleteDialog: boolean;
};
props: {
@ -124,6 +129,7 @@ class ContactEdit extends React.PureComponent {
initialCollection?: string,
item?: ContactType,
onSave: (contact: ContactType, journalUid: string, originalContact?: ContactType) => void;
onDelete: (contact: ContactType, journalUid: string) => void;
onCancel: () => void;
};
@ -141,6 +147,7 @@ class ContactEdit extends React.PureComponent {
title: '',
journalUid: '',
showDeleteDialog: false,
};
if (this.props.item !== undefined) {
@ -188,6 +195,7 @@ class ContactEdit extends React.PureComponent {
this.handleValueTypeChange = this.handleValueTypeChange.bind(this);
this.addValueType = this.addValueType.bind(this);
this.removeValueType = this.removeValueType.bind(this);
this.onDeleteRequest = this.onDeleteRequest.bind(this);
}
componentWillReceiveProps(nextProps: any) {
@ -299,6 +307,12 @@ class ContactEdit extends React.PureComponent {
this.props.onSave(contact, this.state.journalUid, this.props.item);
}
onDeleteRequest() {
this.setState({
showDeleteDialog: true
});
}
render() {
const styles = {
form: {
@ -464,6 +478,17 @@ class ContactEdit extends React.PureComponent {
icon={<IconCancel />}
/>
{this.props.item &&
<RaisedButton
label="Delete"
labelColor={fullWhite}
backgroundColor={red500}
style={{marginLeft: 15}}
icon={<IconDelete color={fullWhite} />}
onClick={this.onDeleteRequest}
/>
}
<RaisedButton
type="submit"
label="Save"
@ -478,6 +503,15 @@ class ContactEdit extends React.PureComponent {
the unsupported types will be copied as is.
</div>
</form>
<ConfirmationDialog
title="Delete Confirmation"
open={this.state.showDeleteDialog}
onOk={() => this.props.onDelete(this.props.item!, this.props.initialCollection!)}
onCancel={() => this.setState({showDeleteDialog: false})}
>
Are you sure you would like to delete this contact?
</ConfirmationDialog>
</React.Fragment>
);
}

34
src/components/EventEdit.tsx
View File

@ -4,12 +4,16 @@ import Toggle from 'material-ui/Toggle';
import TextField from 'material-ui/TextField';
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import { red500, fullWhite } from 'material-ui/styles/colors';
import IconDelete from 'material-ui/svg-icons/action/delete';
import IconCancel from 'material-ui/svg-icons/content/clear';
import IconSave from 'material-ui/svg-icons/content/save';
import DateTimePicker from '../widgets/DateTimePicker';
import ConfirmationDialog from '../widgets/ConfirmationDialog';
import * as uuid from 'uuid';
import * as ICAL from 'ical.js';
@ -29,6 +33,7 @@ class EventEdit extends React.PureComponent {
journalUid: string;
error?: string;
showDeleteDialog: boolean;
};
props: {
@ -36,6 +41,7 @@ class EventEdit extends React.PureComponent {
initialCollection?: string,
item?: EventType,
onSave: (event: EventType, journalUid: string, originalEvent?: EventType) => void;
onDelete: (event: EventType, journalUid: string) => void;
onCancel: () => void;
};
@ -51,6 +57,7 @@ class EventEdit extends React.PureComponent {
end: '',
journalUid: '',
showDeleteDialog: false,
};
if (this.props.item !== undefined) {
const event = this.props.item;
@ -83,6 +90,7 @@ class EventEdit extends React.PureComponent {
this.handleChange = this.handleChange.bind(this);
this.handleInputChange = this.handleInputChange.bind(this);
this.toggleAllDay = this.toggleAllDay.bind(this);
this.onDeleteRequest = this.onDeleteRequest.bind(this);
}
componentWillReceiveProps(nextProps: any) {
@ -149,6 +157,12 @@ class EventEdit extends React.PureComponent {
this.props.onSave(event, this.state.journalUid, this.props.item);
}
onDeleteRequest() {
this.setState({
showDeleteDialog: true
});
}
render() {
const styles = {
form: {
@ -240,6 +254,17 @@ class EventEdit extends React.PureComponent {
onClick={this.props.onCancel}
/>
{this.props.item &&
<RaisedButton
label="Delete"
labelColor={fullWhite}
backgroundColor={red500}
style={{marginLeft: 15}}
icon={<IconDelete color={fullWhite} />}
onClick={this.onDeleteRequest}
/>
}
<RaisedButton
type="submit"
label="Save"
@ -254,6 +279,15 @@ class EventEdit extends React.PureComponent {
the unsupported types will be copied as is.
</div>
</form>
<ConfirmationDialog
title="Delete Confirmation"
open={this.state.showDeleteDialog}
onOk={() => this.props.onDelete(this.props.item!, this.props.initialCollection!)}
onCancel={() => this.setState({showDeleteDialog: false})}
>
Are you sure you would like to delete this contact?
</ConfirmationDialog>
</React.Fragment>
);
}