feat: improve display of long names in table cells

Author: amerkurev

app/contrib/tests/test_types.py

@@ -115,6 +115,7 @@ def test_docker_container():
     assert x.id == '123456789abcdef'
     assert x.names == ['/container_name']
     assert x.image == 'nginx:latest'
+    assert x.short_image == x.image
     assert x.image_id == 'sha256:abcdef123456'
     assert x.created == datetime(2023, 1, 1, 12, 0, tzinfo=timezone.utc)
     assert x.size_rw == 50000
@@ -135,6 +136,9 @@ def test_docker_container():
     })
     assert x.clean_names == []
 
+    x.image = 'sha256:f31294ac0a9255aa810e2cd9639485260ff9b3c19ef3263a56a091fad37e23b5'
+    assert x.short_image == 'f31294ac0a92'
+
 
 def test_docker_container_list():
     containers = [
@@ -170,6 +174,7 @@ def test_docker_volume():
     })
 
     assert x.name == 'volume1'
+    assert x.short_name == x.name
     assert x.driver == 'local'
     assert x.created_at == datetime(2023, 1, 1, 12, 0, tzinfo=timezone.utc)
     assert x.mountpoint == '/var/lib/docker/volumes/volume1'
@@ -178,6 +183,9 @@ def test_docker_volume():
     assert x.ref_count == 2
     assert x.containers == []
 
+    x.name = '26fb9bbf928c9a4dae3198438fb02f7b286894069dadf2827f8d3f98bbb2aa64'
+    assert x.short_name == x.name[:39] + '...'
+
 
 def test_docker_volume_list():
     volumes = [

app/contrib/types.py

@@ -6,6 +6,12 @@
 from scan.utils import pretty_size
 
 
+def truncate(name: str, limit: int) -> str:
+    if len(name) <= limit:
+        return name
+    return name[:limit] + '...'
+
+
 class DockerVersion(BaseModel):
     platform_name: str = Field(alias=('Platform', 'Name'), default='')
     version: str = Field(alias='Version')
@@ -65,6 +71,12 @@ class DockerContainer(BaseModel):
     def short_id(self) -> str:
         return self.id[:12]
 
+    @property
+    def short_image(self) -> str:
+        if self.image.startswith('sha256:'):
+            return self.image[7:19]
+        return self.image
+
     @property
     def clean_names(self) -> list[str]:
         if not self.names:
@@ -95,6 +107,10 @@ class DockerVolume(BaseModel):
     usage_data: dict | None = Field(alias='UsageData', default_factory=dict)
     containers: list[str] | None = Field(default_factory=list)
 
+    @property
+    def short_name(self) -> str:
+        return truncate(self.name, 39)
+
     @property
     def size(self) -> int:
         if 'Size' not in self.usage_data:
@@ -135,11 +151,7 @@ def last_used_delta(self) -> str:
 
     @property
     def short_desc(self) -> str:
-        limit = 180
-        s = self.description[:limit]
-        if len(self.description) > limit:
-            s += '...'
-        return s
+        return truncate(self.description, 180)
 
 
 class DockerBuildCacheList(RootModel):
@@ -223,11 +235,7 @@ class DockerOverlay2Layer(BaseModel):
 
     @property
     def short_id(self) -> str:
-        limit = 22
-        s = self.id[:limit]
-        if len(self.id) > limit:
-            s += '...'
-        return s
+        return truncate(self.id, 22)
 
     @property
     def created_delta(self) -> str:

app/templates/pages/build_cache.html

@@ -19,9 +19,13 @@
           {% for item in items %}
             <tr>
               <td>
-                <span uk-tooltip="title: {{ item.description }}; pos: top">
+                {% if item.short_desc == item.description %}
                   {{ item.short_desc }}
-                </span>
+                {% else %}
+                  <span uk-tooltip="title: {{ item.description }}; pos: top">
+                    {{ item.short_desc }}
+                  </span>
+                {% endif %}
               </td>
               <td class="width-1">{{ item.size }}</td>
               <td class="uk-text-nowrap uk-text-center">{{ item.usage_count }}</td>

app/templates/pages/containers.html

@@ -30,7 +30,7 @@
               <td class="uk-text-nowrap">
                 {{ item.clean_names|join('<br>')|safe }}
               </td>
-              <td class="uk-text-nowrap">{{ item.image }}</td>
+              <td class="uk-text-nowrap">{{ item.short_image }}</td>
               <td class="width-1">{{ item.size_rw }}</td>
               <td class="width-1">{{ item.size_root_fs }}</td>
               <td class="uk-text-nowrap uk-text-center">{{ item.state }}</td>

app/templates/pages/volumes.html

@@ -16,7 +16,7 @@
         <tbody class="uk-text-secondary">
           {% for item in items %}
             <tr>
-                <td class="uk-text-nowrap">{{ item.name }}</td>
+                <td class="uk-text-nowrap">{{ item.short_name }}</td>
                 <td class="width-1">{{ item.size }}</td>
                 <td>
                   <ul class="uk-text-nowrap uk-padding-small uk-padding-remove-vertical">
@@ -26,7 +26,7 @@
                   </ul>
                 </td>
                 <td class="uk-text-nowrap uk-text-center uk-text-muted">{{ item.driver }}</td>
-                <td class="uk-text-muted">{{ item.mountpoint }}</td>
+                <td class="uk-text-muted uk-text-break">{{ item.mountpoint }}</td>
             </tr>
           {% endfor %}
         </tbody>