roleypoly/v1
1
0
Fork 0
mirror of https://github.com/roleypoly/roleypoly-v1.git synced 2025-06-14 17:49:08 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: remove semi

Browse source
This commit is contained in:
Katie Thornhill 2019-11-19 23:06:33 -05:00
parent 4b75eaa0ab
commit 8fcc0dcbf9
No known key found for this signature in database
GPG key ID: F76EDC6541A99644
64 changed files with 1073 additions and 1073 deletions
Download patch file Download diff file Expand all files Collapse all files

4
UI/src/.prettierrc.js
View file

@ -5,5 +5,5 @@ module.exports = {
singleQuote: true,
trailingComma: 'es5',
bracketSpacing: true,
semi: true,
};
semi: false,
}

36
UI/src/App.js
View file

@ -1,26 +1,26 @@
import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { ConnectedRouter } from 'react-router-redux';
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import createHistory from 'history/createBrowserHistory';
import configureStore from './store/configureStore';
import './App.css';
import './generic.sass';
import React, { Component } from 'react'
import { Provider } from 'react-redux'
import { ConnectedRouter } from 'react-router-redux'
import { DragDropContext } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import createHistory from 'history/createBrowserHistory'
import configureStore from './store/configureStore'
import './App.css'
import './generic.sass'
import Wrapper from './components/wrapper';
import AppRouter from './router';
import { userInit } from './actions';
import Wrapper from './components/wrapper'
import AppRouter from './router'
import { userInit } from './actions'
const history = createHistory();
const store = configureStore(undefined, history);
const history = createHistory()
const store = configureStore(undefined, history)
window.__APP_STORE__ = store;
window.__APP_STORE__ = store
@DragDropContext(HTML5Backend)
class App extends Component {
componentWillMount() {
store.dispatch(userInit);
store.dispatch(userInit)
}
render() {
@ -32,8 +32,8 @@ class App extends Component {
</Wrapper>
</ConnectedRouter>
</Provider>
);
)
}
}
export default App;
export default App

12
UI/src/App.test.js
View file

@ -1,8 +1,8 @@
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(<App />, div);
});
const div = document.createElement('div')
ReactDOM.render(<App />, div)
})

74
UI/src/actions/index.js
View file

@ -1,88 +1,88 @@
import superagent from 'superagent';
import { push } from 'react-router-redux';
import superagent from 'superagent'
import { push } from 'react-router-redux'
export const fetchServers = async dispatch => {
const rsp = await superagent.get('/api/servers');
const rsp = await superagent.get('/api/servers')
dispatch({
type: Symbol.for('update servers'),
data: rsp.body,
});
})
dispatch({
type: Symbol.for('app ready'),
});
};
})
}
export const userInit = async dispatch => {
if (!window.location.pathname.startsWith('/oauth')) {
try {
const rsp = await superagent.get('/api/auth/user');
const rsp = await superagent.get('/api/auth/user')
dispatch({
type: Symbol.for('set user'),
data: rsp.body,
});
})
dispatch(fetchServers);
dispatch(fetchServers)
} catch (e) {
dispatch({
type: Symbol.for('app ready'),
});
})
// window.location.href = '/oauth/flow'
}
} else {
dispatch({
type: Symbol.for('app ready'),
});
})
}
};
}
export const userLogout = async dispatch => {
try {
await superagent.post('/api/auth/logout');
await superagent.post('/api/auth/logout')
} catch (e) {}
dispatch({
type: Symbol.for('reset user'),
});
})
window.location.href = '/';
};
window.location.href = '/'
}
export const startServerPolling = dispatch => {
return poll(window.__APP_STORE__.dispatch, window.__APP_STORE__.getState); // let's not cheat... :c
};
return poll(window.__APP_STORE__.dispatch, window.__APP_STORE__.getState) // let's not cheat... :c
}
const poll = (dispatch, getState) => {
const { servers } = getState();
let stop = false;
const { servers } = getState()
let stop = false
const stopPolling = () => {
stop = true;
};
stop = true
}
const pollFunc = async () => {
if (stop) {
return;
return
}
try {
await fetchServers(dispatch);
await fetchServers(dispatch)
} catch (e) {
console.error(e);
setTimeout(pollFunc, 5000);
console.error(e)
setTimeout(pollFunc, 5000)
}
const newServers = getState().servers;
const newServers = getState().servers
if (servers.size >= newServers.size) {
setTimeout(pollFunc, 5000);
setTimeout(pollFunc, 5000)
} else {
const old = servers.keySeq().toSet();
const upd = newServers.keySeq().toSet();
const newSrv = upd.subtract(old);
stopPolling();
dispatch(push(`/s/${newSrv.toJS()[0]}/edit`));
const old = servers.keySeq().toSet()
const upd = newServers.keySeq().toSet()
const newSrv = upd.subtract(old)
stopPolling()
dispatch(push(`/s/${newSrv.toJS()[0]}/edit`))
}
};
}
pollFunc();
return stopPolling;
};
pollFunc()
return stopPolling
}

8
UI/src/actions/ui.js
View file

@ -2,12 +2,12 @@ export const fadeOut = cb => dispatch => {
dispatch({
type: Symbol.for('app fade'),
data: true,
});
})
setTimeout(cb, 300);
};
setTimeout(cb, 300)
}
export const fadeIn = {
type: Symbol.for('app fade'),
data: false,
};
}

22
UI/src/components/add-server/index.js
View file

@ -1,23 +1,23 @@
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import TypingDemo from '../demos/typing';
import RoleypolyDemo from '../demos/roleypoly';
import * as Actions from '../../actions';
import './styles.sass';
import discordLogo from '../../pages/images/discord-logo.svg';
import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import TypingDemo from '../demos/typing'
import RoleypolyDemo from '../demos/roleypoly'
import * as Actions from '../../actions'
import './styles.sass'
import discordLogo from '../../pages/images/discord-logo.svg'
export default class AddServer extends Component {
polling = null;
polling = null
componentDidMount() {
if (this.props.match.params.server !== undefined) {
this.pollingStop = Actions.startServerPolling(this.props.dispatch);
this.pollingStop = Actions.startServerPolling(this.props.dispatch)
}
}
componentWillUnmount() {
if (this.pollingStop != null) {
this.pollingStop();
this.pollingStop()
}
}
@ -59,6 +59,6 @@ export default class AddServer extends Component {
</a>
</div>
</div>
);
)
}
}

8
UI/src/components/demos/roleypoly.js
View file

@ -1,5 +1,5 @@
import React from 'react';
import RoleDemo from '../role/demo';
import React from 'react'
import RoleDemo from '../role/demo'
const RoleypolyDemo = () => (
<div className="demo__roleypoly">
@ -9,6 +9,6 @@ const RoleypolyDemo = () => (
<RoleDemo name="a proud role ♡" color="#5C8B88" />
<RoleDemo name="a wonderful role ♡" color="#D6B3C7" />
</div>
);
)
export default RoleypolyDemo;
export default RoleypolyDemo

12
UI/src/components/demos/typing.js
View file

@ -1,7 +1,7 @@
import React from 'react';
import moment from 'moment';
import Typist from 'react-typist';
import './typing.sass';
import React from 'react'
import moment from 'moment'
import Typist from 'react-typist'
import './typing.sass'
const Typing = () => (
<div className="demo__discord rp-discord">
@ -26,6 +26,6 @@ const Typing = () => (
</Typist>
</div>
</div>
);
)
export default Typing;
export default Typing

10
UI/src/components/dev-tools/index.js
View file

@ -1,10 +1,10 @@
import React from 'react';
import { createDevTools } from 'redux-devtools';
import LogMonitor from 'redux-devtools-log-monitor';
import DockMonitor from 'redux-devtools-dock-monitor';
import React from 'react'
import { createDevTools } from 'redux-devtools'
import LogMonitor from 'redux-devtools-log-monitor'
import DockMonitor from 'redux-devtools-dock-monitor'
export default createDevTools(
<DockMonitor toggleVisibilityKey="`" changePositionKey="ctrl-w">
<LogMonitor />
</DockMonitor>
);
)

6
UI/src/components/logotype/index.js
View file

