diff --git a/src/components/backend-ai-resource-broker.ts b/src/components/backend-ai-resource-broker.ts
index 51161a8a5f..c0df0efa26 100644
--- a/src/components/backend-ai-resource-broker.ts
+++ b/src/components/backend-ai-resource-broker.ts
@@ -349,6 +349,10 @@ export default class BackendAiResourceBroker extends BackendAIPage {
*
*/
async _refreshResourcePolicy() {
+ if (!globalThis.backendaiclient) {
+ // To prevent a silent failure when the client is not ready in aggregating resources.
+ return Promise.resolve(false);
+ }
if (Date.now() - this.lastResourcePolicyQueryTime < 2000) {
return Promise.resolve(false);
}
@@ -482,7 +486,7 @@ export default class BackendAiResourceBroker extends BackendAIPage {
* @param {string} from - set the value for debugging purpose.
*/
async _aggregateCurrentResource(from = '') {
- if (this.aggregate_updating) {
+ if (!globalThis.backendaiclient || this.aggregate_updating) {
return Promise.resolve(false);
}
if (Date.now() - this.lastQueryTime < 1000) {
@@ -513,6 +517,15 @@ export default class BackendAiResourceBroker extends BackendAIPage {
const sgs = await globalThis.backendaiclient.scalingGroup.list(
this.current_user_group,
);
+ // TODO: Delete these codes after backend.ai support scaling groups filtering.
+ // ================================ START ====================================
+ if (sgs && sgs.scaling_groups && sgs.scaling_groups.length > 0) {
+ const sftpResourceGroups = await this._sftpScalingGroups();
+ sgs.scaling_groups = sgs.scaling_groups.filter(
+ (item) => !sftpResourceGroups?.includes(item.name),
+ );
+ }
+ // ================================ END ====================================
// Make empty scaling group item if there is no scaling groups.
this.scaling_groups =
sgs.scaling_groups.length > 0 ? sgs.scaling_groups : [{ name: '' }];
diff --git a/src/components/backend-ai-resource-monitor.ts b/src/components/backend-ai-resource-monitor.ts
index 5e29fc3271..ff94230fe1 100644
--- a/src/components/backend-ai-resource-monitor.ts
+++ b/src/components/backend-ai-resource-monitor.ts
@@ -496,12 +496,14 @@ export default class BackendAiResourceMonitor extends BackendAIPage {
) as Switch;
if (document.body.clientWidth > 750 && this.direction == 'horizontal') {
legend.style.display = 'flex';
+ legend.style.marginTop = '0';
Array.from(this.resourceGauge.children).forEach((elem) => {
(elem as HTMLElement).style.display = 'flex';
});
} else {
if (toggleButton.selected) {
legend.style.display = 'flex';
+ legend.style.marginTop = '0';
if (document.body.clientWidth < 750) {
this.resourceGauge.style.left = '20px';
this.resourceGauge.style.right = '20px';
@@ -530,7 +532,16 @@ export default class BackendAiResourceMonitor extends BackendAIPage {
}
return this.resourceBroker
._refreshResourcePolicy()
- .then(() => {
+ .then((resolvedValue) => {
+ if (resolvedValue === false) {
+ setTimeout(() => {
+ // Retry to get the concurrency_max after a while if resource broker
+ // is not ready. When the timeout is 2000, it delays the display of
+ // other resource's allocation status. I don't know why, but I just
+ // set it to 2500.
+ this._refreshResourcePolicy();
+ }, 2500);
+ }
this.concurrency_used = this.resourceBroker.concurrency_used;
// this.userResourceLimit = this.resourceBroker.userResourceLimit;
this.concurrency_max =
diff --git a/src/components/backend-ai-resource-panel.ts b/src/components/backend-ai-resource-panel.ts
index 4684ca2de9..15a0e9db0e 100644
--- a/src/components/backend-ai-resource-panel.ts
+++ b/src/components/backend-ai-resource-panel.ts
@@ -186,7 +186,6 @@ export default class BackendAIResourcePanel extends BackendAIPage {
.resource {
margin-bottom: 10px;
margin-left: 5px;
- height: 46px;
}
.resource-line {
@@ -631,245 +630,277 @@ export default class BackendAIResourcePanel extends BackendAIPage {
>
GPU/NPU
- ${this.cuda_gpu_total
- ? html`
-
-
-
-
-
-
- ${this.cuda_gpu_used !== 0
- ? (
- (this.cuda_gpu_used /
- this.cuda_gpu_total) *
- 100
- ).toFixed(1)
- : 0}%
-
-
-
- `
- : html``}
- ${this.cuda_fgpu_total
- ? html`
-
-
-
-
-
-
- ${this.cuda_fgpu_used !== 0
- ? (
- (this.cuda_fgpu_used /
- this.cuda_fgpu_total) *
- 100
- ).toFixed(1)
- : 0}%
-
-
-
- `
- : html``}
- ${this.rocm_gpu_total
- ? html`
-
-
-
-
-
-
- ${this.rocm_gpu_used.toFixed(1) + '%'}
-
-
-
- `
- : html``}
- ${this.tpu_total
- ? html`
-
-
-
-
-
-
- ${this.tpu_used.toFixed(1) + '%'}
-
-
-
- `
- : html``}
- ${this.ipu_total
- ? html`
-
-
-
-
-
-
- ${this.ipu_used.toFixed(1) + '%'}
-
-
-
- `
- : html``}
- ${this.atom_total
- ? html`
-
-
-
-
-
-
- ${this.atom_used.toFixed(1) + '%'}
-
-
-
- `
- : html``}
- ${this.warboy_total
- ? html`
-
-
-
-
-
-
- ${this.warboy_used.toFixed(1) + '%'}
-
-
-
- `
- : html``}
+
+ ${this.cuda_gpu_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.cuda_gpu_used !== 0
+ ? (
+ (this.cuda_gpu_used /
+ this.cuda_gpu_total) *
+ 100
+ ).toFixed(1)
+ : 0}%
+
+
+
+
+
+
+ `
+ : html``}
+ ${this.cuda_fgpu_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.cuda_fgpu_used !== 0
+ ? (
+ (this.cuda_fgpu_used /
+ this.cuda_fgpu_total) *
+ 100
+ ).toFixed(1)
+ : 0}%
+
+
+
+
+
+
+ `
+ : html``}
+ ${this.rocm_gpu_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.rocm_gpu_used.toFixed(1) + '%'}
+
+
+
+
+
+
+ `
+ : html``}
+ ${this.tpu_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.tpu_used.toFixed(1) + '%'}
+
+
+
+
+ `
+ : html``}
+ ${this.ipu_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.ipu_used.toFixed(1) + '%'}
+
+
+
+
+ `
+ : html``}
+ ${this.atom_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.atom_used.toFixed(1) + '%'}
+
+
+
+
+ `
+ : html``}
+ ${this.warboy_total
+ ? html`
+
+
+
+
+
+
+
+ ${this.warboy_used.toFixed(1) + '%'}
+
+
+
+
+ `
+ : html``}
+