SecureNotes/src/components/routes/vault/EntryList.tsx

57 lines
2.2 KiB
TypeScript
Executable File

import { h, Component } from "preact"
import { IVault, BaseNote } from "../../../notes";
import AddButton from "../../AddButton";
import Navigation from "../../../navigation";
import ArrowLeft from "feather-icons/dist/icons/arrow-left.svg"
import MoreVertival from "feather-icons/dist/icons/more-vertical.svg"
export default class EntryList extends Component<{ vault: Promise<IVault> }, { entries: BaseNote[] }> {
constructor(props) {
super(props)
this.state = { entries: [] }
}
vault: IVault;
async componentWillMount() {
this.vault = await this.props.vault;
this.vault.getAllNotes().then(entries => this.setState({ entries }))
}
render() {
const open_entry = (id: string | null) => {
Navigation.setPage("/vault", { id: this.vault.id }, { id, entry: "true" })
}
let elms = this.state.entries.map(entry => {
let [first, second] = entry.preview.split("\n", 2);
return <div class="vault_vault" onClick={() => {
open_entry(entry._id)
}}>
<span>{first}</span><br />
<span>{second}</span>
</div>
})
return <div>
<header>
<div>
<a class="button header_icon_button" onClick={() => history.back()}><ArrowLeft height={undefined} width={undefined} /></a>
</div>
<h1 style="display:inline" class="button header_title" onClick={() => Navigation.setPage("/")}>{this.vault ? this.vault.name : ""}</h1>
<a class="button header_icon_button"><MoreVertival height={undefined} width={undefined} /></a>
</header>
<AddButton onClick={() => open_entry(null)} />
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-8 col-lg-6 col-md-offset-2 col-lg-offset-3">
<div class="card fluid">
<h1 class="section double-padded">Notes: </h1>
<div class="section">
{elms}
</div>
</div>
</div>
</div>
</div>
</div>
}
}