             <Heading tag='h2'>{name}</Heading>
             <List>
               {li 'Created', moment(service.container?.created).fromNow()}
-              {li 'State', service.state}
+              {li 'State', renderStatus service}
               {li 'FQDN', service.fqdn}
               {li 'Container name', service.container?.name}
               {li 'Ports', service.ports}
-              {li 'Network', service.aux?.net?.state}
+              {li 'Network', renderNetwork service.aux?.net}
+              {if service.aux.ssh
+                console.log 'ssh', service.aux.ssh
+                li 'SSH', renderStatus service.aux.ssh
+              }
             </List>
           </Section>
         }

        </div>

        {unless @props.instance?.services
          <div style={textAlign:'center', padding: 40}>
            <h3>Service information will be displayed here as soon as the instance starts...</h3>
          </div>
        }

        {_.map @props.instance.services, (service, name) ->

        <Section pad='medium'>
          <List>
            {li 'Application', appWithLink()}
            {if bucket = @props.instance.storageBucket
              li 'Storage bucket', iconLink bucket, @props.onOpenBucketPage
            }
            {li 'Started by', avatarAndName()}
          </List>
        </Section>