@ -1,4 +1,4 @@
import React from 'react';
import React from 'react'
const Logotype = ({
fill = 'var(--c-7)',
@ -39,6 +39,6 @@ const Logotype = ({
></use>
</g>
</svg>
);
)
export default Logotype;
export default Logotype

24
UI/src/components/oauth-bot-flow/index.js
View file

@ -1,9 +1,9 @@
import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';
import superagent from 'superagent';
import { connect } from 'react-redux';
import { push } from 'react-router-redux';
import { fetchServers } from '../../actions';
import React, { Component } from 'react'
import { Redirect } from 'react-router-dom'
import superagent from 'superagent'
import { connect } from 'react-redux'
import { push } from 'react-router-redux'
import { fetchServers } from '../../actions'
@connect()
class OauthCallback extends Component {
@ -11,14 +11,14 @@ class OauthCallback extends Component {
notReady: true,
message: 'chotto matte kudasai...',
url: null,
};
}
async componentDidMount() {
const {
body: { url },
} = await superagent.get('/api/oauth/bot?url=✔️');
this.setState({ url, notReady: false });
window.location.href = url;
} = await superagent.get('/api/oauth/bot?url=✔️')
this.setState({ url, notReady: false })
window.location.href = url
}
render() {
@ -28,8 +28,8 @@ class OauthCallback extends Component {
<a style={{ zIndex: 10000 }} href={this.state.url}>
Something oopsed, click me to get to where you meant.
</a>
);
)
}
}
export default OauthCallback;
export default OauthCallback

68
UI/src/components/oauth-callback/index.js
View file

@ -1,8 +1,8 @@
import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';
import superagent from 'superagent';
import { connect } from 'react-redux';
import { fetchServers } from '../../actions';
import React, { Component } from 'react'
import { Redirect } from 'react-router-dom'
import superagent from 'superagent'
import { connect } from 'react-redux'
import { fetchServers } from '../../actions'
@connect()
class OauthCallback extends Component {
@ -10,66 +10,66 @@ class OauthCallback extends Component {
notReady: true,
message: 'chotto matte kudasai...',
redirect: '/s',
};
}
stopped = false;
stopped = false
componentDidUnmount() {
this.stopped = true;
this.stopped = true
}
async componentDidMount() {
// handle stuff in the url
const sp = new URLSearchParams(this.props.location.search);
const token = sp.get('code');
const sp = new URLSearchParams(this.props.location.search)
const token = sp.get('code')
if (token === '' || token == null) {
this.setState({ message: 'token missing, what are you trying to do?!' });
return;
this.setState({ message: 'token missing, what are you trying to do?!' })
return
}
const stateToken = sp.get('state');
const state = JSON.parse(window.sessionStorage.getItem('state') || 'null');
const stateToken = sp.get('state')
const state = JSON.parse(window.sessionStorage.getItem('state') || 'null')
if (state !== null && state.state === stateToken && state.redirect != null) {
this.setState({ redirect: state.redirect });
this.setState({ redirect: state.redirect })
}
this.props.history.replace(this.props.location.pathname);
this.props.history.replace(this.props.location.pathname)
let counter = 0;
let counter = 0
const retry = async () => {
if (this.stopped) return;
if (this.stopped) return
try {
const rsp = await superagent.get('/api/auth/user');
const rsp = await superagent.get('/api/auth/user')
this.props.dispatch({
type: Symbol.for('set user'),
data: rsp.body,
});
this.props.dispatch(fetchServers);
this.setState({ notReady: false });
})
this.props.dispatch(fetchServers)
this.setState({ notReady: false })
} catch (e) {
counter++;
counter++
if (counter > 10) {
this.setState({ message: "i couldn't log you in. :c" });
this.setState({ message: "i couldn't log you in. :c" })
} else {
setTimeout(() => {
retry();
}, 250);
retry()
}, 250)
}
}
};
}
// pass token to backend, await it to finish it's business.
try {
await superagent.post('/api/auth/token').send({ token });
await superagent.post('/api/auth/token').send({ token })
// this.props.onLogin(rsp.body)
retry();
retry()
} catch (e) {
console.error('token pass error', e);
this.setState({ message: 'g-gomen nasai... i broke it...' });
return;
console.error('token pass error', e)
this.setState({ message: 'g-gomen nasai... i broke it...' })
return
}
// update user stuff here
@ -80,8 +80,8 @@ class OauthCallback extends Component {
this.state.message
) : (
<Redirect to={this.state.redirect} />
);
)
}
}
export default OauthCallback;
export default OauthCallback

58
UI/src/components/oauth-flow/index.js
View file

@ -1,9 +1,9 @@
import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';
import superagent from 'superagent';
import { connect } from 'react-redux';
import uuidv4 from 'uuid/v4';
import { fetchServers } from '../../actions';
import React, { Component } from 'react'
import { Redirect } from 'react-router-dom'
import superagent from 'superagent'
import { connect } from 'react-redux'
import uuidv4 from 'uuid/v4'
import { fetchServers } from '../../actions'
@connect()
class OauthCallback extends Component {
@ -12,60 +12,60 @@ class OauthCallback extends Component {
message: 'chotto matte kudasai...',
redirect: '/s',
url: null,
};
}
async fetchUser() {
const rsp = await superagent.get('/api/auth/user');
sessionStorage.setItem('user', JSON.stringify(rsp.body));
sessionStorage.setItem('user.update', JSON.stringify(Date.now()));
const rsp = await superagent.get('/api/auth/user')
sessionStorage.setItem('user', JSON.stringify(rsp.body))
sessionStorage.setItem('user.update', JSON.stringify(Date.now()))
this.props.dispatch({
type: Symbol.for('set user'),
data: rsp.body,
});
})
}
setupUser() {
const userUpdateTime = sessionStorage.getItem('user.update') || 0;
const userUpdateTime = sessionStorage.getItem('user.update') || 0
if (+userUpdateTime + 1000 * 60 * 10 > Date.now()) {
const user = sessionStorage.getItem('user');
const user = sessionStorage.getItem('user')
if (user != null && user !== '') {
this.props.dispatch({
type: Symbol.for('set user'),
data: JSON.parse(user),
});
})
}
}
return this.fetchUser();
return this.fetchUser()
}
async componentDidMount() {
const state = uuidv4();
const state = uuidv4()
const oUrl = new URL(window.location.href);
const oUrl = new URL(window.location.href)
if (oUrl.searchParams.has('r')) {
this.setState({ redirect: oUrl.searchParams.get('r') });
this.setState({ redirect: oUrl.searchParams.get('r') })
}
window.sessionStorage.setItem(
'state',
JSON.stringify({ state, redirect: oUrl.searchParams.get('r') })
);
)
try {
await this.setupUser();
await this.setupUser()
this.props.dispatch(fetchServers);
this.setState({ notReady: false });
this.props.dispatch(fetchServers)
this.setState({ notReady: false })
} catch (e) {
const {
body: { url },
} = await superagent.get('/api/auth/redirect?url=✔️');
const nUrl = new URL(url);
} = await superagent.get('/api/auth/redirect?url=✔️')
const nUrl = new URL(url)
nUrl.searchParams.set('state', state);
this.setState({ url: nUrl.toString() });
window.location.href = nUrl.toString();
nUrl.searchParams.set('state', state)
this.setState({ url: nUrl.toString() })
window.location.href = nUrl.toString()
}
}
@ -79,8 +79,8 @@ class OauthCallback extends Component {
Something oopsed, click me to get to where you meant.
</a>
</>
);
)
}
}
export default OauthCallback;
export default OauthCallback

20
UI/src/components/role-editor/Category.js
View file

@ -1,19 +1,19 @@
import React, { Component } from 'react';
import { DropTarget } from 'react-dnd';
import React, { Component } from 'react'
import { DropTarget } from 'react-dnd'
import Role from '../role/draggable';
import CategoryEditor from './CategoryEditor';
import Role from '../role/draggable'
import CategoryEditor from './CategoryEditor'
@DropTarget(
Symbol.for('dnd: role'),
{
drop(props, monitor, element) {
props.onDrop(monitor.getItem());
props.onDrop(monitor.getItem())
},
canDrop(props, monitor) {
return (
props.mode !== Symbol.for('edit') && monitor.getItem().category !== props.name
);
)
},
},
(connect, monitor) => ({
@ -35,10 +35,10 @@ class Category extends Component {
mode,
onEditOpen,
...rest
} = this.props;
} = this.props
if (mode === Symbol.for('edit')) {
return <CategoryEditor category={category} name={name} {...rest} />;
return <CategoryEditor category={category} name={name} {...rest} />
}
return connectDropTarget(
@ -63,7 +63,7 @@ class Category extends Component {
.map((r, k) => <Role key={k} role={r} categoryId={name} />)
.toArray()}
</div>
);
)
}
}
export default Category;
export default Category

