Merge pull request #907 from sjd78/remove-legacy-part1

Disable legacy view support for VMs, simplify view for Pool details
oVirt · Jan 9, 2019 · 62b7cd4 · 62b7cd4
2 parents d0bfb6f + 0891044
commit 62b7cd4
Show file tree

Hide file tree

Showing 10 changed files with 59 additions and 440 deletions.
diff --git a/src/components/Pages/index.js b/src/components/Pages/index.js
@@ -22,51 +22,6 @@ const VmsPage = () => {
   return <VmsList />
 }
 
-/**
- * Route component (for PageRouter) to view a VM's details
- */
-class LegacyVmDetailsPage extends React.Component {
-  constructor (props) {
-    super(props)
-    this.state = {
-      vmId: undefined,
-    }
-  }
-
-  static getDerivedStateFromProps (props, state) {
-    if (state.vmId !== props.match.params.id) {
-      const vmId = props.match.params.id
-
-      return { vmId }
-    }
-
-    return null
-  }
-
-  render () {
-    const { vms } = this.props
-    const { vmId } = this.state
-
-    if (vmId && vms.getIn(['vms', vmId])) {
-      return (<LegacyVmDetails vm={vms.getIn(['vms', vmId])} />)
-    }
-
-    // TODO: Add handling for if the fetch runs but fails (FETCH-FAIL), see issue #631
-    console.info(`LegacyVmDetailsPage: VM id cannot be found: ${vmId}`)
-    return null
-  }
-}
-LegacyVmDetailsPage.propTypes = {
-  vms: PropTypes.object.isRequired,
-  match: RouterPropTypeShapes.match.isRequired,
-}
-const LegacyVmDetailsPageConnected = connect(
-  (state) => ({
-    vms: state.vms,
-  }),
-  (dispatch) => ({})
-)(LegacyVmDetailsPage)
-
 /**
  * Route component (for PageRouter) to view a VM's details
  */
@@ -96,7 +51,7 @@ class VmDetailsPage extends React.Component {
     }
 
     // TODO: Add handling for if the fetch runs but fails (FETCH-FAIL), see issue #631
-    console.info(`VmDetailPage: VM id cannot be found: ${vmId}`)
+    console.info(`VmDetailsPage: VM id cannot be found: ${vmId}`)
     return null
   }
 }
@@ -142,7 +97,7 @@ class PoolDetailsPage extends React.Component {
     }
 
     // TODO: Add handling for if the fetch runs but fails (FETCH-FAIL), see issue #631
-    console.info(`PoolDetailPage: Pool id cannot be found: ${poolId}`)
+    console.info(`PoolDetailsPage: Pool id cannot be found: ${poolId}`)
     return null
   }
 }
@@ -195,93 +150,9 @@ const VmCreatePageConnected = connect(
   })
 )(VmCreatePage)
 
-/**
- * Route component (for PageRouter) to edit a VM
- *
- * Only let a user view the `VmDialog` if they can 1. edit a VM in general (i.e. there
- * is at least 1 cluster they can use), and 2. edit the specific VM requested.
- */
-class VmEditPage extends React.Component {
-  constructor (props) {
-    super(props)
-    this.state = {
-      vmId: undefined,
-    }
-  }
-
-  static getDerivedStateFromProps (props, state) {
-    if (state.vmId !== props.match.params.id) {
-      const vmId = props.match.params.id
-
-      return { vmId }
-    }
-
-    return null
-  }
-
-  componentDidUpdate () {
-    // If the user cannot edit any VMs (not just the one requested), bump them out
-    if (!this.props.canUserEditVMs) {
-      this.props.redirectToMainPage()
-      this.props.addUserMessage(msg.permissionsNoEditVm())
-    }
-  }
-
-  render () {
-    const {
-      vms,
-      previousPath,
-      canUserEditVMs,
-      redirectToMainPage,
-      addUserMessage,
-    } = this.props
-    const { vmId } = this.state
-
-    if (!canUserEditVMs) {
-      return null
-    }
-
-    if (vmId && vms.getIn(['vms', vmId])) {
-      // Verify the user can edit this specific VM
-      if (!vms.getIn(['vms', vmId, 'canUserEditVm'])) {
-        redirectToMainPage()
-        addUserMessage(msg.permissionsNoEditThisVm({ name: vms.getIn(['vms', vmId, 'name']), vmId }))
-        return null
-      } else {
-        return <VmDialog previousPath={previousPath} vm={vms.getIn(['vms', vmId])} />
-      }
-    }
-
-    // TODO: Add handling for if the fetch runs but fails (FETCH-FAIL), see issue #631
-    console.info(`VmEditPage: VM id cannot be found: ${vmId}`)
-    return null
-  }
-}
-VmEditPage.propTypes = {
-  canUserEditVMs: PropTypes.bool.isRequired,
-  vms: PropTypes.object.isRequired,
-  previousPath: PropTypes.string.isRequired,
-  match: RouterPropTypeShapes.match.isRequired,
-
-  redirectToMainPage: PropTypes.func.isRequired,
-  addUserMessage: PropTypes.func.isRequired,
-}
-const VmEditPageConnected = connect(
-  (state) => ({
-    canUserEditVMs: canUserUseAnyClusters(state.clusters) && state.clusters.size > 0,
-    vms: state.vms,
-  }),
-  (dispatch) => ({
-    redirectToMainPage: () => dispatch(push('/')),
-    addUserMessage: (message) => dispatch(addUserMessage({ message })),
-  })
-)(VmEditPage)
-
 export {
   PoolDetailsPageConnected as PoolDetailsPage,
-  LegacyVmDetailsPageConnected as LegacyVmDetailsPage,
   VmDetailsPageConnected as VmDetailsPage,
   VmCreatePageConnected as VmCreatePage,
-  VmEditPageConnected as VmEditPage,
   VmsPage,
 }
