mirror of
https://github.com/ilyakooo0/urbit.git
synced 2024-12-15 10:02:47 +03:00
links: remove members page
This commit is contained in:
parent
9a819746b9
commit
d2579b1658
@ -7,7 +7,6 @@ import './css/custom.css';
|
|||||||
|
|
||||||
import { Skeleton } from './components/skeleton';
|
import { Skeleton } from './components/skeleton';
|
||||||
import { NewScreen } from './components/new';
|
import { NewScreen } from './components/new';
|
||||||
import { MemberScreen } from './components/member';
|
|
||||||
import { SettingsScreen } from './components/settings';
|
import { SettingsScreen } from './components/settings';
|
||||||
import { MessageScreen } from './components/lib/message-screen';
|
import { MessageScreen } from './components/lib/message-screen';
|
||||||
import { Links } from './components/links-list';
|
import { Links } from './components/links-list';
|
||||||
@ -18,7 +17,6 @@ import {
|
|||||||
base64urlDecode
|
base64urlDecode
|
||||||
} from '../../../logic/lib/util';
|
} from '../../../logic/lib/util';
|
||||||
|
|
||||||
|
|
||||||
export class LinksApp extends Component {
|
export class LinksApp extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
@ -41,7 +39,6 @@ export class LinksApp extends Component {
|
|||||||
this.props.subscription.stopApp('link');
|
this.props.subscription.stopApp('link');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { props } = this;
|
const { props } = this;
|
||||||
|
|
||||||
@ -69,7 +66,6 @@ export class LinksApp extends Component {
|
|||||||
const invites = props.invites ?
|
const invites = props.invites ?
|
||||||
props.invites : {};
|
props.invites : {};
|
||||||
|
|
||||||
|
|
||||||
const listening = props.linkListening;
|
const listening = props.linkListening;
|
||||||
|
|
||||||
const { api, sidebarShown } = this.props;
|
const { api, sidebarShown } = this.props;
|
||||||
@ -133,46 +129,6 @@ export class LinksApp extends Component {
|
|||||||
autoJoin();
|
autoJoin();
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Route exact path="/~link/(popout)?/:resource/members"
|
|
||||||
render={(props) => {
|
|
||||||
const popout = props.match.url.includes('/popout/');
|
|
||||||
const resourcePath = '/' + props.match.params.resource;
|
|
||||||
const resource = associations.link[resourcePath] || { metadata: {} };
|
|
||||||
|
|
||||||
const contactDetails = contacts[resource['group-path']] || {};
|
|
||||||
const group = groups[resource['group-path']] || new Set([]);
|
|
||||||
const amOwner = amOwnerOfGroup(resource['group-path']);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Skeleton
|
|
||||||
associations={associations}
|
|
||||||
invites={invites}
|
|
||||||
groups={groups}
|
|
||||||
selected={resourcePath}
|
|
||||||
sidebarShown={sidebarShown}
|
|
||||||
links={links}
|
|
||||||
listening={listening}
|
|
||||||
api={api}
|
|
||||||
>
|
|
||||||
<MemberScreen
|
|
||||||
sidebarShown={sidebarShown}
|
|
||||||
resource={resource}
|
|
||||||
contacts={contacts}
|
|
||||||
contactDetails={contactDetails}
|
|
||||||
groupPath={resource['group-path']}
|
|
||||||
group={group}
|
|
||||||
groups={groups}
|
|
||||||
associations={associations}
|
|
||||||
amOwner={amOwner}
|
|
||||||
resourcePath={resourcePath}
|
|
||||||
popout={popout}
|
|
||||||
api={api}
|
|
||||||
{...props}
|
|
||||||
/>
|
|
||||||
</Skeleton>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<Route exact path="/~link/(popout)?/:resource/settings"
|
<Route exact path="/~link/(popout)?/:resource/settings"
|
||||||
render={ (props) => {
|
render={ (props) => {
|
||||||
const popout = props.match.url.includes('/popout/');
|
const popout = props.match.url.includes('/popout/');
|
||||||
@ -283,11 +239,8 @@ export class LinksApp extends Component {
|
|||||||
const page = props.match.params.page || 0;
|
const page = props.match.params.page || 0;
|
||||||
const url = base64urlDecode(props.match.params.encodedUrl);
|
const url = base64urlDecode(props.match.params.encodedUrl);
|
||||||
|
|
||||||
const data = links[resourcePath]
|
const data = links?.[resourcePath]?.[page]?.[index] || {};
|
||||||
? links[resourcePath][page]
|
|
||||||
? links[resourcePath][page][index]
|
|
||||||
: {}
|
|
||||||
: {};
|
|
||||||
const coms = !comments[resourcePath]
|
const coms = !comments[resourcePath]
|
||||||
? undefined
|
? undefined
|
||||||
: comments[resourcePath][url];
|
: comments[resourcePath][url];
|
||||||
|
@ -1,78 +0,0 @@
|
|||||||
import React, { Component } from 'react';
|
|
||||||
import { InviteSearch } from '../../../../components/InviteSearch';
|
|
||||||
import { Spinner } from '../../../../components/Spinner';
|
|
||||||
|
|
||||||
export class InviteElement extends Component {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.state = {
|
|
||||||
members: [],
|
|
||||||
error: false,
|
|
||||||
success: false,
|
|
||||||
awaiting: false
|
|
||||||
};
|
|
||||||
this.setInvite = this.setInvite.bind(this);
|
|
||||||
}
|
|
||||||
|
|
||||||
modifyMembers() {
|
|
||||||
const { props, state } = this;
|
|
||||||
|
|
||||||
const aud = state.members.map(mem => `~${mem}`);
|
|
||||||
|
|
||||||
if (state.members.length === 0) {
|
|
||||||
this.setState({
|
|
||||||
error: true,
|
|
||||||
success: false
|
|
||||||
});
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setState({ awaiting: true });
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
error: false,
|
|
||||||
success: true,
|
|
||||||
members: []
|
|
||||||
}, () => {
|
|
||||||
props.api.links.inviteToCollection(props.resourcePath, aud).then(() => {
|
|
||||||
this.setState({ awaiting: false });
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
setInvite(invite) {
|
|
||||||
this.setState({ members: invite.ships });
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { props, state } = this;
|
|
||||||
|
|
||||||
let modifyButtonClasses = 'mt4 db f9 ba pa2 white-d bg-gray0-d b--black b--gray2-d pointer';
|
|
||||||
if (state.error) {
|
|
||||||
modifyButtonClasses = modifyButtonClasses + ' gray3';
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<InviteSearch
|
|
||||||
groups={{}}
|
|
||||||
contacts={props.contacts}
|
|
||||||
groupResults={false}
|
|
||||||
shipResults={true}
|
|
||||||
invites={{
|
|
||||||
groups: [],
|
|
||||||
ships: this.state.members
|
|
||||||
}}
|
|
||||||
setInvite={this.setInvite}
|
|
||||||
/>
|
|
||||||
<button
|
|
||||||
onClick={this.modifyMembers.bind(this)}
|
|
||||||
className={modifyButtonClasses}
|
|
||||||
>
|
|
||||||
Invite
|
|
||||||
</button>
|
|
||||||
<Spinner awaiting={this.state.awaiting} text="Inviting to collection..." classes="mt3" />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -6,17 +6,11 @@ export class LinksTabBar extends Component {
|
|||||||
render() {
|
render() {
|
||||||
const props = this.props;
|
const props = this.props;
|
||||||
|
|
||||||
let memColor = '',
|
let setColor = '';
|
||||||
setColor = '';
|
|
||||||
|
|
||||||
if (props.location.pathname.includes('/settings')) {
|
if (props.location.pathname.includes('/settings')) {
|
||||||
memColor = 'gray3';
|
|
||||||
setColor = 'black white-d';
|
setColor = 'black white-d';
|
||||||
} else if (props.location.pathname.includes('/members')) {
|
|
||||||
memColor = 'black white-d';
|
|
||||||
setColor = 'gray3';
|
|
||||||
} else {
|
} else {
|
||||||
memColor = 'gray3';
|
|
||||||
setColor = 'gray3';
|
setColor = 'gray3';
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -26,18 +20,6 @@ export class LinksTabBar extends Component {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dib flex-shrink-0 flex-grow-1">
|
<div className="dib flex-shrink-0 flex-grow-1">
|
||||||
{props.amOwner ? (
|
|
||||||
<div className={'dib pt2 f9 pl6 lh-solid'}>
|
|
||||||
<Link
|
|
||||||
className={'no-underline ' + memColor}
|
|
||||||
to={makeRoutePath(props.resourcePath, props.popout) + '/members'}
|
|
||||||
>
|
|
||||||
Members
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="dib" style={{ width: 0 }}></div>
|
|
||||||
)}
|
|
||||||
<div className={'dib pt2 f9 pl6 pr6 lh-solid'}>
|
<div className={'dib pt2 f9 pl6 pr6 lh-solid'}>
|
||||||
<Link
|
<Link
|
||||||
className={'no-underline ' + setColor}
|
className={'no-underline ' + setColor}
|
||||||
|
@ -1,70 +0,0 @@
|
|||||||
import React, { Component } from 'react';
|
|
||||||
|
|
||||||
import { Link } from 'react-router-dom';
|
|
||||||
|
|
||||||
import { LoadingScreen } from './loading';
|
|
||||||
import { LinksTabBar } from './lib/links-tabbar';
|
|
||||||
import { MemberElement } from './lib/member-element';
|
|
||||||
import { SidebarSwitcher } from '../../../components/SidebarSwitch';
|
|
||||||
import { makeRoutePath } from '../../../../logic/lib/util';
|
|
||||||
import { GroupView } from '../../../components/Group';
|
|
||||||
|
|
||||||
export class MemberScreen extends Component {
|
|
||||||
render() {
|
|
||||||
const { props } = this;
|
|
||||||
|
|
||||||
if (!props.groupPath) {
|
|
||||||
return <LoadingScreen />;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className='h-100 w-100 overflow-x-hidden flex flex-column white-d'>
|
|
||||||
<div
|
|
||||||
className='w-100 dn-m dn-l dn-xl inter pt4 pb6 pl3 f8'
|
|
||||||
style={{ height: '1rem' }}
|
|
||||||
>
|
|
||||||
<Link to='/~link'>{'⟵ All Collections'}</Link>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className={`pl4 pt2 bb b--gray4 b--gray1-d bg-gray0-d flex relative
|
|
||||||
overflow-x-scroll overflow-x-auto-l overflow-x-auto-xl flex-shrink-0`}
|
|
||||||
style={{ height: 48 }}
|
|
||||||
>
|
|
||||||
<SidebarSwitcher
|
|
||||||
sidebarShown={this.props.sidebarShown}
|
|
||||||
popout={this.props.popout}
|
|
||||||
api={this.props.api}
|
|
||||||
/>
|
|
||||||
<Link
|
|
||||||
to={makeRoutePath(props.resourcePath, props.popout)}
|
|
||||||
className='pt2 white-d'
|
|
||||||
>
|
|
||||||
<h2
|
|
||||||
className='dib f9 fw4 lh-solid v-top'
|
|
||||||
style={{ width: 'max-content' }}
|
|
||||||
>
|
|
||||||
{props.resource.metadata.title}
|
|
||||||
</h2>
|
|
||||||
</Link>
|
|
||||||
<LinksTabBar
|
|
||||||
{...props}
|
|
||||||
groupPath={props.groupPath}
|
|
||||||
resourcePath={props.resourcePath}
|
|
||||||
amOwner={props.amOwner}
|
|
||||||
popout={props.popout}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className='w-100 pl3 mt0 mt4-m mt4-l mt4-xl cf pr6'>
|
|
||||||
<GroupView
|
|
||||||
group={props.group}
|
|
||||||
permissions
|
|
||||||
resourcePath={props.groupPath}
|
|
||||||
contacts={props.contacts}
|
|
||||||
groups={props.groups}
|
|
||||||
associations={props.associations}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user