12
UI/src/components/role-editor/CategoryEditor.js
View file

@ -1,18 +1,18 @@
import React, { Component } from 'react';
import React, { Component } from 'react'
export default class CategoryEditor extends Component {
onKeyPress = e => {
const { onSave } = this.props;
const { onSave } = this.props
switch (e.key) {
case 'Enter':
case 'Escape':
return onSave();
return onSave()
}
};
}
render() {
const { category } = this.props;
const { category } = this.props
return (
<div className="role-editor__category editor" onKeyDown={this.onKeyPress}>
@ -104,6 +104,6 @@ export default class CategoryEditor extends Component {
</div>
</div>
</div>
);
)
}
}

112
UI/src/components/role-editor/actions.js
View file

@ -1,15 +1,15 @@
import { Set } from 'immutable';
import * as UIActions from '../../actions/ui';
import { getViewMap, setup } from '../role-picker/actions';
import uuidv4 from 'uuid/v4';
import superagent from 'superagent';
import { Set } from 'immutable'
import * as UIActions from '../../actions/ui'
import { getViewMap, setup } from '../role-picker/actions'
import uuidv4 from 'uuid/v4'
import superagent from 'superagent'
export const constructView = id => async (dispatch, getState) => {
await setup(id)(dispatch);
const server = getState().servers.get(id);
await setup(id)(dispatch)
const server = getState().servers.get(id)
let { viewMap, hasSafeRoles } = getViewMap(server);
viewMap = viewMap.map((c, idx) => c.set('mode', Symbol.for('drop')));
let { viewMap, hasSafeRoles } = getViewMap(server)
viewMap = viewMap.map((c, idx) => c.set('mode', Symbol.for('drop')))
dispatch({
type: Symbol.for('re: setup'),
@ -18,10 +18,10 @@ export const constructView = id => async (dispatch, getState) => {
viewMap,
originalSnapshot: viewMap,
},
});
})
dispatch(UIActions.fadeIn);
};
dispatch(UIActions.fadeIn)
}
export const addRoleToCategory = (id, oldId, role, flip = true) => dispatch => {
dispatch({
@ -30,12 +30,12 @@ export const addRoleToCategory = (id, oldId, role, flip = true) => dispatch => {
id,
role,
},
});
})
if (flip) {
dispatch(removeRoleFromCategory(oldId, id, role, false));
dispatch(removeRoleFromCategory(oldId, id, role, false))
}
};
}
export const removeRoleFromCategory = (id, oldId, role, flip = true) => dispatch => {
dispatch({
@ -44,12 +44,12 @@ export const removeRoleFromCategory = (id, oldId, role, flip = true) => dispatch
id,
role,
},
});
})
if (flip) {
dispatch(addRoleToCategory(oldId, id, role, false));
dispatch(addRoleToCategory(oldId, id, role, false))
}
};
}
export const editCategory = ({ id, key, value }) => dispatch => {
dispatch({
@ -59,12 +59,12 @@ export const editCategory = ({ id, key, value }) => dispatch => {
key,
value,
},
});
};
})
}
export const saveCategory = (id, category) => dispatch => {
if (category.get('name') === '') {
return;
return
}
dispatch({
@ -73,8 +73,8 @@ export const saveCategory = (id, category) => dispatch => {
id,
mode: Symbol.for('drop'),
},
});
};
})
}
export const openEditor = id => ({
type: Symbol.for('re: switch category mode'),
@ -82,13 +82,13 @@ export const openEditor = id => ({
id,
mode: Symbol.for('edit'),
},
});
})
export const deleteCategory = (id, category) => (dispatch, getState) => {
const roles = category.get('roles');
const rolesMap = category.get('roles_map');
const roles = category.get('roles')
const rolesMap = category.get('roles_map')
let uncategorized = getState().roleEditor.getIn(['viewMap', 'Uncategorized']);
let uncategorized = getState().roleEditor.getIn(['viewMap', 'Uncategorized'])
dispatch({
type: Symbol.for('re: set category'),
@ -101,27 +101,27 @@ export const deleteCategory = (id, category) => (dispatch, getState) => {
type: 'multi',
mode: null,
},
});
})
dispatch({
type: Symbol.for('re: delete category'),
data: id,
});
};
})
}
export const createCategory = (dispatch, getState) => {
const { roleEditor } = getState();
const vm = roleEditor.get('viewMap');
const { roleEditor } = getState()
const vm = roleEditor.get('viewMap')
let name = 'New Category';
let idx = 1;
const pred = c => c.get('name') === name;
let name = 'New Category'
let idx = 1
const pred = c => c.get('name') === name
while (vm.find(pred) !== undefined) {
idx++;
name = `New Category ${idx}`;
idx++
name = `New Category ${idx}`
}
const id = uuidv4();
const id = uuidv4()
dispatch({
type: Symbol.for('re: set category'),
@ -135,17 +135,17 @@ export const createCategory = (dispatch, getState) => {
position: idx,
mode: Symbol.for('edit'),
},
});
};
})
}
export const bumpCategory = (category, name) => move => async (dispatch, getState) => {
const { roleEditor } = getState();
const vm = roleEditor.get('viewMap');
const { roleEditor } = getState()
const vm = roleEditor.get('viewMap')
const position = category.get('position');
const nextPos = position + move;
const position = category.get('position')
const nextPos = position + move
const replaceThisOne = vm.findKey(category => category.get('position') === nextPos);
const replaceThisOne = vm.findKey(category => category.get('position') === nextPos)
dispatch({
type: Symbol.for('re: edit category'),
@ -154,7 +154,7 @@ export const bumpCategory = (category, name) => move => async (dispatch, getStat
key: 'position',
value: nextPos,
},
});
})
if (!!replaceThisOne) {
dispatch({
@ -164,9 +164,9 @@ export const bumpCategory = (category, name) => move => async (dispatch, getStat
key: 'position',
value: position,
},
});
})
}
};
}
export const saveServer = id => async (dispatch, getState) => {
const viewMap = getState()
@ -177,21 +177,21 @@ export const saveServer = id => async (dispatch, getState) => {
.delete('roles_map')
.delete('mode')
.delete('id')
);
)
viewMap.map((v, idx) => {
if (v.has('position')) {
return v;
return v
}
console.warn('category position wasnt set, so fake ones are being made', {
cat: v.toJS(),
idx,
position: viewMap.count() + idx,
});
return v.set('position', viewMap.count() + idx);
});
})
return v.set('position', viewMap.count() + idx)
})
await superagent.patch(`/api/server/${id}`).send({ categories: viewMap.toJS() });
dispatch({ type: Symbol.for('re: swap original state') });
};
await superagent.patch(`/api/server/${id}`).send({ categories: viewMap.toJS() })
dispatch({ type: Symbol.for('re: swap original state') })
}

122
UI/src/components/role-editor/index.js
View file

