Journal: upgrade material-ui

master
Tom Hacohen 6 years ago
parent 5cdf5d5563
commit d6b7ba0240

@ -1,5 +1,7 @@
import * as React from 'react'; import * as React from 'react';
import { Tabs, Tab } from 'material-ui/Tabs'; import Tab from '@material-ui/core/Tab';
import Tabs from '@material-ui/core/Tabs';
import { Theme, withTheme } from '@material-ui/core/styles';
import SearchableAddressBook from '../components/SearchableAddressBook'; import SearchableAddressBook from '../components/SearchableAddressBook';
import Contact from '../components/Contact'; import Contact from '../components/Contact';
@ -27,24 +29,29 @@ interface PropsType {
} }
interface PropsTypeInner extends PropsType { interface PropsTypeInner extends PropsType {
theme: Theme;
} }
const JournalAddressBook = journalView(SearchableAddressBook, Contact); const JournalAddressBook = journalView(SearchableAddressBook, Contact);
const PersistCalendar = historyPersistor('Calendar')(Calendar); const PersistCalendar = historyPersistor('Calendar')(Calendar);
const JournalCalendar = journalView(PersistCalendar, Event); const JournalCalendar = journalView(PersistCalendar, Event);
class Journal extends React.PureComponent { class Journal extends React.PureComponent<PropsTypeInner> {
static defaultProps = { state: {
prevUid: null, tab: number,
}; };
props: PropsTypeInner; constructor(props: PropsTypeInner) {
constructor(props: any) {
super(props); super(props);
this.state = {
tab: 0,
};
} }
render() { render() {
const { theme } = this.props;
const currentTab = this.state.tab;
const journalUid = this.props.match.params.journalUid; const journalUid = this.props.match.params.journalUid;
const syncJournal = this.props.syncInfo.get(journalUid); const syncJournal = this.props.syncInfo.get(journalUid);
@ -74,25 +81,28 @@ class Journal extends React.PureComponent {
return ( return (
<React.Fragment> <React.Fragment>
<SecondaryHeader text={collectionInfo.displayName} /> <SecondaryHeader text={collectionInfo.displayName} />
<Tabs> <Tabs
<Tab fullWidth={true}
label={itemsTitle} style={{ backgroundColor: theme.palette.primary.main, color: 'white' }}
value={currentTab}
onChange={(event, tab) => this.setState({ tab })}
> >
<Tab label={itemsTitle} />
<Tab label="Journal Entries" />
</Tabs>
{ currentTab === 0 &&
<Container> <Container>
{itemsView} {itemsView}
</Container> </Container>
</Tab> }
<Tab { currentTab === 1 &&
label="Journal Entries"
>
<Container> <Container>
<JournalEntries journal={journal} entries={syncEntries} /> <JournalEntries journal={journal} entries={syncEntries} />
</Container> </Container>
</Tab> }
</Tabs>
</React.Fragment> </React.Fragment>
); );
} }
} }
export default Journal; export default withTheme()(Journal);

@ -89,7 +89,6 @@ const syncInfoSelector = createSelector(
); );
const PimRouter = withRouter(Pim); const PimRouter = withRouter(Pim);
const JournalRouter = withRouter(Journal);
class SyncGate extends React.PureComponent<PropsTypeInner> { class SyncGate extends React.PureComponent<PropsTypeInner> {
constructor(props: PropsTypeInner) { constructor(props: PropsTypeInner) {
@ -198,7 +197,7 @@ class SyncGate extends React.PureComponent<PropsTypeInner> {
<Route <Route
path={routeResolver.getRoute('journals._id')} path={routeResolver.getRoute('journals._id')}
render={({match}) => ( render={({match}) => (
<JournalRouter <Journal
syncInfo={journalMap} syncInfo={journalMap}
match={match} match={match}
/> />

Loading…
Cancel
Save