+
- {title}: {value}
{renderDeleteInputField(i, formName, formNames, deleteFormName)}
+ {title}: {value}
)
} else {
return (
-
+
+ {renderDeleteInputField(i, formName, formNames, deleteFormName)}
- {renderDeleteInputField(i, formName, formNames, deleteFormName)}
)
}
@@ -82,22 +85,44 @@ const renderInputFields = (formNames, forms, deleteFormName, onChange) => {
}
const renderForm = (props, inputs) => {
+ const id = `newLockForm_${props.id.replace(/!@!/, '-').replace(/\./, '-')}`
return (
-
+ {
+ event.preventDefault()
+ document.getElementById(id + '_button').click()
+ }}
+ >
+ SAVE POLICY
+
);
}
const Form = (props) => {
- const inputs = renderInputFields(props.formNames, props.forms, props.deleteFormName, props.onChange);
+ const inputs = renderInputFields(props.selectedForms, props.forms, props.deleteFormName, props.onChange);
return renderForm(props, inputs);
}
diff --git a/src/components/GenericListItem.js b/src/components/GenericListItem.js
index 893148e..bd6f950 100644
--- a/src/components/GenericListItem.js
+++ b/src/components/GenericListItem.js
@@ -16,7 +16,9 @@ import { Toolbar, ToolbarGroup } from 'material-ui/Toolbar';
const GenericListItem = (props) => {
const styles = props.style ? props.style : {
bar: {
- backgroundColor: 'white'
+ backgroundColor: 'white',
+ height: 'auto',
+ margin: '10px'
},
rightEl: {
margin: '0px',
@@ -28,7 +30,9 @@ const GenericListItem = (props) => {
{props.leftEl}
-
+
+ {props.middleEl}
+
{props.rightEl}
diff --git a/src/components/GroupItem.js b/src/components/GroupItem.js
new file mode 100644
index 0000000..a678c1b
--- /dev/null
+++ b/src/components/GroupItem.js
@@ -0,0 +1,172 @@
+/*******************************************************************************
+ *Copyright (C) 2017 Resin.io, FBK, Jolocom.
+ *All rights reserved. This program and the accompanying materials
+ *are made available under the terms of the Eclipse Public License 2.0
+ *which accompanies this distribution, and is available at
+ *https://www.eclipse.org/legal/epl-2.0/
+ *
+ *SPDX-License-Identifier: EPL-2.0
+ *
+ *Contributors:
+ * Resin.io, FBK, Jolocom - initial API and implementation
+ ******************************************************************************/
+import React from 'react';
+import {
+ Card,
+ CardActions,
+ CardHeader,
+ CardText
+} from 'material-ui/Card';
+import {List, ListItem} from 'material-ui/List';
+import Avatar from 'material-ui/Avatar';
+
+const stringConstructor = "".constructor;
+const arrayConstructor = [].constructor;
+const objectConstructor = {}.constructor;
+const styles = {
+ borderStyle: {
+ borderWidth: '1px',
+ borderColor: '#bcbcbc',
+ borderStyle: 'solid'
+ }
+}
+
+function getType(object) {
+ if (object === null) {
+ return 'null';
+ } else if (object === undefined) {
+ return 'undefined';
+ } else if (!isNaN(parseFloat(object)) && !isNaN(object - 0) ) {
+ return 'Number'
+ } else if (object.constructor === stringConstructor) {
+ return 'String';
+ } else if (object.constructor === arrayConstructor) {
+ return 'Array';
+ } else if (object.constructor === objectConstructor) {
+ return 'Object';
+ } else {
+ return 'unknown';
+ }
+}
+
+function getOrder(object) {
+ switch(getType(object)) {
+ case 'null':
+ return 0
+ case 'undefined':
+ return 1
+ case 'Number':
+ return 2
+ case 'String':
+ return 3
+ case 'Array':
+ return 4
+ case 'Object':
+ return 5
+ default:
+ return 6
+ }
+}
+
+function compare (a, b) {
+ if (getOrder(a) < getOrder(b)) {
+ return -1
+ } else if (getOrder(a) > getOrder(b)) {
+ return 1
+ }
+ return 0
+}
+
+JSON.sort = function(object) {
+ const keys = Object.keys(object)
+ const sortedKeys = keys.sort((a, b) => {
+ return compare(object[a], object[b])
+ })
+ let sortedObject = {}
+ for(let index in sortedKeys){
+ let key = sortedKeys[index];
+ sortedObject[key] = object[key];
+ }
+ return sortedObject
+}
+
+const renderAttribute = (key, value, parent) => {
+ if (getType(value) === 'Array') {
+ return (
+
+ {key}:
+ {renderAttributes(value, parent + '-' + key)}
+
+ )
+ } else if (getType(value) === 'Object') {
+ if (getType(key) === 'Number') {
+ return (
+ {renderAttributes(value, parent + '-' + key)}
+
)
+ } else {
+ return (
+ {key}:
+ {renderAttributes(value, parent + '-' + key)}
+
)
+ }
+ } else {
+ return (
+
+ {key}: {value}
+
+ )
+ }
+}
+
+const renderAttributes = (group, parent) => {
+ group = JSON.sort(group)
+ if (!group) {
+ return
+ }
+
+ return (
+ {Object.entries(group).map(attribute => {
+ const key = attribute[0]
+ const value = attribute[1]
+ return (
+ {renderAttribute(key, value, parent)}
+ )
+ })}
+
)
+}
+
+const GroupItem = (props) => {
+ return (
+
+ {props.title && props.title.charAt(0)}
+ }
+ />
+
+ {renderAttributes(props.group, 'root')}
+
+
+ {props.actions}
+
+
+ );
+}
+
+
+export default GroupItem
diff --git a/src/components/LockItem.js b/src/components/LockItem.js
index 8964fe2..8010c8c 100644
--- a/src/components/LockItem.js
+++ b/src/components/LockItem.js
@@ -24,9 +24,9 @@ import {List, ListItem} from 'material-ui/List';
* e.g. attrEq, where args = ['role', 'admin'] or similar
* @param args the array of arguments of a lock
*/
-const getArrayArgsListItems = (args) => {
+const getArrayArgsListItems = (args, op) => {
return args.map((arg, i) => {
- return (
+ return (
{i}: {'' + arg}
);
@@ -38,14 +38,14 @@ const getArrayArgsListItems = (args) => {
* @param args the lock with all its properties
* @param lock path of the lock (e.g. actions.write.hasType)
*/
-const getArgsListItems = (args) => {
+const getArgsListItems = (args, op) => {
let itemList = [];
for (var arg in args) {
if(arg !== 'deleteButton' && arg !== 'not') {
- itemList.push(
+ itemList.push(
{arg}: {
Array.isArray(args[arg]) ?
- ({getArrayArgsListItems(args[arg])}
) :
+ ({getArrayArgsListItems(args[arg], op)}
) :
'' + args[arg]
}
@@ -63,7 +63,7 @@ const getArgsListItems = (args) => {
const getLocksListItems = (locks, op) => {
return locks.map((lock, i) => {
return (
-
+
{getArgsListItems(lock, op + '.' + lock.lock)}
{lock.deleteButton}
@@ -76,13 +76,13 @@ const getLocksListItems = (locks, op) => {
* @param locks the locks for a policy
* @param policyName the name of the policy
*/
-const getListItems = (locks, policyName) => {
+const getListItems = (id, locks, policyName) => {
if(locks) {
return locks.map((lock, i) => {
return (
-
+
{`${lock.op}`}
- {(
+ {(
{getLocksListItems(lock.locks, policyName + '.' + lock.op)}
{lock.deleteButton}
)}
@@ -94,8 +94,9 @@ const getListItems = (locks, policyName) => {
const LockItem = (props) => {
return (
-
+
{
subtitle={props.subtitle}
/>
- {getListItems(props.policy.flows, props.title)}
+ {getListItems(props.id.replace('!@!', '-'), props.policy.flows, props.title)}
{props.policy.buttons}
diff --git a/src/components/SecurityItem.js b/src/components/SecurityItem.js
index f19b491..1e8bfb1 100644
--- a/src/components/SecurityItem.js
+++ b/src/components/SecurityItem.js
@@ -64,11 +64,11 @@ const SecurityItem = (props) => {
}
}
return (
-
+
{nestedElement}
{editLock}
@@ -113,7 +113,7 @@ const SecurityItem = (props) => {
});
return (
-
+
{name}: {nestedElement}
);
@@ -139,7 +139,7 @@ const SecurityItem = (props) => {
return
+ key={`${attribute.name}`}>
{handlerFunction({id, entityType, attribute, addAttributeField, parent})}
})
@@ -175,6 +175,7 @@ const SecurityItem = (props) => {
// TODO EDIT LOCK
const getInlineEditField = ({ id, entityType, name, parent, value, editLock }) => {
const field =
{
}
const removeIcon = {
handleDelete({
@@ -209,7 +211,7 @@ const SecurityItem = (props) => {
/>
return (
-
+
{removeIcon}
{name}:{field}
{editLock}
@@ -218,7 +220,7 @@ const SecurityItem = (props) => {
}
return (
-
+
)]
+ const optionFields = [()]
for (let key in options) {
if (options.hasOwnProperty(key)) {
optionFields.push((
@@ -96,23 +96,25 @@ class AddLock extends Component {
renderSelectField() {
const options = this.renderOptions(this.props.lockFormats)
if (options.length) {
- return ( )
}
}
render() {
return (
- {this.renderForm(this.props.form)}
{this.renderSelectField()}
+ {this.renderForm(this.props.form)}
)
}
diff --git a/src/containers/Devices.js b/src/containers/Devices.js
index b763fe5..aea17ac 100644
--- a/src/containers/Devices.js
+++ b/src/containers/Devices.js
@@ -24,15 +24,18 @@ class Devices extends Component {
label: {fontSize: '1rem'},
container: {marginTop: '5px', marginBottom:'5px'}
}
+ const id = device.deviceId
return (
- {
- this.props.devicesDelete(device.deviceId)}
- } />
-
+
+ {
+ this.props.devicesDelete(device.deviceId)}
+ } />
+
+
-
+
@@ -48,6 +51,7 @@ class Devices extends Component {
-
-
+
+
)
}
renderActions(entity) {
+ let id = entity.id || entity.group_name
+ id = id.replace(/!@!/g, '-')
switch (this.props.params.type) {
case 'group':
+ id = id + '-' + entity.owner.replace(/!@!/g, '-')
return (