@ -1,33 +1,33 @@
import React, { Component } from 'react';
import { Set } from 'immutable';
import { connect } from 'react-redux';
import { DropTarget } from 'react-dnd';
import { Link, Prompt, Redirect } from 'react-router-dom';
import { Scrollbars } from 'react-custom-scrollbars';
import * as Actions from './actions';
import * as PickerActions from '../role-picker/actions';
import * as UIActions from '../../actions/ui';
import './RoleEditor.sass';
import React, { Component } from 'react'
import { Set } from 'immutable'
import { connect } from 'react-redux'
import { DropTarget } from 'react-dnd'
import { Link, Prompt, Redirect } from 'react-router-dom'
import { Scrollbars } from 'react-custom-scrollbars'
import * as Actions from './actions'
import * as PickerActions from '../role-picker/actions'
import * as UIActions from '../../actions/ui'
import './RoleEditor.sass'
import Category from './Category';
import CategoryEditor from './CategoryEditor';
import Role from '../role/draggable';
import Category from './Category'
import CategoryEditor from './CategoryEditor'
import Role from '../role/draggable'
const mapState = ({ rolePicker, roleEditor, servers }, ownProps) => ({
rp: rolePicker,
editor: roleEditor,
server: servers.get(ownProps.match.params.server),
});
})
@connect(mapState)
@DropTarget(
Symbol.for('dnd: role'),
{
drop(props, monitor, element) {
element.dropRole({}, 'Uncategorized')(monitor.getItem());
element.dropRole({}, 'Uncategorized')(monitor.getItem())
},
canDrop(props, monitor) {
return monitor.getItem().category !== 'Uncategorized';
return monitor.getItem().category !== 'Uncategorized'
},
},
(connect, monitor) => ({
@ -45,75 +45,75 @@ class RoleEditor extends Component {
match: {
params: { server },
},
} = this.props;
dispatch(Actions.constructView(server));
} = this.props
dispatch(Actions.constructView(server))
}
componentWillReceiveProps(nextProps) {
if (this.props.match.params.server !== nextProps.match.params.server) {
const { dispatch } = this.props;
const { dispatch } = this.props
dispatch(
UIActions.fadeOut(() =>
dispatch(Actions.constructView(nextProps.match.params.server))
)
);
)
}
}
dropRole = (category, name) => ({ role, category }) => {
const { dispatch } = this.props;
console.log(role);
dispatch(Actions.addRoleToCategory(name, category, role));
};
const { dispatch } = this.props
console.log(role)
dispatch(Actions.addRoleToCategory(name, category, role))
}
createCategory = () => {
const { dispatch } = this.props;
dispatch(Actions.createCategory);
};
const { dispatch } = this.props
dispatch(Actions.createCategory)
}
saveCategory = (category, name) => () => {
const { dispatch } = this.props;
dispatch(Actions.saveCategory(name, category));
};
const { dispatch } = this.props
dispatch(Actions.saveCategory(name, category))
}
deleteCategory = (category, id) => () => {
const { dispatch } = this.props;
dispatch(Actions.deleteCategory(id, category));
};
const { dispatch } = this.props
dispatch(Actions.deleteCategory(id, category))
}
openEditor = (category, name) => () => {
const { dispatch } = this.props;
dispatch(Actions.openEditor(name));
};
const { dispatch } = this.props
dispatch(Actions.openEditor(name))
}
editCategory = (category, id) => (key, type) => event => {
const { dispatch } = this.props;
let value;
const { dispatch } = this.props
let value
switch (type) {
case Symbol.for('edit: text'):
value = event.target.value;
break;
value = event.target.value
break
case Symbol.for('edit: bool'):
value = event.target.checked;
break;
value = event.target.checked
break
case Symbol.for('edit: select'):
value = event.target.value;
break;
value = event.target.value
break
default:
value = null;
value = null
}
dispatch(Actions.editCategory({ category, id, key, type, value }));
};
dispatch(Actions.editCategory({ category, id, key, type, value }))
}
resetServer = () => {
const { dispatch } = this.props;
dispatch({ type: Symbol.for('re: reset') });
};
const { dispatch } = this.props
dispatch({ type: Symbol.for('re: reset') })
}
saveServer = () => {
const {
@ -121,32 +121,32 @@ class RoleEditor extends Component {
match: {
params: { server },
},
} = this.props;
dispatch(Actions.saveServer(server));
};
} = this.props
dispatch(Actions.saveServer(server))
}
onBump = (category, name) => move => () =>
this.props.dispatch(Actions.bumpCategory(category, name)(move));
this.props.dispatch(Actions.bumpCategory(category, name)(move))
get hasChanged() {
return (
this.props.editor.get('originalSnapshot').hashCode() !==
this.props.editor.get('viewMap').hashCode()
);
)
}
render() {
const { server } = this.props;
const { server } = this.props
if (server == null) {
return null;
return null
}
if (server.getIn(['perms', 'canManageRoles']) !== true) {
return <Redirect to={`/s/${server.get('id')}`} />;
return <Redirect to={`/s/${server.get('id')}`} />
}
const vm = this.props.editor.get('viewMap');
const vm = this.props.editor.get('viewMap')
return (
<div className="inner role-editor">
<Prompt
@ -231,8 +231,8 @@ class RoleEditor extends Component {
)}
</div>
</div>
);
)
}
}
export default RoleEditor;
export default RoleEditor

36
UI/src/components/role-picker/Category.js
View file

@ -1,11 +1,11 @@
import React, { Component } from 'react';
import { Map } from 'immutable';
import React, { Component } from 'react'
import { Map } from 'immutable'
import Role from '../role';
import Role from '../role'
class Category extends Component {
toggleRoleMulti(id, next) {
this.props.onChange(Map({ [id]: next }));
this.props.onChange(Map({ [id]: next }))
}
toggleRoleSingle(id, next) {
@ -14,31 +14,31 @@ class Category extends Component {
.get('roles')
.reduce((acc, i) => acc.set(i, false), Map())
.set(id, next)
);
)
}
onRoleToggle = id => (next, old) => {
const type = this.props.category.get('type');
const type = this.props.category.get('type')
switch (type) {
case 'single':
return this.toggleRoleSingle(id, next);
return this.toggleRoleSingle(id, next)
case 'multi':
return this.toggleRoleMulti(id, next);
return this.toggleRoleMulti(id, next)
default:
console.warn('DEFAULTING TO MULTI', id, next, old);
return this.toggleRoleMulti(id, next);
console.warn('DEFAULTING TO MULTI', id, next, old)
return this.toggleRoleMulti(id, next)
}
};
}
render() {
const { category, name, isSelected } = this.props;
const { category, name, isSelected } = this.props
if (category.get('hidden')) {
return null;
return null
}
if (category.get('roles').count() === 0) {
return null;
return null
}
return (
@ -49,7 +49,7 @@ class Category extends Component {
.sortBy(r => r.get('position'))
.reverse()
.map((r, k) => {
const id = r.get('id');
const id = r.get('id')
return (
<Role
key={k}
@ -58,11 +58,11 @@ class Category extends Component {
selected={isSelected(id)}
onToggle={this.onRoleToggle(id)}
/>
);
)
})
.toArray()}
</div>
);
)
}
}
export default Category;
export default Category

100
UI/src/components/role-picker/actions.js
View file

@ -1,10 +1,10 @@
import { Map, Set, fromJS } from 'immutable';
import superagent from 'superagent';
import * as UIActions from '../../actions/ui';
import { Map, Set, fromJS } from 'immutable'
import superagent from 'superagent'
import * as UIActions from '../../actions/ui'
export const setup = id => async dispatch => {
const rsp = await superagent.get(`/api/server/${id}`);
const data = rsp.body;
const rsp = await superagent.get(`/api/server/${id}`)
const data = rsp.body
dispatch({
type: Symbol.for('server: set'),
@ -12,25 +12,25 @@ export const setup = id => async dispatch => {
id,
...data,
},
});
dispatch(constructView(id));
};
})
dispatch(constructView(id))
}
export const getViewMap = server => {
const roles = server.get('roles');
const categories = server.get('categories');
const categoriesIds = server.get('categories').keySeq();
const roles = server.get('roles')
const categories = server.get('categories')
const categoriesIds = server.get('categories').keySeq()
const allRoles = server
.get('roles')
.filter(v => v.get('safe'))
.map(r => r.get('id'))
.toSet();
.toSet()
const accountedRoles = categories
.map(c => c.get('roles'))
.toSet()
.flatten();
const unaccountedRoles = allRoles.subtract(accountedRoles);
.flatten()
const unaccountedRoles = allRoles.subtract(accountedRoles)
// console.log('roles', allRoles.toJS(), accountedRoles.toJS(), unaccountedRoles.toJS())
@ -61,29 +61,29 @@ export const getViewMap = server => {
.map(r => server.get('roles').find(sr => sr.get('id') === r))
.filter(r => r != null)
// sort by server position, backwards.
.sort((a, b) => a.position > b.position);
.sort((a, b) => a.position > b.position)
// force data to sets
return c.set('roles_map', Set(roles)).set('roles', Set(c.get('roles')));
});
return c.set('roles_map', Set(roles)).set('roles', Set(c.get('roles')))
})
const selected = roles.reduce(
(acc, r) => acc.set(r.get('id'), r.get('selected')),
Map()
);
)
const hasSafeRoles = allRoles.size > 0;
const hasSafeRoles = allRoles.size > 0
return {
viewMap,
selected,
hasSafeRoles,
};
};
}
}
export const constructView = id => (dispatch, getState) => {
const server = getState().servers.get(id);
const server = getState().servers.get(id)
const { viewMap, selected } = getViewMap(server);
const { viewMap, selected } = getViewMap(server)
dispatch({
type: Symbol.for('rp: setup role picker'),
@ -95,77 +95,77 @@ export const constructView = id => (dispatch, getState) => {
isEditingMessage: false,
messageBuffer: '',
},
});
})
dispatch(UIActions.fadeIn);
};
dispatch(UIActions.fadeIn)
}
export const resetSelected = dispatch => {
dispatch({
type: Symbol.for('rp: reset selected'),
});
};
})
}
export const submitSelected = serverId => async (dispatch, getState) => {
const { rolePicker } = getState();
const original = rolePicker.get('originalRolesSelected');
const current = rolePicker.get('rolesSelected');
const { rolePicker } = getState()
const original = rolePicker.get('originalRolesSelected')
const current = rolePicker.get('rolesSelected')
const diff = original.reduce((acc, v, k) => {
if (current.get(k) !== v) {
// if original value is false, then we know we're adding, otherwise removing.
if (v !== true) {
return acc.set('added', acc.get('added').add(k));
return acc.set('added', acc.get('added').add(k))
} else {
return acc.set('removed', acc.get('removed').add(k));
return acc.set('removed', acc.get('removed').add(k))
}
}
return acc;
}, Map({ added: Set(), removed: Set() }));
return acc
}, Map({ added: Set(), removed: Set() }))
await superagent.patch(`/api/servers/${serverId}/roles`).send(diff.toJS());
await superagent.patch(`/api/servers/${serverId}/roles`).send(diff.toJS())
dispatch({
type: Symbol.for('rp: sync selected roles'),
});
};
})
}
export const updateRoles = roles => ({
type: Symbol.for('rp: update selected roles'),
data: roles,
});
})
export const openMessageEditor = id => (dispatch, getState) => {
const message = getState().servers.getIn([id, 'message']);
dispatch(editServerMessage(id, message));
const message = getState().servers.getIn([id, 'message'])
dispatch(editServerMessage(id, message))
dispatch({
type: Symbol.for('rp: set message editor state'),
data: true,
});
};
})
}
export const saveServerMessage = id => async (dispatch, getState) => {
const message = getState().rolePicker.get('messageBuffer');
const message = getState().rolePicker.get('messageBuffer')
await superagent.patch(`/api/server/${id}`).send({ message });
await superagent.patch(`/api/server/${id}`).send({ message })
dispatch(closeMessageEditor);
dispatch(closeMessageEditor)
dispatch({
type: Symbol.for('server: edit message'),
data: {
id,
message,
},
});
};
})
}
export const editServerMessage = (id, message) => ({
type: Symbol.for('rp: edit message buffer'),
data: message,
});
})
export const closeMessageEditor = {
type: Symbol.for('rp: set message editor state'),
data: false,
};
}

