From b24070883ae2f8bc20e3e0ccdc9c0e895323a5b9 Mon Sep 17 00:00:00 2001 From: Tom Hacohen Date: Tue, 12 Feb 2019 21:25:38 +0000 Subject: [PATCH] Journal: add a page for viewing members. --- src/App.tsx | 2 + src/Journals/Journal.tsx | 24 +++++++---- src/Journals/JournalMembers.tsx | 74 +++++++++++++++++++++++++++++++++ src/Journals/index.tsx | 10 +++++ src/api/EteSync.ts | 23 ++++++++++ 5 files changed, 126 insertions(+), 7 deletions(-) create mode 100644 src/Journals/JournalMembers.tsx diff --git a/src/App.tsx b/src/App.tsx index d02c835..12957f6 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -74,6 +74,8 @@ export const routeResolver = new RouteResolver({ _base: ':entryUid', }, }, + members: { + }, }, new: 'new', }, diff --git a/src/Journals/Journal.tsx b/src/Journals/Journal.tsx index d66d2c9..82f8590 100644 --- a/src/Journals/Journal.tsx +++ b/src/Journals/Journal.tsx @@ -4,6 +4,7 @@ import Tab from '@material-ui/core/Tab'; import Tabs from '@material-ui/core/Tabs'; import { Theme, withTheme } from '@material-ui/core/styles'; import IconEdit from '@material-ui/icons/Edit'; +import IconMembers from '@material-ui/icons/People'; import SearchableAddressBook from '../components/SearchableAddressBook'; import Contact from '../components/Contact'; @@ -87,13 +88,22 @@ class Journal extends React.PureComponent { { isOwner && - - - + <> + + + + + + + } { + state = { + members: null as EteSync.JournalMemberJson[] | null, + }; + + constructor(props: PropsTypeInner) { + super(props); + } + + render() { + const { info } = this.props; + const { members } = this.state; + + return ( + <> + + + { members ? + + { members.map((member) => ( + + {member.user} + + ))} + + : + + } + + + ); + } + + componentDidMount() { + this.fetchMembers(); + } + + private fetchMembers() { + const { etesync, info } = this.props; + + const creds = etesync.credentials; + const apiBase = etesync.serviceApiUrl; + const journalMembersManager = new EteSync.JournalMembersManager(creds, apiBase, info.uid); + journalMembersManager.list().then((members) => { + this.setState({ + members, + }); + }); + } +} + +export default withTheme()(JournalMembers); diff --git a/src/Journals/index.tsx b/src/Journals/index.tsx index e417db3..b3d177b 100644 --- a/src/Journals/index.tsx +++ b/src/Journals/index.tsx @@ -4,6 +4,7 @@ import { Route, Switch } from 'react-router'; import Journal from './Journal'; import JournalEdit from './JournalEdit'; +import JournalMembers from './JournalMembers'; import JournalsList from './JournalsList'; import { routeResolver } from '../App'; @@ -86,6 +87,15 @@ class Journals extends React.PureComponent { /> )} /> + ( + + )} + /> ( diff --git a/src/api/EteSync.ts b/src/api/EteSync.ts index 77eda10..eba0bb9 100644 --- a/src/api/EteSync.ts +++ b/src/api/EteSync.ts @@ -503,6 +503,29 @@ export class EntryManager extends BaseManager { } } +export interface JournalMemberJson { + user: string; + key: base64; +} + +export class JournalMembersManager extends BaseManager { + constructor(credentials: Credentials, apiBase: string, journalId: string) { + super(credentials, apiBase, ['journals', journalId, 'members', '']); + } + + list(): Promise { + return new Promise((resolve, reject) => { + this.newCall().then((json: Array<{}>) => { + resolve(json.map((val: JournalMemberJson) => { + return val; + })); + }).catch((error: Error) => { + reject(error); + }); + }); + } +} + export class UserInfoManager extends BaseManager { constructor(credentials: Credentials, apiBase: string) { super(credentials, apiBase, ['user', '']);