From bfb455b3c8ec60a262ac5e71f0b467213711ee84 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BD=D1=82=D0=BE=D0=BD=20=D0=A2=D1=80=D0=BE=D1=88?=
 =?UTF-8?q?=D0=B8=D0=BD?= <i@atroshin.ru>
Date: Sun, 20 Sep 2026 23:56:40 +0300
Subject: [PATCH] ui: content-sized label column in decoded field tables
 (v2.7.14)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The decoded view used a fixed 10rem right-aligned label column, so short
labels pushed the values ~168px to the right — for transparent files the
block looked like indented record data.  efRenderFieldsHtml now uses a
grid with grid-template-columns: max-content 1fr: labels stay right
aligned and values stay aligned, but the column is only as wide as the
widest label of the block.  Applies to the file manager decoded view and
the snapshot Decoded block (transparent and per-record fields alike).

- tests: efRenderFieldsHtml markup (grid, no w-40) and decoded view.
---
 frontend/index.html              | 12 +++++++-----
 frontend/sw.js                   |  2 +-
 frontend/tests/ef_decode.test.js | 13 +++++++++++++
 pyproject.toml                   |  2 +-
 pysim_simple_server/server.py    |  2 +-
 5 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 4d7cb67..9297c44 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1413,7 +1413,7 @@
 // ===== Version =====
 // Single source of truth for the PWA version: shown in the header and used
 // by the server version check in pysimConnect().
-const SIMPLE_VERSION = '2.7.13';
+const SIMPLE_VERSION = '2.7.14';
 document.getElementById('app-version').textContent = 'v' + SIMPLE_VERSION;
 
 // ===== Tab switching =====
@@ -12634,13 +12634,15 @@ function efDataSummary(data) {
 	return '';
 }
 
+// Decoded field rows: the label column is sized to its content (grid
+// max-content) instead of a fixed width, so values start right after the
+// widest label and short labels do not push the data far to the right.
 function efRenderFieldsHtml(rows) {
 	if (!rows.length) return '<span class="text-gray-400">' + esc(t('No decodable fields')) + '</span>';
-	let html = '<div class="text-xs">';
+	let html = '<div class="text-xs" style="display:grid;grid-template-columns:max-content 1fr;column-gap:0.5rem;row-gap:0.125rem">';
 	for (const [k, v] of rows) {
-		html += '<div class="flex gap-2 mb-0.5">' +
-			'<span class="w-40 shrink-0 text-right text-gray-500 dark:text-slate-400 break-all">' + esc(k) + '</span>' +
-			'<span class="font-mono break-all">' + esc(v) + '</span></div>';
+		html += '<span class="text-right text-gray-500 dark:text-slate-400 break-all">' + esc(k) + '</span>' +
+			'<span class="font-mono break-all">' + esc(v) + '</span>';
 	}
 	return html + '</div>';
 }
diff --git a/frontend/sw.js b/frontend/sw.js
index 6b95b70..6ed5715 100644
--- a/frontend/sw.js
+++ b/frontend/sw.js
@@ -1,4 +1,4 @@
-const CACHE = 'simple-v216';
+const CACHE = 'simple-v217';
 const URLS = [
   'index.html',
   'help.html',
diff --git a/frontend/tests/ef_decode.test.js b/frontend/tests/ef_decode.test.js
index 2fa49d0..01e32ab 100644
--- a/frontend/tests/ef_decode.test.js
+++ b/frontend/tests/ef_decode.test.js
@@ -214,12 +214,25 @@ test('file manager decoded view renders fields, not JSON', () => {
 	assert.match(out, /228062800000208/);
 	assert.match(out, /pySim JSON \(server\)/);
 	assert.doesNotMatch(out, /\{"imsi"/);
+	// the label column is content-sized, not a fixed 10rem block
+	assert.match(out, /grid-template-columns:max-content 1fr/);
+	assert.doesNotMatch(out, /w-40/);
 	// no decoder -> raw fallback with a note
 	const raw = pysimFsDecodedHtml({ name: 'EF.NOPE', fid: 'abcd' }, { success: true, data: '0011' });
 	assert.match(raw, /No decoder for this file/);
 	assert.match(raw, /0011/);
 });
 
+test('efRenderFieldsHtml sizes the label column to its content', () => {
+	const out = efRenderFieldsHtml([['ICCID', '8988'], ['Very long label', 'x']]);
+	assert.match(out, /style="display:grid;grid-template-columns:max-content 1fr/);
+	assert.doesNotMatch(out, /w-40/);
+	assert.ok(out.includes('>ICCID</span>'));
+	assert.ok(out.includes('>8988</span>'));
+	assert.ok(out.includes('>Very long label</span>'));
+	assert.match(efRenderFieldsHtml([]), /No decodable fields/);
+});
+
 test('profilerRenderReport shows decoded field diffs and the raw-only note', () => {
 	const res = {
 		path: 'ADF.USIM/6F07', name: 'EF.IMSI', status: 'fail',
diff --git a/pyproject.toml b/pyproject.toml
index 470dcd6..09249ea 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "pysim-simple-server"
-version = "2.7.13"
+version = "2.7.14"
 description = "HTTP REST server wrapping pysim for the SIMple PWA"
 requires-python = ">=3.8"
 # pysim is a git-only dependency installed explicitly by setup.bat/setup.sh.
diff --git a/pysim_simple_server/server.py b/pysim_simple_server/server.py
index 0565336..ccd1f60 100644
--- a/pysim_simple_server/server.py
+++ b/pysim_simple_server/server.py
@@ -26,7 +26,7 @@ from osmocom.tlv import BER_TLV_IE
 from osmocom.utils import rpad
 
 
-VERSION = '2.7.13'
+VERSION = '2.7.14'
 
 MAX_ENVELOPE_SEGMENTS = 5  # max SMS segments for outgoing C-APDU in ENVELOPE