96
UI/src/components/role-picker/index.js
View file

@ -1,22 +1,22 @@
import React, { Component, Fragment } from 'react';
import { connect } from 'react-redux';
import { Prompt } from 'react-router-dom';
import superagent from 'superagent';
import * as Actions from './actions';
import * as UIActions from '../../actions/ui';
import { msgToReal } from '../../utils';
import './RolePicker.sass';
import React, { Component, Fragment } from 'react'
import { connect } from 'react-redux'
import { Prompt } from 'react-router-dom'
import superagent from 'superagent'
import * as Actions from './actions'
import * as UIActions from '../../actions/ui'
import { msgToReal } from '../../utils'
import './RolePicker.sass'
import Category from './Category';
import { Scrollbars } from 'react-custom-scrollbars';
import { Link } from 'react-router-dom';
import Category from './Category'
import { Scrollbars } from 'react-custom-scrollbars'
import { Link } from 'react-router-dom'
const mapState = ({ rolePicker, servers }, ownProps) => {
return {
data: rolePicker,
server: servers.get(ownProps.match.params.server),
};
};
}
}
@connect(mapState)
class RolePicker extends Component {
@ -26,59 +26,59 @@ class RolePicker extends Component {
match: {
params: { server },
},
} = this.props;
dispatch(Actions.setup(server));
} = this.props
dispatch(Actions.setup(server))
}
componentWillReceiveProps(nextProps) {
if (this.props.match.params.server !== nextProps.match.params.server) {
const { dispatch } = this.props;
const { dispatch } = this.props
dispatch(
UIActions.fadeOut(() => dispatch(Actions.setup(nextProps.match.params.server)))
);
)
}
}
get serverId() {
return this.props.server.get('id');
return this.props.server.get('id')
}
isSelected = id => {
return this.props.data.getIn(['rolesSelected', id]);
};
return this.props.data.getIn(['rolesSelected', id])
}
get rolesHaveChanged() {
const { data } = this.props;
return !data.get('rolesSelected').equals(data.get('originalRolesSelected'));
const { data } = this.props
return !data.get('rolesSelected').equals(data.get('originalRolesSelected'))
}
editServerMessage = e => {
const { dispatch } = this.props;
dispatch(Actions.editServerMessage(this.serverId, e.target.value));
};
const { dispatch } = this.props
dispatch(Actions.editServerMessage(this.serverId, e.target.value))
}
saveServerMessage = e => {
const { dispatch } = this.props;
dispatch(Actions.saveServerMessage(this.serverId));
};
const { dispatch } = this.props
dispatch(Actions.saveServerMessage(this.serverId))
}
openMessageEditor = () => {
const { dispatch } = this.props;
dispatch(Actions.openMessageEditor(this.serverId));
};
const { dispatch } = this.props
dispatch(Actions.openMessageEditor(this.serverId))
}
closeMessageEditor = () => {
const { dispatch } = this.props;
dispatch(Actions.closeMessageEditor);
};
const { dispatch } = this.props
dispatch(Actions.closeMessageEditor)
}
renderServerMessage(server) {
const isEditing = this.props.data.get('isEditingMessage');
const roleManager = server.getIn(['perms', 'canManageRoles']);
const msg = server.get('message');
const msgBuffer = this.props.data.get('messageBuffer');
const isEditing = this.props.data.get('isEditingMessage')
const roleManager = server.getIn(['perms', 'canManageRoles'])
const msg = server.get('message')
const msgBuffer = this.props.data.get('messageBuffer')
console.log(msg, roleManager, isEditing, this.props.data.toJS());
console.log(msg, roleManager, isEditing, this.props.data.toJS())
if (!roleManager && msg !== '') {
return (
@ -86,7 +86,7 @@ class RolePicker extends Component {
<h3>Server Message</h3>
<p dangerouslySetInnerHTML={{ __html: msgToReal(msg) }}></p>
</section>
);
)
}
if (roleManager && !isEditing) {
@ -107,7 +107,7 @@ class RolePicker extends Component {
}}
></p>
</section>
);
)
}
if (roleManager && isEditing) {
@ -137,18 +137,18 @@ class RolePicker extends Component {
value={msgBuffer}
/>
</section>
);
)
}
return null;
return null
}
render() {
const { data, server, dispatch } = this.props;
const vm = data.get('viewMap');
const { data, server, dispatch } = this.props
const vm = data.get('viewMap')
if (server === undefined) {
return null;
return null
}
return (
@ -207,8 +207,8 @@ class RolePicker extends Component {
</div>
</section>
</div>
);
)
}
}
export default RolePicker;
export default RolePicker

14
UI/src/components/role/demo.js
View file

@ -1,16 +1,16 @@
import React, { Component } from 'react';
import { Map } from 'immutable';
import React, { Component } from 'react'
import { Map } from 'immutable'
import Role from './index';
import Role from './index'
export default class DemoRole extends Component {
state = {
isSelected: false,
};
}
handleToggle = () => {
this.setState({ isSelected: !this.state.isSelected });
};
this.setState({ isSelected: !this.state.isSelected })
}
render() {
return (
@ -20,6 +20,6 @@ export default class DemoRole extends Component {
onToggle={this.handleToggle}
type="button"
/>
);
)
}
}

