fix: Add upgrade for openpitrix app instance

src/actions/openpitrix.js

@@ -181,7 +181,7 @@ export default {
     on({ store, success, ...props }) {
       const modal = Modal.open({
         onOk: async params => {
-          const { workspace, namespace, cluster, ...rest } = params
+          const { namespace, cluster, ...rest } = params
           await store.deploy(rest, { namespace, cluster })
           Modal.close(modal)
           Notify.success({ content: `${t('Deploy Successfully')}!` })

src/components/Forms/AppDeploy/AppConfig/index.jsx

@@ -81,6 +81,7 @@ export default class Services extends React.Component {
         ...getValueObj(this.state.valuesYaml),
         Name: formData.name || '',
         Description: formData.desc || '',
+        Workspace: formData.workspace,
       })
     )
   }

src/components/Modals/ProjectSelect/index.jsx

@@ -129,6 +129,8 @@ export default class ProjectSelectModal extends React.Component {
 
     if (this.state.type === 'federatedprojects') {
       params.labelSelector = `kubesphere.io/workspace=${workspace}`
+    } else {
+      params.labelSelector = 'kubefed.io/managed!=true'
     }
 
     this.stores[this.state.type].fetchList(params)

src/locales/zh/application.js

@@ -28,6 +28,8 @@ export default {
   'Application Type': '应用类型',
   TOTAL_APPS: '共计 {num} 个应用',
   TOTAL_COLLECTIONS: '共计 {num} 个接受者',
+  Upgrade: '升级',
+  Rollback: '回滚',
 
   'Create Application by Service': '通过服务构建应用',
 

src/pages/apps/components/Lists/InstanceList/Item.jsx

@@ -18,13 +18,14 @@
 
 import React from 'react'
 import PropTypes from 'prop-types'
-import { Link } from 'react-router-dom'
 import classnames from 'classnames'
 import { inject } from 'mobx-react'
 
 import { Status, Image } from 'components/Base'
 import { getLocalTime } from 'utils'
 
+import ProjectStore from 'stores/project'
+
 import styles from './index.scss'
 
 @inject('rootStore')
@@ -45,19 +46,41 @@ export default class InstanceItem extends React.PureComponent {
   constructor(props) {
     super(props)
     this.store = this.props.store
+
+    this.projectStore = new ProjectStore()
+  }
+
+  get routing() {
+    return this.props.rootStore.routing
+  }
+
+  handleClick = async () => {
+    const { detail } = this.props
+    const { cluster } = detail
+    const { cluster_id, zone, runtime_id } = cluster
+
+    await this.projectStore.fetchDetail({
+      cluster: runtime_id,
+      namespace: zone,
+    })
+
+    const { workspace } = this.projectStore.detail
+
+    const link = `/${workspace}/clusters/${runtime_id}/projects/${zone}/applications/template/${cluster_id}`
+
+    this.routing.push(link)
   }
 
   renderContent() {
     const { detail, showVersion } = this.props
     const { cluster, version } = detail
-    const { cluster_id, zone } = cluster
-    const link = `/projects/${zone}/applications/template/${cluster_id}`
+    const { zone, runtime_id } = cluster
 
     return (
       <div className={styles.content}>
         <dl>
           <dt>
-            <Link to={link}>{cluster.name}</Link>
+            <a onClick={this.handleClick}>{cluster.name}</a>
           </dt>
           <dd>{t('Instance Name')}</dd>
         </dl>
@@ -71,6 +94,10 @@ export default class InstanceItem extends React.PureComponent {
           <dt>{zone}</dt>
           <dd>{t('In Project')}</dd>
         </dl>
+        <dl>
+          <dt>{runtime_id}</dt>
+          <dd>{t('Cluster')}</dd>
+        </dl>
         <dl>
           <dt>
             {getLocalTime(cluster.upgrade_time || cluster.create_time).format(

src/pages/projects/containers/Applications/OPAppDetail/AppTemplate/index.jsx

@@ -16,15 +16,15 @@
  * along with KubeSphere Console.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { get, isEmpty } from 'lodash'
+import { isEmpty } from 'lodash'
 import React from 'react'
 import { when, toJS } from 'mobx'
 import { observer, inject } from 'mobx-react'
+import { Tabs } from '@pitrix/lego-ui'
 
 import AppVersionStore from 'stores/openpitrix/version'
 import AppFileStore from 'stores/openpitrix/file'
 
-import { Tabs } from '@pitrix/lego-ui'
 import { Card } from 'components/Base'
 import Markdown from 'components/Base/Markdown'
 import TextPreview from 'components/TextPreview'
@@ -54,7 +54,7 @@ export default class AppTemplate extends React.Component {
   }
 
   get workspace() {
-    return get(this, 'props.rootStore.project.detail.workspace')
+    return this.props.match.params.workspace
   }
 
   getData() {
@@ -73,21 +73,28 @@ export default class AppTemplate extends React.Component {
     this.setState({ tab })
   }
 
-  handleUpgrade = version_id => {
+  handleUpgrade = async version_id => {
     const {
-      detail: { cluster_id },
+      detail: { cluster_id, name, app_id, env },
     } = toJS(this.store)
+    const { workspace, namespace, cluster } = this.props.match.params
+    await this.store.upgrade(
+      {
+        app_id,
+        cluster_id,
+        name,
+        version_id,
+        conf: env,
+      },
+      { namespace, cluster }
+    )
 
-    this.store.upgrade({ cluster_id, version_id })
+    this.props.rootStore.routing.push(
+      `/${workspace}/clusters/${cluster}/projects/${namespace}/applications/template`
+    )
   }
 
-  handleRollback = version_id => {
-    const {
-      detail: { cluster_id },
-    } = toJS(this.store)
-
-    this.store.upgrade({ cluster_id, version_id })
-  }
+  handleRollback = () => {}
 
   renderReadme() {
     const files = this.appFileStore.files
@@ -109,15 +116,16 @@ export default class AppTemplate extends React.Component {
 
   renderVersionInfo() {
     const { detail } = toJS(this.store)
-    const { namespace } = this.props.match.params
+    const { cluster, workspace, namespace } = this.props.match.params
     const { data, isLoading } = toJS(this.appVersionStore.list)
 
     return (
       <VersionInfo
         data={data}
         loading={isLoading}
         detail={detail}
-        workspace={this.workspace}
+        cluster={cluster}
+        workspace={workspace}
         namespace={namespace}
         onUpgrade={this.handleUpgrade}
         onRollback={this.handleRollback}

src/pages/projects/containers/Applications/OPAppDetail/VersionInfo/index.jsx

@@ -17,26 +17,27 @@
  */
 
 import React from 'react'
-import { Link } from 'react-router-dom'
 
 import { Button } from 'components/Base'
 
 import styles from './index.scss'
 
-const Item = ({ data, currentVersion, urlPrefix }) => {
-  const url = `${urlPrefix}&version=${data.version_id}`
+const Item = ({ data, onUpgrade, currentVersion }) => {
+  const handleUpgrade = () => onUpgrade(data.version_id)
 
   return (
     <div className={styles.item}>
-      <Link to={url}>{data.name}</Link>
+      <span>{data.name}</span>
       {currentVersion.version_id === data.version_id && (
         <div className={styles.tag}>{t('Current Version')}</div>
       )}
       {currentVersion.version_id !== data.version_id && (
         <div className={styles.operations}>
-          <Link to={url}>
-            <Button noShadow>{t('Deploy New Application')}</Button>
-          </Link>
+          <Button onClick={handleUpgrade} noShadow>
+            {currentVersion.create_time < data.create_time
+              ? t('Upgrade')
+              : t('Rollback')}
+          </Button>
         </div>
       )}
     </div>
@@ -48,6 +49,7 @@ export default class VersionInfo extends React.Component {
     const {
       data,
       detail,
+      cluster,
       workspace,
       namespace,
       onUpgrade,
@@ -58,7 +60,7 @@ export default class VersionInfo extends React.Component {
 
     const urlPrefix = `/apps/${
       detail.app_id
-    }?workspace=${workspace}&namespace=${namespace}`
+    }?workspace=${workspace}&cluster=${cluster}&namespace=${namespace}`
 
     return (
       <ul>

src/stores/openpitrix/app.js

@@ -78,20 +78,6 @@ export default class App extends Base {
     }
   }
 
-  @action
-  async upgrade(params) {
-    await this.submitting(
-      request.post(`${this.baseUrl}clusters/upgrade`, params)
-    )
-  }
-
-  @action
-  async rollback(params) {
-    await this.submitting(
-      request.post(`${this.baseUrl}clusters/rollback`, params)
-    )
-  }
-
   @action
   uploadIcon = base64Str =>
     this.upload({

src/stores/openpitrix/application.js

@@ -168,6 +168,13 @@ export default class Application extends Base {
     this.isLoading = false
   }
 
+  @action
+  async upgrade(params, { namespace, cluster }) {
+    return this.submitting(
+      request.post(this.getUrl({ namespace, cluster }), params)
+    )
+  }
+
   @action
   update = ({ cluster_id, cluster, zone, ...data }) =>
     this.submitting(
@@ -196,15 +203,4 @@ export default class Application extends Base {
         )
       )
     )
-
-  // todo: nex version
-  @action
-  upgrade = ({ cluster_id, cluster, version_id }) =>
-    this.submitting(
-      request.post(`${this.baseUrl}clusters/upgrade`, {
-        cluster_id,
-        cluster,
-        version_id,
-      })
-    )
 }

src/stores/openpitrix/version.js

@@ -25,7 +25,7 @@ import Base from './base'
 export default class Version extends Base {
   resourceName = 'versions'
 
-  sortKey = 'sequence'
+  sortKey = 'create_time'
 
   defaultStatus = DEFAULT_QUERY_STATUS