fix(dashboard): conform to new "get config" response

dashboard/src/api/types.ts

@@ -9,6 +9,10 @@
 // TODO: Figure out how to do proper type handling. The types here are mostly just copied from
 // garden-service to facilitate rendering.
 
+export type Primitive = string | number | boolean
+
+export interface PrimitiveMap { [key: string]: Primitive }
+
 export interface DashboardPage {
   title: string
   description: string
@@ -22,27 +26,23 @@ export interface Provider {
   name: string
 }
 
-export interface Service {
-  config: any
+export interface CommonServiceSpec {
+  name: string
+  dependencies: string[]
+  outputs: PrimitiveMap
+}
+
+export interface ServiceConfig extends CommonServiceSpec {
   name: string
   spec: any
 }
 
-export interface Module {
+export interface ModuleConfig {
   name: string
-  buildPath: string
+  path: string
   type: string
-  // version: ModuleVersion
-
-  services: Service[]
-  serviceNames: string[]
-  serviceDependencyNames: string[]
-
-  // tasks: Task<Module<M, S, T, W>>[]
-  taskNames: string[]
-  taskDependencyNames: string[]
 
-  // _ConfigType: ModuleConfig<M, S, T, W>
+  serviceConfigs: ServiceConfig[]
 }
 
 export interface ServiceIngress {
@@ -81,7 +81,7 @@ export interface FetchStatusResponse {
 export interface FetchConfigResponse {
   environmentName: string
   providers: Provider[]
-  modules: Module[]
+  moduleConfigs: ModuleConfig[]
 }
 
 export type RenderedNode = { type: RenderedNodeType, name: string }

dashboard/src/components/logs.tsx

@@ -7,14 +7,15 @@
  */
 
 import styled from "@emotion/styled/macro"
-import { flatten, max } from "lodash"
+import { max } from "lodash"
 import React, { Component } from "react"
 
 import Terminal from "./terminal"
 import { FetchConfigResponse, FetchLogsResponse } from "../api/types"
 import Card, { CardTitle } from "./card"
 import { colors } from "../styles/variables"
 import { LoadLogs } from "../context/data"
+import { getServiceNames } from "../util/helpers"
 
 interface Props {
   config: FetchConfigResponse
@@ -58,14 +59,13 @@ class Logs extends Component<Props, State> {
   }
 
   refresh() {
-    const serviceNames = flatten(this.props.config.modules.map(m => m.serviceNames))
-    this.props.loadLogs(serviceNames, true)
+    this.props.loadLogs(getServiceNames(this.props.config.moduleConfigs), true)
   }
 
   render() {
     const { config, logs } = this.props
     const { selectedService } = this.state
-    const serviceNames = flatten(config.modules.map(m => m.serviceNames))
+    const serviceNames = getServiceNames(config.moduleConfigs)
     const maxServiceName = max(serviceNames).length
     const title = selectedService === "all"
       ? "All service logs"

dashboard/src/components/overview.tsx

@@ -16,7 +16,7 @@ import { ExternalLink } from "./links"
 
 import {
   ServiceStatus,
-  Module,
+  ModuleConfig,
   ServiceIngress,
 } from "../api/types"
 
@@ -30,20 +30,20 @@ export function getIngressUrl(ingress: ServiceIngress) {
 }
 
 interface ServicesProps {
-  modules: Module[]
+  moduleConfigs: ModuleConfig[]
   services: { [name: string]: ServiceStatus }
 }
 
 interface ModulesProps {
-  modules: Module[]
+  moduleConfigs: ModuleConfig[]
 }
 
-export const Modules: React.SFC<ModulesProps> = ({ modules }) => {
+export const Modules: React.SFC<ModulesProps> = ({ moduleConfigs }) => {
   const rowHeaders = ["Name", "Type", "Services"]
-  const rows = modules.map(module => [
-    module.name,
-    module.type,
-    module.services.map(s => s.name).join("\n"),
+  const rows = moduleConfigs.map(moduleConfig => [
+    moduleConfig.name,
+    moduleConfig.type,
+    moduleConfig.serviceConfigs.map(s => s.name).join("\n"),
   ])
   return (
     <Table
@@ -54,12 +54,12 @@ export const Modules: React.SFC<ModulesProps> = ({ modules }) => {
   )
 }
 
-export const Services: React.SFC<ServicesProps> = ({ modules, services }) => {
+export const Services: React.SFC<ServicesProps> = ({ moduleConfigs, services }) => {
   const rowHeaders = ["Name", "Status", "Module", "Ingresses"]
   const rows = Object.keys(services).map(service => [
     service,
     services[service].state,
-    modules.find(m => m.serviceNames.includes(service)).name,
+    moduleConfigs.find(m => m.serviceConfigs.map(s => s.name).includes(service)).name,
     <Ingresses ingresses={services[service].ingresses} />,
   ])
   return (

dashboard/src/containers/logs.tsx

@@ -6,13 +6,13 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import { flatten } from "lodash"
 import React, { useContext, useEffect } from "react"
 
 import PageError from "../components/page-error"
 import Logs from "../components/logs"
 import LoadWrapper from "../components/load-wrapper"
 import { DataContext } from "../context/data"
+import { getServiceNames } from "../util/helpers"
 
 export default () => {
   const {
@@ -37,9 +37,8 @@ const LogsContainer = () => {
     store: { config, logs },
   } = useContext(DataContext)
 
-  const serviceNames = flatten(config.data.modules.map(m => m.serviceNames))
   useEffect(() => {
-    loadLogs(serviceNames)
+    loadLogs(getServiceNames(config.data.moduleConfigs))
   }, [])
 
   const isLoading = !logs.data

dashboard/src/containers/overview.tsx

@@ -43,15 +43,15 @@ export default () => {
   return (
     <div>
       <LoadWrapper error={config.error} ErrorComponent={PageError} loading={isLoadingModules}>
-        <Modules modules={config.data && config.data.modules} />
+        <Modules moduleConfigs={config.data && config.data.moduleConfigs} />
       </LoadWrapper>
       <LoadWrapper
         error={status.error}
         LoadComponent={ServiceLoadMsg}
         ErrorComponent={PageError}
         loading={isLoadingServices}>
         <Services
-          modules={config.data && config.data.modules}
+          moduleConfigs={config.data && config.data.moduleConfigs}
           services={status.data && status.data.services}
         />
       </LoadWrapper>

dashboard/src/util/helpers.ts

@@ -0,0 +1,14 @@
+/*
+ * Copyright (C) 2018 Garden Technologies, Inc. <info@garden.io>
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+import { flatten } from "lodash"
+import { ModuleConfig } from "../api/types"
+
+export function getServiceNames(moduleConfigs: ModuleConfig[]) {
+  return flatten(moduleConfigs.map(m => m.serviceConfigs.map(s => s.name)))
+}