Rift.IO OSM R1 Initial Submission

[osm/UI.git] / skyquake / plugins / launchpad / src / ssh_keys / sshKeyCard.jsx

diff --git a/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.jsx b/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.jsx
new file mode 100644 (file)
index 0000000..b431b8c
--- /dev/null
+++ b/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.jsx
@@ -0,0 +1,104 @@
+/*
+ * 
+ *   Copyright 2016 RIFT.IO Inc
+ *
+ *   Licensed under the Apache License, Version 2.0 (the "License");
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the License at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ *
+ */
+import './sshKeyCard.scss';
+import React, {Component} from 'react';
+import TextInput from 'widgets/form_controls/textInput.jsx';
+import SshKeyActions from './sshKeyActions.js';
+import Button from 'widgets/button/rw.button.js';
+
+export default class SshKeyCard extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {};
+        this.state.isExpanded = false;
+    }
+    cancelEdit(name) {
+            SshKeyActions.cancelEditSshKeyPair(name)
+    }
+    render() {
+        let {className, ...props} = this.props;
+        let editMode = props.editMode.toString().toUpperCase();
+        let editToolsHTML = null;
+        let isInEditMode = null;
+        let isInCreateMode = null;
+        className = "sshKeyCard " + className;
+        isInEditMode = editMode == "TRUE" ? true : false;
+        isInCreateMode = editMode == "CREATE" ? true : false;
+        if(isInEditMode) {
+            editToolsHTML = (
+                <div className="flex">
+                    <span className="oi sshKeyCard-button" data-glyph="circle-check" onClick={props.updateEditSshKeyPair(props.name)}></span>
+                    <span className="oi sshKeyCard-button" data-glyph="circle-x" onClick={props.cancelEditSshKeyPair(props.name)}></span>
+                </div>
+            )
+        } else {
+            if(isInCreateMode) {
+                editToolsHTML = (
+                    <div className="flex">
+                    <Button className="dark" label="Add Key" onClick={props.saveEditSshKeyPair({name: props.name, key: props.value})}></Button>
+                    </div>
+                );
+            } else {
+                editToolsHTML = (
+                    <div className="flex">
+                        <span className="oi sshKeyCard-button" data-glyph="pencil" title="Edit SSH Key" onClick={props.editKey}></span>
+                        <span className="oi sshKeyCard-button" data-glyph="trash" title="Delete SSH Key"  onClick={props.deleteKey}></span>
+                    </div>
+                );
+            }
+        }
+        return (
+            <div className={className}>
+                <TextInput className="sshKeyCard-thumbnail " value={props.name} readonly={true && !isInCreateMode} label="name"
+                 onChange={props.updateSshKeyPair(props.name, 'name')}
+                />
+                <div className="sshKeyCard-body">
+                    <TextInput type="textarea"
+                        className="sshKeyCard-key"
+                        value={props.value}
+                        readonly={!isInEditMode && !isInCreateMode} label="key"
+                        onChange={props.updateSshKeyPair(props.name, 'key')}
+                    />
+                </div>
+                <div className="sshKeyCard-controls">
+                    {
+                        editToolsHTML
+                    }
+                </div>
+            </div>
+        )
+    }
+}
+SshKeyCard.defaultProps = {
+    className: null,
+    editMode: false,
+    saveKey: function(e) {
+        console.log('saving key');
+    },
+    cancelEdit: function(e) {
+        console.log('canceling edit');
+    },
+    editKey: function(e) {
+        console.log('Starting edit')
+    },
+    deleteKey: function(e) {
+        console.log('deleting key')
+    }
+
+
+}