feat: add intel icon

lablup · Aug 19, 2024 · 3291342 · 3291342
1 parent adc48a4
commit 3291342
Show file tree

Hide file tree

Showing 7 changed files with 55 additions and 23 deletions.
diff --git a/.cspell.json b/.cspell.json
@@ -7,6 +7,7 @@
     "backendaioptions",
     "cssinjs",
     "cuda",
+    "FGPU",
     "Frgmt",
     "Gaudi",
     "keypair",
@@ -16,6 +17,7 @@
     "preopen",
     "shmem",
     "vfolders",
+    "Warboy",
     "webcomponent",
     "webui",
     "wsproxy"

diff --git a/react/src/components/ResourceNumber.tsx b/react/src/components/ResourceNumber.tsx
@@ -131,7 +131,7 @@ export const ResourceTypeIcon: React.FC<AccTypeIconProps> = ({
     'ipu.device': [<MWCIconWrap size={size}>view_module</MWCIconWrap>, 'IPU'],
     'atom.device': ['/resources/icons/rebel.svg', 'ATOM'],
     'atom-plus.device': ['/resources/icons/rebel.svg', 'ATOM+'],
-    'gaudi2.device': ['/resources/icons/npu_generic.svg', 'Gaudi 2'],
+    'gaudi2.device': ['/resources/icons/gaudi.svg', 'Gaudi 2'],
     'warboy.device': ['/resources/icons/furiosa.svg', 'Warboy'],
     'hyperaccel-lpu.device': [
       '/resources/icons/npu_generic.svg',

diff --git a/resources/device_metadata.json b/resources/device_metadata.json
@@ -108,7 +108,7 @@
         "binary": false,
         "round_length": 0
       },
-      "display_icon": "rebel"
+      "display_icon": "gaudi"
     },
     "warboy.device": {
       "slot_name": "warboy.device",

diff --git a/resources/icons/gaudi.svg b/resources/icons/gaudi.svg
diff --git a/src/components/backend-ai-agent-summary-list.ts b/src/components/backend-ai-agent-summary-list.ts
@@ -108,8 +108,11 @@ export default class BackendAIAgentSummaryList extends BackendAIPage {
         }
 
         img.indicator-icon {
-          width: 16px !important;
-          height: 16px !important;
+          max-width: 16px !important;
+          max-height: 16px !important;
+          width: auto;
+          height: auto;
+          align-self: center;
         }
 
         lablup-progress-bar {
@@ -755,7 +758,7 @@ export default class BackendAIAgentSummaryList extends BackendAIPage {
                   <div class="layout horizontal start resource-indicator">
                     <img
                       class="indicator-icon fg green"
-                      src="/resources/icons/npu_generic.svg"
+                      src="/resources/icons/gaudi.svg"
                     />
                     <span class="monospace" style="padding-left:5px;">
                       ${rowData.item.used_gaudi2_slots}/${rowData.item

diff --git a/src/components/backend-ai-environment-list.ts b/src/components/backend-ai-environment-list.ts
@@ -912,42 +912,42 @@ export default class BackendAIEnvironmentList extends BackendAIPage {
               </div>
             `
           : html``}
-        ${rowData.item.atom_plus_device_limit_min
+        ${rowData.item.gaudi2_device_limit_min
           ? html`
               <div class="layout horizontal center flex">
                 <div class="layout horizontal configuration">
                   <img
                     class="indicator-icon fg green"
-                    src="/resources/icons/rebel.svg"
+                    src="/resources/icons/gaudi.svg"
                   />
-                  <span>${rowData.item.atom_plus_device_limit_min}</span>
+                  <span>${rowData.item.gaudi2_device_limit_min}</span>
                   ~
                   <span>
                     ${this._markIfUnlimited(
-                      rowData.item.atom_plus_device_limit_max,
+                      rowData.item.gaudi2_device_limit_max,
                     )}
                   </span>
-                  <span class="indicator">ATOM+</span>
+                  <span class="indicator">Gaudi 2</span>
                 </div>
               </div>
             `
           : html``}
-        ${rowData.item.gaudi2_device_limit_min
+        ${rowData.item.atom_plus_device_limit_min
           ? html`
               <div class="layout horizontal center flex">
                 <div class="layout horizontal configuration">
                   <img
                     class="indicator-icon fg green"
                     src="/resources/icons/rebel.svg"
                   />
-                  <span>${rowData.item.gaudi2_device_limit_min}</span>
+                  <span>${rowData.item.atom_plus_device_limit_min}</span>
                   ~
                   <span>
                     ${this._markIfUnlimited(
-                      rowData.item.gaudi2_device_limit_max,
+                      rowData.item.atom_plus_device_limit_max,
                     )}
                   </span>
-                  <span class="indicator">Gaudi 2</span>
+                  <span class="indicator">ATOM+</span>
                 </div>
               </div>
             `

diff --git a/src/components/backend-ai-session-list.ts b/src/components/backend-ai-session-list.ts
@@ -305,8 +305,11 @@ export default class BackendAISessionList extends BackendAIPage {
         }
 
         img.indicator-icon {
-          width: 16px;
-          height: 16px;
+          max-width: 16px !important;
+          max-height: 16px !important;
+          width: auto;
+          height: auto;
+          align-self: center;
           padding-right: 5px;
         }
 
@@ -3515,24 +3518,24 @@ ${rowData.item[this.sessionNameField]}</pre
                     <span class="indicator">ATOM</span>
                   `
                 : html``}
-              ${rowData.item.atom_plus_slot
+              ${rowData.item.gaudi2_slot
                 ? html`
                     <img
                       class="indicator-icon fg green"
-                      src="/resources/icons/rebel.svg"
+                      src="/resources/icons/gaudi.svg"
                     />
-                    <span>${rowData.item.atom_plus_slot}</span>
-                    <span class="indicator">ATOM+</span>
+                    <span>${rowData.item.gaudi2_slot}</span>
+                    <span class="indicator">Gaudi 2</span>
                   `
                 : html``}
-              ${rowData.item.gaudi2_slot
+              ${rowData.item.atom_plus_slot
                 ? html`
                     <img
                       class="indicator-icon fg green"
                       src="/resources/icons/rebel.svg"
                     />
-                    <span>${rowData.item.gaudi2_slot}</span>
-                    <span class="indicator">Gaudi 2</span>
+                    <span>${rowData.item.atom_plus_slot}</span>
+                    <span class="indicator">ATOM+</span>
                   `
                 : html``}
               ${rowData.item.warboy_slot