ui/services: simplify and sort

This commit is contained in:
Johannes Kirschbauer
2025-09-03 21:15:06 +02:00
parent 88343ce523
commit 67dcd45dd5
2 changed files with 13 additions and 11 deletions

View File

@@ -151,10 +151,12 @@ export const ServiceRoute = (props: {
color="primary" color="primary"
inverted inverted
> >
{props.id} {props.label}
</Typography> </Typography>
<Icon icon="Code" size="0.75rem" inverted color="tertiary" />
</div> </div>
<div class="flex w-full flex-row items-center gap-1"> {/* Same subtitle as Machine */}
{/* <div class="flex w-full flex-row items-center gap-1">
<Icon icon="Code" size="0.75rem" inverted color="tertiary" /> <Icon icon="Code" size="0.75rem" inverted color="tertiary" />
<Typography <Typography
hierarchy="label" hierarchy="label"
@@ -165,7 +167,7 @@ export const ServiceRoute = (props: {
> >
{props.instance.resolved.usage_ref.name} {props.instance.resolved.usage_ref.name}
</Typography> </Typography>
</div> </div> */}
</div> </div>
</A> </A>
); );
@@ -181,8 +183,8 @@ const Services = () => {
return []; return [];
} }
return Object.entries(ctx.serviceInstancesQuery.data).map( return Object.entries(ctx.serviceInstancesQuery.data)
([id, instance]) => { .map(([id, instance]) => {
const moduleName = instance.module.name; const moduleName = instance.module.name;
const label = moduleName == id ? moduleName : `${moduleName} (${id})`; const label = moduleName == id ? moduleName : `${moduleName} (${id})`;
@@ -191,8 +193,8 @@ const Services = () => {
label, label,
instance: instance, instance: instance,
}; };
}, })
); .sort((a, b) => a.label.localeCompare(b.label));
}; };
return ( return (

View File

@@ -18,8 +18,8 @@ export const SectionServices = () => {
return []; return [];
} }
return (ctx.machinesQuery.data[machineName].instance_refs ?? []).map( return (ctx.machinesQuery.data[machineName].instance_refs ?? [])
(id) => { .map((id) => {
const instance = ctx.serviceInstancesQuery.data?.[id]; const instance = ctx.serviceInstancesQuery.data?.[id];
if (!instance) { if (!instance) {
throw new Error(`Service instance ${id} not found`); throw new Error(`Service instance ${id} not found`);
@@ -31,8 +31,8 @@ export const SectionServices = () => {
instance, instance,
label: module.name == id ? module.name : `${module.name} (${id})`, label: module.name == id ? module.name : `${module.name} (${id})`,
}; };
}, })
); .sort((a, b) => a.label.localeCompare(b.label));
}; };
return ( return (