You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
116 lines
3.3 KiB
TypeScript
116 lines
3.3 KiB
TypeScript
7 years ago
|
import * as React from 'react';
|
||
6 years ago
|
import Tab from '@material-ui/core/Tab';
|
||
|
import Tabs from '@material-ui/core/Tabs';
|
||
|
import { Theme, withTheme } from '@material-ui/core/styles';
|
||
7 years ago
|
|
||
7 years ago
|
import SearchableAddressBook from '../components/SearchableAddressBook';
|
||
7 years ago
|
import Contact from '../components/Contact';
|
||
|
import Calendar from '../components/Calendar';
|
||
|
import Event from '../components/Event';
|
||
|
|
||
6 years ago
|
import AppBarOverride from '../widgets/AppBarOverride';
|
||
7 years ago
|
import Container from '../widgets/Container';
|
||
7 years ago
|
|
||
7 years ago
|
import JournalEntries from '../components/JournalEntries';
|
||
7 years ago
|
import journalView from './journalView';
|
||
7 years ago
|
|
||
7 years ago
|
import { syncEntriesToItemMap, syncEntriesToCalendarItemMap } from '../journal-processors';
|
||
7 years ago
|
|
||
7 years ago
|
import { SyncInfo } from '../SyncGate';
|
||
7 years ago
|
|
||
7 years ago
|
import { match } from 'react-router';
|
||
|
|
||
7 years ago
|
import { historyPersistor } from '../persist-state-history';
|
||
|
|
||
7 years ago
|
interface PropsType {
|
||
7 years ago
|
syncInfo: SyncInfo;
|
||
7 years ago
|
match: match<any>;
|
||
7 years ago
|
}
|
||
|
|
||
|
interface PropsTypeInner extends PropsType {
|
||
6 years ago
|
theme: Theme;
|
||
7 years ago
|
}
|
||
|
|
||
7 years ago
|
const JournalAddressBook = journalView(SearchableAddressBook, Contact);
|
||
7 years ago
|
const PersistCalendar = historyPersistor('Calendar')(Calendar);
|
||
|
const JournalCalendar = journalView(PersistCalendar, Event);
|
||
|
|
||
6 years ago
|
class Journal extends React.PureComponent<PropsTypeInner> {
|
||
|
state: {
|
||
|
tab: number,
|
||
7 years ago
|
};
|
||
|
|
||
6 years ago
|
constructor(props: PropsTypeInner) {
|
||
7 years ago
|
super(props);
|
||
6 years ago
|
|
||
|
this.state = {
|
||
|
tab: 0,
|
||
|
};
|
||
7 years ago
|
}
|
||
|
|
||
|
render() {
|
||
6 years ago
|
const { theme } = this.props;
|
||
6 years ago
|
let currentTab = this.state.tab;
|
||
|
let journalOnly = false;
|
||
7 years ago
|
const journalUid = this.props.match.params.journalUid;
|
||
7 years ago
|
|
||
7 years ago
|
const syncJournal = this.props.syncInfo.get(journalUid);
|
||
|
if (!syncJournal) {
|
||
7 years ago
|
return (<div>Journal not found!</div>);
|
||
|
}
|
||
|
|
||
7 years ago
|
const journal = syncJournal.journal;
|
||
|
const collectionInfo = syncJournal.collection;
|
||
|
const syncEntries = syncJournal.entries;
|
||
7 years ago
|
|
||
7 years ago
|
let itemsTitle: string;
|
||
|
let itemsView: JSX.Element;
|
||
|
if (collectionInfo.type === 'CALENDAR') {
|
||
7 years ago
|
itemsView =
|
||
|
<JournalCalendar journal={journal} entries={syncEntriesToCalendarItemMap(collectionInfo, syncEntries)} />;
|
||
7 years ago
|
itemsTitle = 'Events';
|
||
|
} else if (collectionInfo.type === 'ADDRESS_BOOK') {
|
||
7 years ago
|
itemsView =
|
||
|
<JournalAddressBook journal={journal} entries={syncEntriesToItemMap(collectionInfo, syncEntries)} />;
|
||
7 years ago
|
itemsTitle = 'Contacts';
|
||
6 years ago
|
} else if (collectionInfo.type === 'TASKS') {
|
||
|
itemsView = <div>Task preview is not yet supported</div>;
|
||
|
itemsTitle = 'Tasks';
|
||
|
journalOnly = true;
|
||
7 years ago
|
} else {
|
||
6 years ago
|
itemsView = <div>Preview is not supported for this journal type</div>;
|
||
7 years ago
|
itemsTitle = 'Items';
|
||
6 years ago
|
journalOnly = true;
|
||
7 years ago
|
}
|
||
|
|
||
6 years ago
|
currentTab = journalOnly ? 1 : currentTab;
|
||
|
|
||
7 years ago
|
return (
|
||
7 years ago
|
<React.Fragment>
|
||
6 years ago
|
<AppBarOverride title={collectionInfo.displayName} />
|
||
6 years ago
|
<Tabs
|
||
|
fullWidth={true}
|
||
6 years ago
|
style={{ backgroundColor: theme.palette.primary.main }}
|
||
6 years ago
|
value={currentTab}
|
||
|
onChange={(event, tab) => this.setState({ tab })}
|
||
|
>
|
||
6 years ago
|
<Tab label={itemsTitle} disabled={journalOnly} />
|
||
6 years ago
|
<Tab label="Journal Entries" />
|
||
7 years ago
|
</Tabs>
|
||
6 years ago
|
{ currentTab === 0 &&
|
||
|
<Container>
|
||
|
{itemsView}
|
||
|
</Container>
|
||
|
}
|
||
|
{ currentTab === 1 &&
|
||
|
<Container>
|
||
|
<JournalEntries journal={journal} entries={syncEntries} />
|
||
|
</Container>
|
||
|
}
|
||
7 years ago
|
</React.Fragment>
|
||
7 years ago
|
);
|
||
|
}
|
||
|
}
|
||
7 years ago
|
|
||
6 years ago
|
export default withTheme()(Journal);
|