10
UI/src/components/role/draggable.js
View file

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import { DragSource } from 'react-dnd';
import React, { Component } from 'react'
import { DragSource } from 'react-dnd'
import Role from './index';
import Role from './index'
// @DragSource(Symbol.for('dnd: role'), {
// beginDrag ({ role, categoryId }) {
@ -17,7 +17,7 @@ export default
Symbol.for('dnd: role'),
{
beginDrag({ role, categoryId }) {
return { role, category: categoryId };
return { role, category: categoryId }
},
},
(connect, monitor) => ({
@ -27,6 +27,6 @@ export default
)
class DraggableRole extends Component {
render() {
return <Role {...this.props} type="drag" />;
return <Role {...this.props} type="drag" />
}
}

34
UI/src/components/role/index.js
View file

@ -1,9 +1,9 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Color from 'color';
import './Role.sass';
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import Color from 'color'
import './Role.sass'
const whiteColor = Color('#efefef');
const whiteColor = Color('#efefef')
class Role extends Component {
static propTypes = {
@ -12,28 +12,28 @@ class Role extends Component {
type: PropTypes.string,
selected: PropTypes.bool,
disabled: PropTypes.bool,
};
}
render() {
let { role, selected, disabled, type, isDragging } = this.props;
type = type || 'button';
let { role, selected, disabled, type, isDragging } = this.props
type = type || 'button'
// console.log(this.props)
let color = Color(role.get('color'));
let color = Color(role.get('color'))
if (color.rgbNumber() === 0) {
color = whiteColor;
color = whiteColor
}
const c = color;
let hc = color.lighten(0.1);
const c = color
let hc = color.lighten(0.1)
const out = (
<div
onClick={() => {
if (!disabled && this.props.onToggle != null) {
this.props.onToggle(!selected, selected);
this.props.onToggle(!selected, selected)
}
}}
{...(disabled
@ -52,14 +52,14 @@ class Role extends Component {
<div className={`role__option ${selected ? 'selected' : ''}`} />
<div className="role__name">{role.get('name')}</div>
</div>
);
)
if (type === 'drag' && this.props.connectDragSource != null) {
return this.props.connectDragSource(out);
return this.props.connectDragSource(out)
}
return out;
return out
}
}
export default Role;
export default Role

24
UI/src/components/servers/Navigation.js
View file

@ -1,17 +1,17 @@
import React, { Component, Fragment } from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import ServerCard from './ServerCard';
import UserCard from './UserCard';
import { Scrollbars } from 'react-custom-scrollbars';
import { NavLink } from 'react-router-dom';
import React, { Component, Fragment } from 'react'
import ImmutablePropTypes from 'react-immutable-proptypes'
import PropTypes from 'prop-types'
import ServerCard from './ServerCard'
import UserCard from './UserCard'
import { Scrollbars } from 'react-custom-scrollbars'
import { NavLink } from 'react-router-dom'
class ServersNavigation extends Component {
static propTypes = {
user: ImmutablePropTypes.map.isRequired,
servers: ImmutablePropTypes.orderedMapOf(ImmutablePropTypes.map).isRequired,
className: PropTypes.string,
};
}
render() {
// console.log(this.props.servers)
@ -21,8 +21,8 @@ class ServersNavigation extends Component {
<div className={this.props.className}>
<Scrollbars autoHeight autoHeightMax="calc(100vh - 180px)">
{this.props.servers.reduce((acc, s, i) => {
acc.push(<ServerCard server={s} user={this.props.user} key={i} />);
return acc;
acc.push(<ServerCard server={s} user={this.props.user} key={i} />)
return acc
}, [])}
<NavLink
className="server-list__item add-new"
@ -36,8 +36,8 @@ class ServersNavigation extends Component {
</Scrollbars>
</div>
</Fragment>
);
)
}
}
export default ServersNavigation;
export default ServersNavigation

34
UI/src/components/servers/ServerCard.js
View file

@ -1,26 +1,26 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { NavLink } from 'react-router-dom';
import './ServerCard.sass';
import { withRouter } from 'react-router';
import React, { Component } from 'react'
import { connect } from 'react-redux'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { NavLink } from 'react-router-dom'
import './ServerCard.sass'
import { withRouter } from 'react-router'
class ServerCard extends Component {
static propTypes = {
user: ImmutablePropTypes.map.isRequired,
server: ImmutablePropTypes.map.isRequired,
};
}
render() {
const { server, user } = this.props;
const { server, user } = this.props
let icon = '';
let icon = ''
console.log(__filename, server);
console.log(__filename, server)
const s = server.get('server');
const gm = server.get('gm');
const perms = server.get('perms');
const s = server.get('server')
const gm = server.get('gm')
const perms = server.get('perms')
if (perms.get('canManageRoles')) {
icon = (
@ -32,7 +32,7 @@ class ServerCard extends Component {
className="server-list__item__tag"
uk-icon="icon: bolt; ratio: 0.7"
/>
);
)
}
if (perms.get('isAdmin')) {
@ -45,7 +45,7 @@ class ServerCard extends Component {
className="server-list__item__tag"
uk-icon="icon: star; ratio: 0.7"
/>
);
)
}
return (
@ -69,8 +69,8 @@ class ServerCard extends Component {
{icon}
</div>
</NavLink>
);
)
}
}
export default ServerCard;
export default ServerCard

26
UI/src/components/servers/ServerLanding.js
View file

@ -1,35 +1,35 @@
import React, { Component } from 'react';
import { Link, Redirect } from 'react-router-dom';
import superagent from 'superagent';
import discordLogo from '../../pages/images/discord-logo.svg';
import React, { Component } from 'react'
import { Link, Redirect } from 'react-router-dom'
import superagent from 'superagent'
import discordLogo from '../../pages/images/discord-logo.svg'
export default class ServerLanding extends Component {
state = {
server: null,
exit: false,
};
}
async componentWillMount() {
console.log(this.props);
console.log(this.props)
try {
const rsp = await superagent.get(
`/api/server/${this.props.match.params.server}/slug`
);
this.setState({ server: rsp.body });
)
this.setState({ server: rsp.body })
} catch (e) {
this.setState({ exit: true });
return;
this.setState({ exit: true })
return
}
}
render() {
if (this.state.exit === true) {
return <Redirect to="/" />;
return <Redirect to="/" />
}
if (this.state.server === null) {
return null; //SPINNER
return null //SPINNER
}
return (
@ -54,6 +54,6 @@ export default class ServerLanding extends Component {
</section>
</div>
</div>
);
)
}
}

30
UI/src/components/servers/UserCard.js
View file

@ -1,30 +1,30 @@
import React, { Component } from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { NavLink } from 'react-router-dom';
import { connect } from 'react-redux';
import * as Actions from '../../actions';
import './UserCard.sass';
import React, { Component } from 'react'
import ImmutablePropTypes from 'react-immutable-proptypes'
import { NavLink } from 'react-router-dom'
import { connect } from 'react-redux'
import * as Actions from '../../actions'
import './UserCard.sass'
@connect()
class UserCard extends Component {
static propTypes = {
user: ImmutablePropTypes.map,
};
}
get avatar() {
const { user } = this.props;
const avatar = user.get('avatar');
const { user } = this.props
const avatar = user.get('avatar')
if (avatar === '' || avatar == null) {
return `https://cdn.discordapp.com/embed/avatars/${Math.ceil(Math.random() * 9999) %
5}.png`;
5}.png`
}
return `https://cdn.discordapp.com/avatars/${user.get('id')}/${avatar}.png`;
return `https://cdn.discordapp.com/avatars/${user.get('id')}/${avatar}.png`
}
render() {
const { user } = this.props;
const { user } = this.props
// console.log(this.props)
@ -45,7 +45,7 @@ class UserCard extends Component {
title="Sign out"
uk-icon="icon: sign-out"
onClick={() => {
this.props.dispatch(Actions.userLogout);
this.props.dispatch(Actions.userLogout)
}}
/>
</li>
@ -63,8 +63,8 @@ class UserCard extends Component {
</ul>
</div>
</div>
);
)
}
}
export default UserCard;
export default UserCard

38
UI/src/components/servers/index.js
View file

@ -1,15 +1,15 @@
import React, { Component } from 'react';
import { Route, Switch } from 'react-router-dom';
import { Scrollbars } from 'react-custom-scrollbars';
import { connect } from 'react-redux';
import { withRouter, Redirect } from 'react-router';
import './index.sass';
import React, { Component } from 'react'
import { Route, Switch } from 'react-router-dom'
import { Scrollbars } from 'react-custom-scrollbars'
import { connect } from 'react-redux'
import { withRouter, Redirect } from 'react-router'
import './index.sass'
import Navigation from './Navigation';
import RolePicker from '../role-picker';
import RoleEditor from '../role-editor';
import AddServer from '../add-server';
import Error404 from '../../pages/Error404';
import Navigation from './Navigation'
import RolePicker from '../role-picker'
import RoleEditor from '../role-editor'
import AddServer from '../add-server'
import Error404 from '../../pages/Error404'
// import mockData from './mockData'
@ -18,20 +18,20 @@ const mapState = ({ servers, user, appState }) => {
servers,
user,
fade: appState.fade,
};
};
}
}
@connect(mapState)
class Servers extends Component {
get defaultPath() {
console.log(this.props.servers.toJS());
console.log(this.props.servers.toJS())
const first = this.props.servers.first();
const first = this.props.servers.first()
if (first != null) {
return first.get('id');
return first.get('id')
}
return 'add';
return 'add'
}
render() {
@ -62,8 +62,8 @@ class Servers extends Component {
</Scrollbars>
</div>
</div>
);
)
}
}
export default Servers;
export default Servers

