diff --git a/assets/js/admin.js b/assets/js/admin.js index 04469b3..2939a18 100644 --- a/assets/js/admin.js +++ b/assets/js/admin.js @@ -8,8 +8,10 @@ import appReducer from './reducers' import adminReducer from './reducers/admin' import { fetchAdminData, patchUser, patchPublisher } from './actions/admin' import Util from './lib/Util' +import Icon from './components/Icon' import '../styles/admin.scss' +import './containers/listitem.scss' const reducer = Util.combineReducers(appReducer, adminReducer) @@ -32,6 +34,17 @@ class App extends React.Component { this.dispatch = this.dispatch.bind(this) this.getRegisteredUsers = this.getRegisteredUsers.bind(this) this.getRegisteredPublishers = this.getRegisteredPublishers.bind(this) + + /* + this.state.user = { + ...this.state.user, + 'created_at': 1551151466802, + 'updated_at': 1551151520134, + 'id': 1, + 'email': 'admin@tkluge.net', + 'admin': true + } + */ } dispatch (action) { if (!action) throw new Error('dispatch: missing action') @@ -56,11 +69,11 @@ class App extends React.Component { this.dispatch(patchUser({ id: user.id, admin: !user.admin }))} id={`is-admin-${user.id}`} /> -
- {user.created_at} - {user.updated_at} + Created at:{new Date(user.created_at).toLocaleString()} + Updated at:{new Date(user.updated_at).toLocaleString()}
) @@ -69,19 +82,27 @@ class App extends React.Component { getRegisteredPublishers () { return this.state.publishers.map(pub => { return ( -
  • -
    - {pub.name}{pub.appid} - {pub.user.email} -
    - - - this.dispatch(patchPublisher({ id: pub.id, whitelisted: !pub.whitelisted }))} id={`is-whitelisted-${pub.id}`} /> - -
    - {pub.created_at} - {pub.updated_at} +
  • +

    {pub.name}

    +
    +
    + Owner:{pub.user.email} + App ID:{pub.appid} + + App domain: + {pub.url} + + +
    + + + this.dispatch(patchPublisher({ id: pub.id, whitelisted: !pub.whitelisted }))} id={`is-whitelisted-${pub.id}`} /> + +
    + Created at:{new Date(pub.created_at).toLocaleString()} + Updated at:{new Date(pub.updated_at).toLocaleString()} +
  • ) diff --git a/assets/js/containers/PublisherListItem.js b/assets/js/containers/PublisherListItem.js index 60f26d4..6bb93d0 100644 --- a/assets/js/containers/PublisherListItem.js +++ b/assets/js/containers/PublisherListItem.js @@ -29,9 +29,9 @@ class PublisherListItem extends React.Component { } getView () { return ( -
  • +
  • -

    {this.props.item.name}

    +

    {`${this.props.item.name}${this.props.item.whitelisted ? '' : ' (awaiting approval)'}`}

    this.props.dispatch(removePublisher(this.props.item.id))} />
    diff --git a/assets/js/containers/listitem.scss b/assets/js/containers/listitem.scss index e3c4871..e16a9b4 100644 --- a/assets/js/containers/listitem.scss +++ b/assets/js/containers/listitem.scss @@ -1,6 +1,7 @@ @import '../../styles/lib/vars'; .uri-list-item { + position: relative; min-height: 60px; line-height: 60px; max-width: 100%; @@ -168,5 +169,16 @@ } } } + &:not(.whitelisted) { + &:before { + position: absolute; + content: ''; + left: 0; + top: 0; + width: 4px; + height: 100%; + background: $red; + } + } } } diff --git a/assets/js/index.js b/assets/js/index.js index eff90b5..390758d 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -26,47 +26,7 @@ class App extends React.Component { currentPassword: '' }, urls: [], - publishers: [ - /*{ - 'created_at': 1551151516409, - 'updated_at': 1551151651178, - 'id': 1, - 'name': 'foo', - 'url': 'test.com', - 'whitelisted': true, - 'verified': false, - 'verification_key': 'bsjj9s+bE1glKYF3YPzry0B5AZWFtkvI', - 'appid': 'RtSST1hcuzU434MR', - 'secret': 'aydN2jI4MzCwZPWRxfQGOMME/B8ZG5X4uoN0bo72AolUPKwYPVzMJIakT8HQ26s3', - 'user': 1 - }, - { - 'created_at': 1551152311149, - 'updated_at': 1551152311149, - 'id': 2, - 'name': 'afasfsdfsd', - 'url': 'test.com', - 'whitelisted': false, - 'verified': true, - 'verification_key': 'qntO7L7Mcr6jtCjJh8rQN9kOx2x0bmep', - 'appid': 'GCYJp+CIX4HxFPLy', - 'secret': 'MsaG97ogRhPYoceZeWE06MNJ82PIFgqqWhL3L0/pDsJbMjKXcuUE3unmoewG0rmW', - 'user': 1 - }, - { - 'created_at': 1551152311149, - 'updated_at': 1551152311149, - 'id': 2, - 'name': 'afasfsdfsd', - 'url': 'test.com', - 'whitelisted': true, - 'verified': true, - 'verification_key': 'qntO7L7Mcr6jtCjJh8rQN9kOx2x0bmep', - 'appid': 'GCYJp+CIX4HxFPLy', - 'secret': 'MsaG97ogRhPYoceZeWE06MNJ82PIFgqqWhL3L0/pDsJbMjKXcuUE3unmoewG0rmW', - 'user': 1 - }*/ - ], + publishers: [], newPublisher: { name: '', url: '' }, editingUrl: null, editingPublisher: 1, @@ -79,15 +39,6 @@ class App extends React.Component { this.saveUser = this.saveUser.bind(this) this.getRegisteredPublishers = this.getRegisteredPublishers.bind(this) this.setPublisherValue = this.setPublisherValue.bind(this) - - /*this.state.user = { - ...this.state.user, - 'created_at': 1551151466802, - 'updated_at': 1551151520134, - 'id': 1, - 'email': 'admin@tkluge.net', - 'admin': true - }*/ } dispatch (action) { if (!action) throw new Error('dispatch: missing action') diff --git a/assets/styles/admin.scss b/assets/styles/admin.scss index acc3d4b..188b001 100644 --- a/assets/styles/admin.scss +++ b/assets/styles/admin.scss @@ -4,11 +4,17 @@ .list { li { padding: 5px 0; - height: 50px; min-height: 50px; line-height: 50px; padding: 0 14px; + header { + h3 { + font-weight: normal; + line-height: 30px; + margin: 0; + } + } .stack { line-height: 20px; } @@ -46,6 +52,43 @@ } } } + .key-value { + span { + line-height: 30px; + + &.contains-icon { + margin-bottom: 10px; + } + } + .icon { + padding: 0; + height: 20px; + width: 20px; + vertical-align: middle; + margin-left: 10px; + svg { + height: 20px; + width: 20px; + } + &.verified { + path { + fill: $green; + } + } + &.unverified { + path { + fill: $red; + } + } + } + } + .key { + margin-right: 10px; + } + .value { + font-family: monospace; + color: $black-3; + } } } } diff --git a/package.json b/package.json index 1f48513..55f6315 100644 --- a/package.json +++ b/package.json @@ -5,15 +5,16 @@ "description": "a Sails application", "keywords": [], "scripts": { - "start": "npm-run-all --parallel open:client lift", + "start": "npm run forever", + "start:dev": "npm-run-all --parallel open:client lift", "start:debug": "npm-run-all --parallel open:client debug", "start:prod": "npm-run-all --parallel build:prod lift", - "open:client": "webpack-dev-server --mode development", + "start:client": "webpack-dev-server --mode development", + "lift": "sails lift", "build": "npm run build:prod", "build:dev": "webpack --mode development", "build:prod": "webpack --mode production", "clean": "rimraf .tmp && mkdirp .tmp/public", - "lift": "sails lift", "forever": "sudo ./node_modules/.bin/pm2 start ecosystem.config.js --env production", "stop": "sudo ./node_modules/.bin/pm2 delete roe-base", "test": "npm run lint && npm run custom-tests && echo 'Done.'",