Просмотр исходного кода

Improve endpoint status in lists using logos

When showing replicas / migrations list, if a replica / migration
endpoint is missing show 'Not Found' where endpoint's logo would be.
After replicas / migrations list has loaded, if the endpoints are still
loading, endpoint logo is not available, since we don't know yet the
replica / migration's endpoint's type. Show 'Loading...' instead where
endpoint's logo would be.
Sergiu Miclea 8 лет назад
Родитель
Сommit
bba9839ef7

+ 1 - 1
src/components/atoms/EndpointLogos/index.jsx

@@ -147,7 +147,7 @@ class EndpointLogos extends React.Component<Props> {
   }
 
   renderGenericLogo(size: {w: number, h: number}) {
-    return <Generic size={size} name={this.props.endpoint || 'Generic Cloud'} disabled={this.props.disabled} />
+    return <Generic size={size} name={this.props.endpoint || ''} disabled={this.props.disabled} />
   }
 
   render() {

+ 7 - 4
src/components/pages/MigrationsPage/index.jsx

@@ -71,7 +71,7 @@ class MigrationsPage extends React.Component<{}, State> {
     document.title = 'Coriolis Migrations'
 
     ProjectStore.getProjects()
-    EndpointStore.getEndpoints()
+    EndpointStore.getEndpoints({ showLoading: true })
 
     this.stopPolling = false
     this.pollData()
@@ -99,7 +99,7 @@ class MigrationsPage extends React.Component<{}, State> {
     // $FlowIssue
     Wait.for(() => UserStore.user.project.id === project.id, () => {
       ProjectStore.getProjects()
-      EndpointStore.getEndpoints()
+      EndpointStore.getEndpoints({ showLoading: true })
       MigrationStore.getMigrations({ showLoading: true })
     })
 
@@ -108,7 +108,7 @@ class MigrationsPage extends React.Component<{}, State> {
 
   handleReloadButtonClick() {
     ProjectStore.getProjects()
-    EndpointStore.getEndpoints()
+    EndpointStore.getEndpoints({ showLoading: true })
     MigrationStore.getMigrations({ showLoading: true })
   }
 
@@ -258,7 +258,10 @@ class MigrationsPage extends React.Component<{}, State> {
                     if (endpoint) {
                       return endpoint.type
                     }
-                    return ''
+                    if (EndpointStore.loading) {
+                      return 'Loading...'
+                    }
+                    return 'Not Found'
                   }}
                   useTasksRemaining
                 />)

+ 7 - 4
src/components/pages/ReplicasPage/index.jsx

@@ -69,7 +69,7 @@ class ReplicasPage extends React.Component<{}, State> {
     document.title = 'Coriolis Replicas'
 
     ProjectStore.getProjects()
-    EndpointStore.getEndpoints()
+    EndpointStore.getEndpoints({ showLoading: true })
 
     this.stopPolling = false
     this.pollData()
@@ -105,7 +105,7 @@ class ReplicasPage extends React.Component<{}, State> {
     Wait.for(() => UserStore.user.project.id === project.id, () => {
       ProjectStore.getProjects()
       ReplicaStore.getReplicas()
-      EndpointStore.getEndpoints()
+      EndpointStore.getEndpoints({ showLoading: true })
     })
 
     UserStore.switchProject(project.id)
@@ -114,7 +114,7 @@ class ReplicasPage extends React.Component<{}, State> {
   handleReloadButtonClick() {
     ProjectStore.getProjects()
     ReplicaStore.getReplicas({ showLoading: true })
-    EndpointStore.getEndpoints()
+    EndpointStore.getEndpoints({ showLoading: true })
   }
 
   handleItemClick(item: MainItem) {
@@ -233,7 +233,10 @@ class ReplicasPage extends React.Component<{}, State> {
                     if (endpoint) {
                       return endpoint.type
                     }
-                    return ''
+                    if (EndpointStore.loading) {
+                      return 'Loading...'
+                    }
+                    return 'Not Found'
                   }}
                 />)
               }