16
UI/src/components/wrapper/index.js
View file

@ -1,9 +1,9 @@
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import Scrollbars from 'react-custom-scrollbars';
import Logotype from '../logotype';
import './wrapper.sass';
import discordLogo from '../../pages/images/discord-logo.svg';
import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import Scrollbars from 'react-custom-scrollbars'
import Logotype from '../logotype'
import './wrapper.sass'
import discordLogo from '../../pages/images/discord-logo.svg'
class Wrapper extends Component {
render() {
@ -45,8 +45,8 @@ class Wrapper extends Component {
</div>
</Scrollbars>
</div>
);
)
}
}
export default Wrapper;
export default Wrapper

14
UI/src/index.js
View file

@ -1,8 +1,8 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import { unregister } from './registerServiceWorker';
import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
import App from './App'
import { unregister } from './registerServiceWorker'
ReactDOM.render(<App />, document.getElementById('root'));
unregister();
ReactDOM.render(<App />, document.getElementById('root'))
unregister()

8
UI/src/pages/Error404.js
View file

@ -1,5 +1,5 @@
import React from 'react';
import './landing.sass';
import React from 'react'
import './landing.sass'
const Error404 = ({ root = false }) => (
<div className="landing uk-width-1-1 uk-text-center">
@ -14,6 +14,6 @@ const Error404 = ({ root = false }) => (
</section>
</div>
</div>
);
)
export default Error404;
export default Error404

22
UI/src/pages/Landing.js
View file

@ -1,12 +1,12 @@
import React, { Component, Fragment } from 'react';
import { Link } from 'react-router-dom';
import Scrollbars from 'react-custom-scrollbars';
import Typist from 'react-typist';
import moment from 'moment';
import './landing.sass';
import discordLogo from './images/discord-logo.svg';
import RoleypolyDemo from '../components/demos/roleypoly';
import TypingDemo from '../components/demos/typing';
import React, { Component, Fragment } from 'react'
import { Link } from 'react-router-dom'
import Scrollbars from 'react-custom-scrollbars'
import Typist from 'react-typist'
import moment from 'moment'
import './landing.sass'
import discordLogo from './images/discord-logo.svg'
import RoleypolyDemo from '../components/demos/roleypoly'
import TypingDemo from '../components/demos/typing'
const Landing = ({ root = false }) => (
<div className="landing uk-width-1-1 uk-text-center">
@ -34,5 +34,5 @@ const Landing = ({ root = false }) => (
</section>
</div>
</div>
);
export default Landing;
)
export default Landing

12
UI/src/pages/WhyNoRoles.js
View file

@ -1,7 +1,7 @@
import React, { Fragment } from 'react';
import React, { Fragment } from 'react'
import goodImg from './images/whynoroles-good.png';
import badImg from './images/whynoroles-bad.png';
import goodImg from './images/whynoroles-good.png'
import badImg from './images/whynoroles-bad.png'
const WhyNoRoles = props => {
return (
@ -27,7 +27,7 @@ const WhyNoRoles = props => {
In this example, Roleypoly is above other roles, and will be able to assign them.
</p>
</Fragment>
);
};
)
}
export default WhyNoRoles;
export default WhyNoRoles

22
UI/src/pages/index.js
View file

@ -1,12 +1,12 @@
import React from 'react';
import { Route, Switch } from 'react-router-dom';
import Scrollbars from 'react-custom-scrollbars';
import './pages.sass';
import React from 'react'
import { Route, Switch } from 'react-router-dom'
import Scrollbars from 'react-custom-scrollbars'
import './pages.sass'
import WhyNoRoles from './WhyNoRoles';
import Error404 from './Error404';
export { default as Landing } from './Landing';
export { default as Error404 } from './Error404';
import WhyNoRoles from './WhyNoRoles'
import Error404 from './Error404'
export { default as Landing } from './Landing'
export { default as Error404 } from './Error404'
const Pages = props => {
return (
@ -21,7 +21,7 @@ const Pages = props => {
</div>
</Scrollbars>
</div>
);
};
)
}
export default Pages;
export default Pages

26
UI/src/reducers/index.js
View file

@ -1,16 +1,16 @@
import { combineReducers } from 'redux';
import { combineReducers } from 'redux'
import servers from './servers';
import user from './user';
import rolePicker from './role-picker';
import roleEditor from './role-editor';
import { routerMiddleware } from 'react-router-redux';
import servers from './servers'
import user from './user'
import rolePicker from './role-picker'
import roleEditor from './role-editor'
import { routerMiddleware } from 'react-router-redux'
// import roles from './roles'
const initialState = {
ready: false,
fade: true,
};
}
const appState = (state = initialState, { type, data }) => {
switch (type) {
@ -19,18 +19,18 @@ const appState = (state = initialState, { type, data }) => {
...state,
ready: true,
fade: false,
};
}
case Symbol.for('app fade'):
return {
...state,
fade: data,
};
}
default:
return state;
return state
}
};
}
const rootReducer = combineReducers({
appState,
@ -40,6 +40,6 @@ const rootReducer = combineReducers({
// roles,
rolePicker,
roleEditor,
});
})
export default rootReducer;
export default rootReducer

34
UI/src/reducers/role-editor.js
View file

@ -1,44 +1,44 @@
import { Map, OrderedMap, fromJS } from 'immutable';
import { Map, OrderedMap, fromJS } from 'immutable'
const initialState = Map({
viewMap: OrderedMap({}),
originalSnapshot: OrderedMap({}),
hasAvailableRoles: true,
});
})
const reducer = (state = initialState, { type, data }) => {
switch (type) {
case Symbol.for('re: setup'):
const { viewMap, originalSnapshot, ...rest } = data;
const { viewMap, originalSnapshot, ...rest } = data
return state.merge({
viewMap: OrderedMap(viewMap),
originalSnapshot: OrderedMap(originalSnapshot),
...rest,
});
})
case Symbol.for('re: set category'):
return state.setIn(['viewMap', data.id], Map(data));
return state.setIn(['viewMap', data.id], Map(data))
case Symbol.for('re: edit category'):
return state.setIn(['viewMap', data.id, data.key], data.value);
return state.setIn(['viewMap', data.id, data.key], data.value)
case Symbol.for('re: delete category'):
return state.deleteIn(['viewMap', data]);
return state.deleteIn(['viewMap', data])
case Symbol.for('re: switch category mode'):
return state.setIn(['viewMap', data.id, 'mode'], data.mode);
return state.setIn(['viewMap', data.id, 'mode'], data.mode)
case Symbol.for('re: add role to category'):
const category = state.getIn(['viewMap', data.id]);
const category = state.getIn(['viewMap', data.id])
return state.setIn(
['viewMap', data.id],
category
.set('roles', category.get('roles').add(data.role.get('id')))
.set('roles_map', category.get('roles_map').add(data.role))
);
)
case Symbol.for('re: remove role from category'):
const rmCat = state.getIn(['viewMap', data.id]);
const rmCat = state.getIn(['viewMap', data.id])
return state.setIn(
['viewMap', data.id],
rmCat
@ -50,17 +50,17 @@ const reducer = (state = initialState, { type, data }) => {
'roles_map',
rmCat.get('roles_map').filterNot(r => r.get('id') === data.role.get('id'))
)
);
)
case Symbol.for('re: reset'):
return state.set('viewMap', state.get('originalSnapshot'));
return state.set('viewMap', state.get('originalSnapshot'))
case Symbol.for('re: swap original state'):
return state.set('originalSnapshot', state.get('viewMap'));
return state.set('originalSnapshot', state.get('viewMap'))
default:
return state;
return state
}
};
}
export default reducer;
export default reducer

24
UI/src/reducers/role-picker.js
View file

