Add a button to show an item's (contact/event) change history

Fixes #1
master
Tom Hacohen 7 years ago
parent 30cd979ba8
commit 35b3ce7f95

@ -53,6 +53,7 @@ export const routeResolver = new RouteResolver({
_id: {
_base: ':contactUid',
edit: 'edit',
log: 'log',
},
new: 'new',
},
@ -60,6 +61,7 @@ export const routeResolver = new RouteResolver({
_id: {
_base: ':eventUid',
edit: 'edit',
log: 'log',
},
new: 'new',
},

@ -2,10 +2,12 @@ import * as React from 'react';
import { Route, Switch } from 'react-router';
import RaisedButton from 'material-ui/RaisedButton';
import IconEdit from 'material-ui/svg-icons/editor/mode-edit';
import IconChangeHistory from 'material-ui/svg-icons/action/change-history';
import * as EteSync from '../api/EteSync';
import { createSelector } from 'reselect';
import { pure } from 'recompose';
import { History } from 'history';
@ -13,6 +15,7 @@ import { ContactType, EventType } from '../pim-types';
import Container from '../widgets/Container';
import JournalEntries from '../components/JournalEntries';
import ContactEdit from '../components/ContactEdit';
import Contact from '../components/Contact';
import EventEdit from '../components/EventEdit';
@ -65,6 +68,28 @@ const itemsSelector = createSelector(
return { collectionsAddressBook, collectionsCalendar, addressBookItems, calendarItems };
},
);
const ItemChangeLog = pure((props: any) => {
const {
syncInfo,
items,
uid,
} = props;
const journalItem = syncInfo.get((items[uid] as any).journalUid);
return (
<React.Fragment>
<h2>Item Change History</h2>
<JournalEntries
journal={journalItem.journal}
entries={journalItem.entries}
uid={uid}
/>
</React.Fragment>
);
});
class Pim extends React.PureComponent {
props: {
etesync: CredentialsData;
@ -151,16 +176,40 @@ class Pim extends React.PureComponent {
</Container>
)}
/>
<Route
path={routeResolver.getRoute('pim.contacts._id.log')}
exact={true}
render={({match}) => (
<Container>
<ItemChangeLog
syncInfo={this.props.syncInfo}
items={addressBookItems}
uid={match.params.contactUid}
/>
</Container>
)}
/>
<Route
path={routeResolver.getRoute('pim.contacts._id')}
exact={true}
render={({match, history}) => (
<Container>
<div style={{textAlign: 'right'}}>
<div style={{textAlign: 'right', marginBottom: 15}}>
<RaisedButton
label="Change History"
style={{marginLeft: 15}}
icon={<IconChangeHistory />}
onClick={() =>
history.push(routeResolver.getRoute(
'pim.contacts._id.log',
{contactUid: match.params.contactUid}))
}
/>
<RaisedButton
label="Edit"
secondary={true}
style={{marginBottom: 15}}
style={{marginLeft: 15}}
icon={<IconEdit />}
onClick={() =>
history.push(routeResolver.getRoute(
@ -196,16 +245,40 @@ class Pim extends React.PureComponent {
</Container>
)}
/>
<Route
path={routeResolver.getRoute('pim.events._id.log')}
exact={true}
render={({match}) => (
<Container>
<ItemChangeLog
syncInfo={this.props.syncInfo}
items={calendarItems}
uid={match.params.eventUid}
/>
</Container>
)}
/>
<Route
path={routeResolver.getRoute('pim.events._id')}
exact={true}
render={({match, history}) => (
<Container>
<div style={{textAlign: 'right'}}>
<div style={{textAlign: 'right', marginBottom: 15}}>
<RaisedButton
label="Change History"
style={{marginLeft: 15}}
icon={<IconChangeHistory />}
onClick={() =>
history.push(routeResolver.getRoute(
'pim.events._id.log',
{eventUid: match.params.eventUid}))
}
/>
<RaisedButton
label="Edit"
secondary={true}
style={{marginBottom: 15}}
style={{marginLeft: 15}}
icon={<IconEdit />}
onClick={() =>
history.push(routeResolver.getRoute(

Loading…
Cancel
Save