urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2024-12-19 16:51:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

contacts: use invite-search for adding contacts

Browse Source
This commit is contained in:
Matilde Park 2020-02-20 18:36:39 -05:00
parent b2404d0cdc
commit 748a9059e1
2 changed files with 25 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
pkg/interface/contacts/src/js/components/lib/add-contact.js
View File

@ -1,7 +1,6 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Route, Link } from 'react-router-dom'; import { Route, Link } from 'react-router-dom';
import { deSig } from '/lib/util'; import { InviteSearch } from './invite-search';
import urbitOb from 'urbit-ob';
export class AddScreen extends Component { export class AddScreen extends Component {
@ -9,42 +8,26 @@ export class AddScreen extends Component {
super(props); super(props);
this.state = { this.state = {
invites: '', invites: {
inviteError: false groups: [],
ships: []
}
}; };
this.invChange = this.invChange.bind(this); this.invChange = this.invChange.bind(this);
} }
invChange(event) { invChange(value) {
this.setState({ this.setState({
invites: event.target.value invites: value
}); });
} }
onClickAdd() { onClickAdd() {
const { props, state } = this; const { props, state } = this;
let aud = []; let aud = state.invites.ships
let isValid = true; .map((ship) => `~${ship}`);
if (state.invites.length > 2) {
aud = state.invites.split(',')
.map((mem) => `~${deSig(mem.trim())}`);
aud.forEach((mem) => {
if (!urbitOb.isValidPatp(mem)) {
isValid = false;
}
});
}
if (!isValid) {
this.setState({
inviteError: true
});
return;
}
if (this.textarea) { if (this.textarea) {
this.textarea.value = ''; this.textarea.value = '';
@ -52,7 +35,10 @@ export class AddScreen extends Component {
this.setState({ this.setState({
error: false, error: false,
success: true, success: true,
invites: '' invites: {
groups: [],
ships: []
}
}, () => { }, () => {
props.api.setSpinner(true); props.api.setSpinner(true);
let submit = props.api.group.add(props.path, aud); let submit = props.api.group.add(props.path, aud);
@ -80,28 +66,23 @@ export class AddScreen extends Component {
<Link to={"/~contacts" + props.path}>{"⟵ All Contacts"}</Link> <Link to={"/~contacts" + props.path}>{"⟵ All Contacts"}</Link>
</div> </div>
<div className="w-100 w-70-l w-70-xl mb4 pr6 pr0-l pr0-xl"> <div className="w-100 w-70-l w-70-xl mb4 pr6 pr0-l pr0-xl">
<h2 className="f8 pl3 pt6">Add Group Members</h2> <h2 className="f8 pl4 pt4">Add Group Members</h2>
<p className="f9 pl3 gray2 lh-copy">Invite ships to your group</p> <p className="f9 pl4 gray2 lh-copy">Invite ships to your group</p>
<div className="relative"> <div className="relative pl4 mt2 pb6">
<textarea <InviteSearch
className="f8 ba b--gray3 w-100 pa3 pl3 ml3 mt2 mb2" groups={props.groups}
rows={1} groupResults={false}
placeholder="~zod, ~dopzod, ~ravmel-ropdyl" invites={this.state.invites}
style={{ setInvite={this.invChange}
resize: "none", />
height: 48,
paddingTop: 15
}}
onChange={this.invChange}/>
{invErrElem}
</div> </div>
<button <button
onClick={this.onClickAdd.bind(this)} onClick={this.onClickAdd.bind(this)}
className="ml3 f8 ba pa2 b--green2 green2 pointer"> className="ml4 f8 ba pa2 b--green2 green2 pointer">
Add Members Add Members
</button> </button>
<Link to="/~contacts"> <Link to="/~contacts">
<button className="f8 ml3 ba pa2 b--black pointer">Cancel</button> <button className="f8 ml4 ba pa2 b--black pointer">Cancel</button>
</Link> </Link>
</div> </div>
</div> </div>

1
pkg/interface/contacts/src/js/components/root.js
View File

@ -130,6 +130,7 @@ export class Root extends Component {
path={groupPath} /> path={groupPath} />
<AddScreen <AddScreen
api={api} api={api}
groups={groups}
path={groupPath} path={groupPath}
history={props.history} history={props.history}
/> />