Merge pull request #109 from containerum/develop

Develop

src/components/ConfigMapByNSList/index.js

@@ -84,8 +84,7 @@ const ConfigMapList = ({
                   <tr
                     className={containerClassName}
                     style={{
-                      margin: 0,
-                      boxShadow: '0 2px 0 0 rgba(0, 0, 0, 0.05)'
+                      margin: 0
                     }}
                     key={name}
                   >

src/components/CreateDeploymentCards/Container/Environments/index.js

@@ -87,6 +87,7 @@ const Environments = ({
             <InputControl
               value={value}
               id={`envValue${id}`}
+              maxLength={150}
               type="text"
               baseClassName={`${formClassName} ${inputStyles.inputCustom}`}
               baseClassNameLabel={`${globalStyles.formGroupLabel} ${value &&

src/components/CreateUpdateCustomNamespaceInfo/index.js

@@ -71,7 +71,11 @@ const CreateCustomNamespaceInfo = ({
         </div>
       )}
     </div>
-    <div className="row rowLine" id="parameters">
+    <div
+      className="row rowLine"
+      id="parameters"
+      style={{ borderBottom: 'none' }}
+    >
       <div className="col-md-12">
         <div className="containerTitle containerBlockTitle">
           <span>*</span> Parameters

src/components/CustomerModal/AdminDeleteUserModal.js

@@ -61,15 +61,15 @@ const AdminDeleteUserModal = ({
   };
   const handleSubmitDeletingEssence = e => {
     e.preventDefault();
-    if (type === 'Delete User from Group') {
+    if (type === 'Deactivate User from Group') {
       handleOpenCloseModal();
       onHandleDelete(idGroup, name);
     }
     if (type === 'Delete Group') {
       handleOpenCloseModal();
       onHandleDelete(idName, name);
     }
-    if (type === 'Delete User') {
+    if (type === 'Deactivate User') {
       handleOpenCloseModal();
       onHandleDelete(idName, name);
     }
@@ -123,12 +123,12 @@ const AdminDeleteUserModal = ({
               </strong>) below to confirm you want to permanently delete it:
             </span>
           )}
-          {type === 'Delete User' && (
+          {type === 'Deactivate User' && (
             <span className={modalStyles.modalRedisText}>
               Enter user’s Email (<strong style={{ color: '#29abe2' }}>
                 {typeName}
               </strong>) below to<br />
-              confirm you want to permanently delete it:
+              confirm you want to deactivate the account:
             </span>
           )}
           {type === 'Delete User from Group' && (
@@ -143,7 +143,7 @@ const AdminDeleteUserModal = ({
             type="text"
             className="form-control volume-form-input"
             placeholder={
-              type === 'Delete User' || type === 'Delete User from Group'
+              type === 'Deactivate User' || type === 'Delete User from Group'
                 ? 'Email'
                 : 'Group'
             }
@@ -164,7 +164,7 @@ const AdminDeleteUserModal = ({
             className={styleSubmit}
             disabled={isDisabledSubmit}
           >
-            Delete
+            {type === 'Deactivate User' ? 'Deactivate' : 'Delete'}
           </button>
         </div>
       </form>

src/components/CustomerModal/DeleteModal.js

@@ -117,7 +117,10 @@ const DeleteModal = ({
             Deleting {type} is irreversible.<br />
             Enter {type} name (<strong style={{ color: '#29abe2' }}>
               {typeName}
-            </strong>) below to confirm you want to permanently delete it:
+            </strong>) below to confirm you want to{' '}
+            {type === 'Project'
+              ? 'permanently delete it'
+              : 'deactivate the account:'}:
           </span>
           <input
             type="text"
@@ -140,7 +143,7 @@ const DeleteModal = ({
             className={styleSubmit}
             disabled={isDisabledSubmit}
           >
-            Delete
+            {type === 'Project' ? 'Delete' : 'Deactivate'}
           </button>
         </div>
       </form>

src/components/CustomerModal/ResetPasswordModal.js

@@ -100,7 +100,7 @@ const ResetPasswordModal = ({
               </span>
             ) : (
               <span>
-                Are you ready want to reset password for the{' '}
+                Are you sure you want to reset password for the{' '}
                 <strong style={{ color: '#29abe2' }}>{isUser}</strong>?
               </span>
             )}

src/components/SideBarGetStartedModal/index.js

@@ -76,7 +76,11 @@ const SideBarGetStartedModal = ({
             />
             <span className={styles.BackWebPanel}>Back to Web Panel</span>
           </div>
-          <Link to={routerLinks.getStarted} className={styles.OpenNewWindow}>
+          <Link
+            to={routerLinks.getStarted}
+            className={styles.OpenNewWindow}
+            target="_blank"
+          >
             Open article in a new window{' '}
             <img src={icShare} style={{ marginLeft: 10 }} alt="icShare" />
           </Link>

src/containers/Account/DeleteAccount/index.js

@@ -81,10 +81,10 @@ export class DeleteAccount extends PureComponent<Props> {
           onHandleDelete={() => this.onHandleDelete()}
         />
         <div className={globalStyles.blockItem} id="delete-account">
-          <div className={globalStyles.blockItemTitle}>Delete Account</div>
+          <div className={globalStyles.blockItemTitle}>Deactivate Account</div>
           <div className={globalStyles.textLight}>
-            This action will delete {type === 'local' ? 'user' : 'your'} Apps
-            and Data
+            This action will deactivate {type === 'local' ? 'user' : 'your'}{' '}
+            Apps and Data
           </div>
           <div className={globalStyles.blockItemButtons}>
             <button
@@ -93,7 +93,7 @@ export class DeleteAccount extends PureComponent<Props> {
               } btn btn-outline-primary`}
               onClick={() => this.handleClickDeleteAccount()}
             >
-              Delete
+              Deactivate
             </button>
           </div>
         </div>

src/containers/CreateCustomVolume/index.js

@@ -177,7 +177,7 @@ export class CreateCustomVolume extends PureComponent<Props> {
   };
 
   render() {
-    const { createCustomVolumeReducer, getProfileReducer } = this.props;
+    const { createCustomVolumeReducer, getProfileReducer, match } = this.props;
     const { isVisibleMessage } = this.state;
     const role = getProfileReducer.data ? getProfileReducer.data.role : null;
     return (
@@ -187,7 +187,10 @@ export class CreateCustomVolume extends PureComponent<Props> {
           className="container-fluid breadcrumbNavigation"
           style={isVisibleMessage ? { marginBottom: 0 } : {}}
         >
-          <NavigationHeaderItem IdCreate="volume" idName="new" />
+          <NavigationHeaderItem
+            IdCreate="volume"
+            idName={match.params.idName}
+          />
         </div>
         {role &&
           isVisibleMessage && (

src/containers/CreateSecret/index.js

@@ -143,12 +143,15 @@ export class CreateSecret extends PureComponent<Props> {
   };
 
   render() {
-    const { createSecretReducer } = this.props;
+    const { createSecretReducer, match } = this.props;
     return (
       <div>
         <Helmet title="Create Secret" />
         <div className="container-fluid breadcrumbNavigation">
-          <NavigationHeaderItem IdCreate="secret" idName="new" />
+          <NavigationHeaderItem
+            IdCreate="secret"
+            idName={match.params.idName}
+          />
         </div>
         <Notification
           status={createSecretReducer.status}

src/containers/GlobalMembership/index.js

@@ -332,7 +332,7 @@ class GlobalMembership extends PureComponent<Props> {
         />
 
         <AdminDeleteUserModal
-          type="Delete User"
+          type="Deactivate User"
           name={this.state.inputEmailDelete}
           isOpened={this.state.isOpen}
           typeName={this.state.idUser}

src/containers/GraphsPerNodes/index.js

@@ -204,7 +204,9 @@ class GraphsPerNodes extends PureComponent<Props> {
             <div>
               <ul className="nav nav-pills mb-3" id="pills-tab" role="tablist">
                 <li className="nav-item">
-                  <div className="nav-link">&nbsp;</div>
+                  <div className="nav-link" style={{ height: '35.5px' }}>
+                    &nbsp;
+                  </div>
                 </li>
               </ul>
               <AreaChart

src/containers/Namespaces/index.js

@@ -282,7 +282,6 @@ export class Namespaces extends PureComponent<Props> {
   };
 
   render() {
-    console.log(this.state);
     const {
       deleteNamespaceReducer,
       createExternalServiceReducer,

src/containers/NamespacesSidebar/index.js

@@ -3,7 +3,7 @@ import React, { PureComponent } from 'react';
 import Modal from 'react-modal';
 import styles from './styles.scss';
 import alertPng from '../../images/error-icon.svg';
-import infoPng from '../../images/info-icon.svg';
+import infoPng from '../../images/info.svg';
 
 const customStyles = {
   overlay: {
@@ -37,7 +37,7 @@ type Props = {
   isSidebarOpen: boolean,
   handleCloseSidebar: () => void,
   eventsArray: any,
-  namespacesArray: any
+  namespacesArray: Array
 };
 
 export class NamespacesSidebar extends PureComponent<Props> {
@@ -58,7 +58,6 @@ export class NamespacesSidebar extends PureComponent<Props> {
     });
     return count;
   };
-
   simplifyEventTime = eventObj => {
     const time = new Date(eventObj.event_time).toLocaleString().split(', ');
     if (time[0] === new Date().toLocaleString().split(', ')[0]) {
@@ -103,21 +102,29 @@ export class NamespacesSidebar extends PureComponent<Props> {
         return eventObj.message;
     }
   };
-  // simplifyEventSource = evenObj => {
-  //   const result = this.state.namespacesArray.find(
-  //     namespace => namespace.id === evenObj.resource_namespace
-  //   );
-  //   return result.label;
-  // };
-
+  simplifyEventSource = eventObj => {
+    let result;
+    if (eventObj.resource_namespace) {
+      result = this.props.namespacesArray.find(
+        namespace => namespace.id === eventObj.resource_namespace
+      );
+      return typeof result === 'undefined' ? (
+        <p className="col-5">Source: Unknown</p>
+      ) : (
+        <p className="col-5">Source: {result.label}</p>
+      );
+    }
+    result = 'Bad namespace';
+    return result;
+  };
   simplifyEventIcon = evenObj => {
     if (evenObj.event_kind === 'warning') {
       return (
         <img
           src={alertPng}
           className="col-2"
           alt="warning"
-          style={{ height: '50px' }}
+          style={{ height: '30px' }}
         />
       );
     }
@@ -126,39 +133,29 @@ export class NamespacesSidebar extends PureComponent<Props> {
         src={infoPng}
         className="col-2"
         alt="info"
-        style={{ height: '50px' }}
+        style={{ height: '30px' }}
       />
     );
   };
 
-  renderEventElement = eventObj => {
-    const underStyles = {
-      maxHeight: '100px',
-      borderBottom: '1px solid #eaeaea',
-      color: '#333333',
-      fontSize: '15px',
-      fontWeight: '300'
-    };
-    return (
-      <div style={underStyles} key={eventObj.id}>
-        <div className="row  pt-2">
-          {this.simplifyEventIcon(eventObj)}
-          <p className="col-10 text-left">
-            {this.simplifyEventMessage(eventObj)}
-          </p>
-        </div>
-        <div className="row">
-          <d className="col-2" />
-          {/* <p className="col-6">Source: {this.simplifyEventSource(eventObj)}</p> */}
-          <p className="col-6">Source: namespace</p>
-          <p className="col-4">{this.simplifyEventTime(eventObj)}</p>
-        </div>
+  renderEventElement = eventObj => (
+    <div className={styles.eventElement} key={eventObj.id}>
+      <div className="row  pt-2">
+        {this.simplifyEventIcon(eventObj)}
+        <p className="col-10 text-left">
+          {this.simplifyEventMessage(eventObj)}
+        </p>
       </div>
-    );
-  };
+      <div className="row">
+        <div className="col-2" />
+        {this.simplifyEventSource(eventObj)}
+        <p className="col-5">{this.simplifyEventTime(eventObj)}</p>
+      </div>
+    </div>
+  );
 
   render() {
-    console.log(this.props);
+    console.log(this.state);
     return (
       <Modal
         isOpen={this.props.isSidebarOpen}

src/containers/NamespacesSidebar/styles.scss

@@ -23,4 +23,20 @@
 
 .sidebarBody{
   height: auto;
+  overflow: hidden;
+
+  .eventElement{
+    max-height: 100px;
+    border-bottom: 1px solid #eaeaea;
+    color: #333;
+    font-size: 15px;
+    font-weight: 300;
+    overflow: hidden;
+    transition: max-height 1s ease-out;
+
+    &:hover{
+      max-height: 300px;
+      transition: max-height 1s ease-in;
+    }
+  }
 }

src/functions/WS/getEventList.js

@@ -9,7 +9,7 @@ const getEventList = () => {
     return new WebSocket(
       `${wsApi}/events/all?User-Token=${cookie.load(
         'accessToken'
-      )}&User-Client=${browser}&limit=10`
+      )}&User-Client=${browser}&limit=20`
     );
   }
   return 'Your browser does not support WebSockets';