diff --git a/src/components/Dashboard.tsx b/src/components/Dashboard.tsx index 0f94b1f..e2da764 100644 --- a/src/components/Dashboard.tsx +++ b/src/components/Dashboard.tsx @@ -25,7 +25,6 @@ export default function Dashboard() { }; const loadEnv = (envTab: EnvTab) => { - console.log("loading env:", envTab); setLoadingErr(null); setLoadingEnv(true); diff --git a/src/components/dashboard/EnvironmentList.tsx b/src/components/dashboard/EnvironmentList.tsx index f909140..575085d 100644 --- a/src/components/dashboard/EnvironmentList.tsx +++ b/src/components/dashboard/EnvironmentList.tsx @@ -1,17 +1,41 @@ import React from "react"; import { Environment } from "types"; -import TenantList from "components/dashboard/TenantList"; +import TenantList, { tenantHasServices } from "components/dashboard/TenantList"; import Typography from "@mui/material/Typography"; import Box from "@mui/material/Box"; import Container from "@mui/material/Container"; import { useGlobalState } from "GlobalStateProvider"; +function environmentHasTenants(env: Environment): boolean { + return env.tenants.filter((tenant) => tenantHasServices(tenant)).length > 0; +} + interface EnvironmentListProps { environments: Environment[]; } export default function EnvironmentList({ environments }: EnvironmentListProps) { - const envItems = environments.map((env) => { + let filteredEnvironments: Environment[] = []; + const { state } = useGlobalState(); + + // deep clone array + filteredEnvironments = JSON.parse(JSON.stringify(environments)); + + // filter services + filteredEnvironments.forEach((env) => { + env.tenants.forEach((tenant) => { + tenant.services = tenant.services.filter( + (service) => + !state.searchFilter || + service.name.toLocaleLowerCase().includes(state.searchFilter.toLocaleLowerCase()) + ); + }); + }); + + // remove empty environments + filteredEnvironments = filteredEnvironments.filter((env) => environmentHasTenants(env)); + + const envItems = filteredEnvironments.map((env) => { return ( diff --git a/src/components/dashboard/ServiceList.tsx b/src/components/dashboard/ServiceList.tsx index 974504b..10f628d 100644 --- a/src/components/dashboard/ServiceList.tsx +++ b/src/components/dashboard/ServiceList.tsx @@ -2,27 +2,19 @@ import React from "react"; import { Service } from "types"; import Grid from "@mui/material/Unstable_Grid2"; import ServiceCard from "./ServiceCard"; -import { useGlobalState } from "GlobalStateProvider"; interface ServiceListProps { services: Service[]; } export default function ServiceList({ services }: ServiceListProps) { - const { state } = useGlobalState(); - - const serviceItems = services - .filter( - (service) => - !state.searchFilter || service.name.toLocaleLowerCase().includes(state.searchFilter.toLocaleLowerCase()) - ) - .map((service) => { - return ( - - - - ); - }); + const serviceItems = services.map((service) => { + return ( + + + + ); + }); return ( diff --git a/src/components/dashboard/TenantList.tsx b/src/components/dashboard/TenantList.tsx index a6e3baf..d55e8b5 100644 --- a/src/components/dashboard/TenantList.tsx +++ b/src/components/dashboard/TenantList.tsx @@ -8,8 +8,14 @@ interface TenantListProps { tenants: Tenant[]; } +export function tenantHasServices(tenant: Tenant): boolean { + return tenant.services.length > 0; +} + export default function TenantList({ tenants }: TenantListProps) { const tenantItems = tenants.map((tenant) => { + if (!tenantHasServices(tenant)) return null; + const tenantName = tenant.name !== "default" ? `Tenant: ${tenant.name}` : "Multitenant"; return (