Collections: add a component that views the collection.
parent
d5a582e842
commit
9cf37a0fb4
|
@ -0,0 +1,102 @@
|
|||
// SPDX-FileCopyrightText: © 2017 EteSync Authors
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import * as React from "react";
|
||||
import IconButton from "@material-ui/core/IconButton";
|
||||
import IconEdit from "@material-ui/icons/Edit";
|
||||
import IconMembers from "@material-ui/icons/People";
|
||||
import IconImport from "@material-ui/icons/ImportExport";
|
||||
|
||||
|
||||
import AppBarOverride from "../widgets/AppBarOverride";
|
||||
import Container from "../widgets/Container";
|
||||
|
||||
/* FIXME:
|
||||
import CollectionEntries from "../components/CollectionEntries";
|
||||
import ImportDialog from "./ImportDialog";
|
||||
*/
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import { routeResolver } from "../App";
|
||||
|
||||
import { CachedCollection } from "../Pim/helpers";
|
||||
|
||||
interface PropsType {
|
||||
collection: CachedCollection;
|
||||
}
|
||||
|
||||
class Collection extends React.Component<PropsType> {
|
||||
public state: {
|
||||
tab: number;
|
||||
importDialogOpen: boolean;
|
||||
};
|
||||
|
||||
constructor(props: PropsType) {
|
||||
super(props);
|
||||
|
||||
this.importDialogToggle = this.importDialogToggle.bind(this);
|
||||
this.state = {
|
||||
tab: 0,
|
||||
importDialogOpen: false,
|
||||
};
|
||||
}
|
||||
|
||||
public render() {
|
||||
const { collection, metadata } = this.props.collection;
|
||||
const isAdmin = true; // FIXME
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<AppBarOverride title={metadata.name}>
|
||||
{isAdmin &&
|
||||
<>
|
||||
<IconButton
|
||||
component={Link}
|
||||
title="Edit"
|
||||
{...{ to: routeResolver.getRoute("collections._id.edit", { colUid: collection.uid }) }}
|
||||
>
|
||||
<IconEdit />
|
||||
</IconButton>
|
||||
<IconButton
|
||||
component={Link}
|
||||
title="Members"
|
||||
{...{ to: routeResolver.getRoute("collections._id.members", { colUid: collection.uid }) }}
|
||||
>
|
||||
<IconMembers />
|
||||
</IconButton>
|
||||
</>
|
||||
}
|
||||
<IconButton
|
||||
title="Import"
|
||||
onClick={this.importDialogToggle}
|
||||
>
|
||||
<IconImport />
|
||||
</IconButton>
|
||||
</AppBarOverride>
|
||||
<Container>
|
||||
Change entries: TBD
|
||||
</Container>
|
||||
{/*
|
||||
<Container>
|
||||
<CollectionEntries collection={collection} entries={syncEntries} />
|
||||
</Container>
|
||||
|
||||
<ImportDialog
|
||||
etesync={this.props.etesync}
|
||||
userInfo={this.props.userInfo}
|
||||
syncCollection={this.props.syncCollection}
|
||||
open={this.state.importDialogOpen}
|
||||
onClose={this.importDialogToggle}
|
||||
/>
|
||||
*/}
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
private importDialogToggle() {
|
||||
this.setState((state: any) => ({ importDialogOpen: !state.importDialogOpen }));
|
||||
}
|
||||
}
|
||||
|
||||
export default Collection;
|
|
@ -15,6 +15,7 @@ import { CachedCollection, getDecryptCollectionsFunction, PimFab } from "../Pim/
|
|||
import CollectionList from "./CollectionList";
|
||||
import PageNotFound from "../PageNotFound";
|
||||
import CollectionEdit from "./CollectionEdit";
|
||||
import Collection from "./Collection";
|
||||
|
||||
const decryptCollections = getDecryptCollectionsFunction();
|
||||
|
||||
|
@ -118,7 +119,7 @@ export default function CollectionsMain() {
|
|||
path={routeResolver.getRoute("collections._id")}
|
||||
exact
|
||||
>
|
||||
Journal view
|
||||
<Collection collection={collection} />
|
||||
</Route>
|
||||
</Switch>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue