ui/services: simplify and sort
This commit is contained in:
@@ -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 (
|
||||||
|
|||||||
@@ -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 (
|
||||||
|
|||||||
Reference in New Issue
Block a user