diff --git a/src/components/VmActions/Action.js b/src/components/VmActions/Action.js
@@ -1,9 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-
-import Button from './Button'
 import { excludeKeys } from 'patternfly-react'
 
+import { hrefWithoutHistory } from '_/helpers'
+
+import style from './style.css'
+
 class Action extends React.Component {
   constructor (props) {
     super(props)
@@ -35,19 +37,60 @@ class Action extends React.Component {
     </React.Fragment>
   }
 }
-
 Action.propTypes = {
   children: PropTypes.node.isRequired,
   confirmation: PropTypes.node,
 }
 
 export default Action
 
+class Button extends React.Component {
+  render () {
+    let {
+      className,
+      tooltip = '',
+      actionDisabled = false,
+      onClick,
+      shortTitle,
+      id,
+    } = this.props
+
+    let handleClick = hrefWithoutHistory(onClick)
+
+    if (actionDisabled) {
+      return (
+        <button className={`${className} ${style['disabled-button']}`} disabled='disabled' id={id}>
+          <span data-toggle='tooltip' data-placement='left' title={tooltip}>
+            {shortTitle}
+          </span>
+        </button>
+      )
+    }
+
+    return (
+      <span className={style['full-button']}>
+        <a href='#' onClick={handleClick} className={`${className} ${style['link']}`} id={id}>
+          <span data-toggle='tooltip' data-placement='left' title={tooltip} id={`${id}-title`}>
+            {shortTitle}
+          </span>
+        </a>
+      </span>
+    )
+  }
+}
+Button.propTypes = {
+  className: PropTypes.string.isRequired,
+  tooltip: PropTypes.string,
+  shortTitle: PropTypes.string.isRequired,
+  onClick: PropTypes.func,
+  actionDisabled: PropTypes.bool,
+  id: PropTypes.string.isRequired,
+}
+
 const ActionButtonWraper = (props) => {
   const btnProps = excludeKeys(props, [ 'confirmation' ])
   return <Action confirmation={props.confirmation} key={props.shortTitle}><Button {...btnProps} /></Action>
 }
-
 ActionButtonWraper.propTypes = {
   confirmation: PropTypes.node,
   ...Button.propTypes,

diff --git a/src/components/VmActions/Button.js b/src/components/VmActions/Button.js
diff --git a/src/components/VmActions/index.js b/src/components/VmActions/index.js
@@ -28,7 +28,6 @@ import {
 
 import { SplitButton, MenuItem } from 'patternfly-react'
 import Checkbox from '../Checkbox'
-import LinkButton from './LinkButton'
 import ConfirmationModal from './ConfirmationModal'
 import ConsoleConfirmationModal from './ConsoleConfirmationModal'
 import Action, { ActionButtonWraper } from './Action'
@@ -197,8 +196,6 @@ class VmActions extends React.Component {
       isOnCard = false,
       idPrefix = `vmaction-${vm.get('name')}`,
       onRemove,
-      location,
-      isEditable,
     } = this.props
 
     const isPool = !!pool
@@ -245,44 +242,6 @@ class VmActions extends React.Component {
 
         {actions.map(action => <ActionButtonWraper key={action.id} {...action} />)}
 
-        <span className={style['button-spacer']} />
-
-        {location && /vm-legacy/.test(location.pathname) && (
-          <LinkButton
-            isOnCard={isOnCard}
-            shortTitle='Dashboard View'
-            tooltip='Dashboard View'
-            to={`/vm/${vm.get('id')}`}
-            button='btn btn-default'
-            className={`pficon pficon-edit ${style['action-link']}`}
-            id={`action-${vm.get('name')}-edit`}
-          />
-        )}
-
-        {location && /vm\//.test(location.pathname) && (
-          <LinkButton
-            isOnCard={isOnCard}
-            shortTitle='Normal View'
-            tooltip='Normal View'
-            to={`/vm-legacy/${vm.get('id')}`}
-            button='btn btn-default'
-            className={`pficon pficon-edit ${style['action-link']}`}
-            id={`action-${vm.get('name')}-edit`}
-          />
-        )}
-
-        <LinkButton
-          isOnCard={isOnCard}
-          shortTitle={msg.edit()}
-          tooltip={msg.editVm()}
-          actionDisabled={!isEditable}
-          to={`/vm/${vm.get('id')}/edit`}
-          button='btn btn-default'
-          className={`pficon pficon-edit ${style['action-link']}`}
-          id={`action-${vm.get('name')}-edit`}
-        />
-        <span className={style['button-spacer']} />
-
         <ActionButtonWraper
           confirmation={removeConfirmation}
           actionDisabled={isPool || !canRemove(status) || vm.getIn(['actionInProgress', 'remove'])}

diff --git a/src/components/VmActions/style.css b/src/components/VmActions/style.css
@@ -17,19 +17,20 @@
 }
 
 .action-link {
-	color: #363636;
+    color: #363636;
 }
 
 .link {
-	height: 27px;
+    height: 27px;
 }
 
 .disabled-button {
-	line-height: 21px;
+    line-height: 21px;
+    margin-left: 5px;
 }
 
 .full-button {
-	display: inline-block;
+    display: inline-block;
     text-align: center;
     margin-left: 5px;
 }
@@ -39,7 +40,7 @@
 }
 
 .button-spacer {
-    width: 10px;
+    width: 5px; /* match .full-button left margin */
     display: inline-block;
 }