@ -1,4 +1,4 @@
import { Map, OrderedMap } from 'immutable';
import { Map, OrderedMap } from 'immutable'
const initialState = Map({
hidden: true, // should the view be hidden?
@ -8,37 +8,37 @@ const initialState = Map({
viewMap: OrderedMap({}), // roles in categories
originalRolesSelected: Map({}), // Map<role id, bool> -- original roles for diffing against selected
rolesSelected: Map({}), // Map<role id, bool> -- new roles for diffing
});
})
export default (state = initialState, { type, data }) => {
switch (type) {
case Symbol.for('rp: setup role picker'):
return Map(data);
return Map(data)
case Symbol.for('rp: hide role picker ui'):
return state.set('hidden', data);
return state.set('hidden', data)
case Symbol.for('rp: reset role picker ui'):
return state.set('emptyRoles', data);
return state.set('emptyRoles', data)
case Symbol.for('rp: update selected roles'):
return state.mergeIn(['rolesSelected'], data);
return state.mergeIn(['rolesSelected'], data)
case Symbol.for('rp: sync selected roles'):
return state.set('originalRolesSelected', state.get('rolesSelected'));
return state.set('originalRolesSelected', state.get('rolesSelected'))
case Symbol.for('rp: reset selected'):
return state.set('rolesSelected', state.get('originalRolesSelected'));
return state.set('rolesSelected', state.get('originalRolesSelected'))
case Symbol.for('rp: set message editor state'):
return state.set('isEditingMessage', data);
return state.set('isEditingMessage', data)
case Symbol.for('rp: edit message buffer'):
return state.set('messageBuffer', data);
return state.set('messageBuffer', data)
// case Symbol.for('rp: zero role picker'):
// return initialState
default:
return state;
return state
}
};
}

18
UI/src/reducers/servers.js
View file

@ -1,4 +1,4 @@
import { Set, OrderedMap, Map, fromJS } from 'immutable';
import { Set, OrderedMap, Map, fromJS } from 'immutable'
const blankServer = Map({
id: '386659935687147521',
@ -19,14 +19,14 @@ const blankServer = Map({
isAdmin: true,
canManageRoles: true,
},
});
})
const initialState = OrderedMap({});
const initialState = OrderedMap({})
export default (state = initialState, { type, data }) => {
switch (type) {
case Symbol.for('update servers'):
return data.reduce((acc, s) => acc.set(s.id, fromJS(s)), OrderedMap());
return data.reduce((acc, s) => acc.set(s.id, fromJS(s)), OrderedMap())
// case Symbol.for('update server roles'):
// return state.set(data.id,
@ -34,15 +34,15 @@ export default (state = initialState, { type, data }) => {
// )
case Symbol.for('server: set'):
return state.set(data.id, fromJS(data));
return state.set(data.id, fromJS(data))
case Symbol.for('server: edit message'):
return state.setIn([data.id, 'message'], data.message);
return state.setIn([data.id, 'message'], data.message)
case Symbol.for('add debug server'):
return state.set('0', blankServer);
return state.set('0', blankServer)
default:
return state;
return state
}
};
}

12
UI/src/reducers/user.js
View file

@ -1,4 +1,4 @@
import { Map } from 'immutable';
import { Map } from 'immutable'
const initialState = Map({
isLoggedIn: false,
@ -6,17 +6,17 @@ const initialState = Map({
discriminator: '0001',
id: '',
avatar: null,
});
})
export default (state = initialState, { type, data }) => {
switch (type) {
case Symbol.for('set user'):
return Map({ ...data, isLoggedIn: true });
return Map({ ...data, isLoggedIn: true })
case Symbol.for('reset user'):
return initialState;
return initialState
default:
return state;
return state
}
};
}

44
UI/src/registerServiceWorker.js
View file

@ -16,30 +16,30 @@ const isLocalhost = Boolean(
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
)
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
const publicUrl = new URL(process.env.PUBLIC_URL, window.location)
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
return;
return
}
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`
if (isLocalhost) {
// This is running on localhost. Lets check if a service worker still exists or not.
checkValidServiceWorker(swUrl);
checkValidServiceWorker(swUrl)
} else {
// Is not local host. Just register service worker
registerValidSW(swUrl);
registerValidSW(swUrl)
}
});
})
}
}
@ -48,7 +48,7 @@ function registerValidSW(swUrl) {
.register(swUrl)
.then(registration => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
const installingWorker = registration.installing
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
@ -56,20 +56,20 @@ function registerValidSW(swUrl) {
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.');
console.log('New content is available; please refresh.')
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
console.log('Content is cached for offline use.')
}
}
};
};
}
}
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
console.error('Error during service worker registration:', error)
})
}
function checkValidServiceWorker(swUrl) {
@ -84,23 +84,23 @@ function checkValidServiceWorker(swUrl) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
window.location.reload()
})
})
} else {
// Service worker found. Proceed as normal.
registerValidSW(swUrl);
registerValidSW(swUrl)
}
})
.catch(() => {
console.log('No internet connection found. App is running in offline mode.');
});
console.log('No internet connection found. App is running in offline mode.')
})
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
registration.unregister()
})
}
}

28
UI/src/router/index.js
View file

@ -1,26 +1,26 @@
import React, { Component, Fragment } from 'react';
import { Route, Switch, Redirect } from 'react-router-dom';
import { connect } from 'react-redux';
import { withRouter } from 'react-router';
import React, { Component, Fragment } from 'react'
import { Route, Switch, Redirect } from 'react-router-dom'
import { connect } from 'react-redux'
import { withRouter } from 'react-router'
import Servers from '../components/servers';
import OauthCallback from '../components/oauth-callback';
import OauthFlow from '../components/oauth-flow';
import OauthBotFlow from '../components/oauth-bot-flow';
import Pages, { Landing, Error404 } from '../pages';
import ServerLanding from '../components/servers/ServerLanding';
import Servers from '../components/servers'
import OauthCallback from '../components/oauth-callback'
import OauthFlow from '../components/oauth-flow'
import OauthBotFlow from '../components/oauth-bot-flow'
import Pages, { Landing, Error404 } from '../pages'
import ServerLanding from '../components/servers/ServerLanding'
const aaa = props => <div>{JSON.stringify(props)}</div>;
const aaa = props => <div>{JSON.stringify(props)}</div>
export default
@withRouter
@connect(({ appState, user }) => ({ ready: appState.ready, user }))
class AppRouter extends Component {
render() {
const isLoggedIn = this.props.user.get('isLoggedIn');
const isLoggedIn = this.props.user.get('isLoggedIn')
if (!this.props.ready) {
return null;
return null
}
return (
@ -52,6 +52,6 @@ class AppRouter extends Component {
<Route component={Error404} />
</Switch>
);
)
}
}

24
UI/src/store/configureStore.dev.js
View file

@ -1,10 +1,10 @@
import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import { createLogger } from 'redux-logger';
import { createStore, applyMiddleware, compose } from 'redux'
import thunk from 'redux-thunk'
import { createLogger } from 'redux-logger'
// import api from '../middleware/api'
import rootReducer from '../reducers';
import DevTools from '../components/dev-tools';
import { routerMiddleware } from 'react-router-redux';
import rootReducer from '../reducers'
import DevTools from '../components/dev-tools'
import { routerMiddleware } from 'react-router-redux'
const configureStore = (preloadedState, history) => {
const store = createStore(
@ -14,16 +14,16 @@ const configureStore = (preloadedState, history) => {
applyMiddleware(thunk, routerMiddleware(history), createLogger())
// DevTools.instrument()
)
);
)
if (module.hot) {
// Enable Webpack hot module replacement for reducers
module.hot.accept('../reducers', () => {
store.replaceReducer(rootReducer);
});
store.replaceReducer(rootReducer)
})
}
return store;
};
return store
}
export default configureStore;
export default configureStore

4
UI/src/store/configureStore.js
View file

@ -1,5 +1,5 @@
if (process.env.NODE_ENV === 'production') {
module.exports = require('./configureStore.prod');
module.exports = require('./configureStore.prod')
} else {
module.exports = require('./configureStore.dev');
module.exports = require('./configureStore.dev')
}

12
UI/src/store/configureStore.prod.js
View file

@ -1,15 +1,15 @@
import { createStore, applyMiddleware } from 'redux';
import { routerMiddleware } from 'react-router-redux';
import { createStore, applyMiddleware } from 'redux'
import { routerMiddleware } from 'react-router-redux'
import thunk from 'redux-thunk';
import thunk from 'redux-thunk'
// import api from '../middleware/api'
import rootReducer from '../reducers';
import rootReducer from '../reducers'
const configureStore = (preloadedState, history) =>
createStore(
rootReducer,
preloadedState,
applyMiddleware(thunk, routerMiddleware(history))
);
)
export default configureStore;
export default configureStore

2
UI/src/utils.js
View file

@ -1 +1 @@
export const msgToReal = msg => msg.replace(/</g, '&lt;').replace(/\n/g, '<br />');
export const msgToReal = msg => msg.replace(/</g, '&lt;').replace(/\n/g, '<br />')