From 4598a70db2bfd7fd68bb8762f90a00405cd6b737 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: Sat, 12 Sep 2026 20:14:24 +0300
Subject: [PATCH] ui: edit/delete buttons for custom files

- each row now shows Edit and Delete buttons (same styling as the
  profiler list buttons) instead of the red X glyph
- Edit reloads the entry into the top form: the Add button becomes
  Save (data-l10n updated too) and a Cancel button appears; submit
  updates the entry in place, recomputing fid/parentFid and excluding
  the edited row from the duplicate-path check
- Delete removes without confirmation; deleting the row being edited
  cancels the edit and an earlier deletion shifts the edit index
- pysimCustomAdd renamed to pysimCustomSubmit; tests for the whole
  flow; SW cache v114 -> v115.
---
 README.md                           |   3 +-
 README_RUS.md                       |   3 +-
 frontend/help-ru.html               |   2 +-
 frontend/help.html                  |   2 +-
 frontend/index.html                 |  55 ++++++++--
 frontend/sw.js                      |   2 +-
 frontend/tests/custom_files.test.js | 165 ++++++++++++++++++++++++++++
 frontend/tests/html.test.js         |   7 ++
 8 files changed, 225 insertions(+), 14 deletions(-)
 create mode 100644 frontend/tests/custom_files.test.js

diff --git a/README.md b/README.md
index 61b6694..be133e0 100644
--- a/README.md
+++ b/README.md
@@ -538,7 +538,8 @@ Files not in pysim's model can be added manually:
 1. Switch to the **Custom files** tab in the Profiler list
 2. Enter the file path (e.g., `3F00/6F46`) and an alias (e.g., `EF.SPN`)
 3. Click **Add** — the file appears in the tree in italics (unverified)
-4. Click the file to verify existence — on success, it behaves like a model file
+4. Use **Edit** on a row to reload it into the form (the button becomes **Save** and a **Cancel** button appears) or **Delete** to remove it
+5. Click the file to verify existence — on success, it behaves like a model file
 
 Custom files persist in `localStorage` across sessions. Export/import as JSON for sharing.
 
diff --git a/README_RUS.md b/README_RUS.md
index c2f2447..7dcf4f0 100644
--- a/README_RUS.md
+++ b/README_RUS.md
@@ -512,7 +512,8 @@ Delivery PoR (SPI2 `01`) проще — карта возвращает PoR на
 1. Перейдите на вкладку **Custom files** в списке профайлера
 2. Введите путь (например, `3F00/6F46`) и псевдоним (например, `EF.SPN`)
 3. Нажмите **Add** — файл появится в дереве курсивом (непроверенный)
-4. Кликните для проверки существования — при успехе работает как обычный файл
+4. Кнопка **Edit** загружает запись в форму (кнопка становится **Save**, появляется **Cancel**), **Delete** удаляет запись без подтверждения
+5. Кликните для проверки существования — при успехе работает как обычный файл
 
 Пользовательские файлы сохраняются в `localStorage`. Экспорт/импорт в JSON для обмена.
 
diff --git a/frontend/help-ru.html b/frontend/help-ru.html
index 09997f9..d2ca5b9 100644
--- a/frontend/help-ru.html
+++ b/frontend/help-ru.html
@@ -405,7 +405,7 @@
 
 
 		<h4 id="custom-files" class="font-medium mb-1">Пользовательские файлы</h4>
-	<p class="text-sm mb-3">Добавление файлов, не покрытых моделью pySim: введите полный путь (например, <code class="font-mono text-sm">3F00/7F20/6F46</code>) и псевдоним (например, <code class="font-mono text-sm">EF.SPN</code>), затем нажмите <strong>Добавить</strong>; добавленные файлы появляются в дереве &laquo;Файловый менеджер&raquo;. Список сохраняется в <code class="font-mono text-sm">localStorage</code>; обмен — <strong>Экспорт в JSON</strong> / <strong>Экспорт в файл</strong> и <strong>Импорт из файла</strong> / <strong>Вставить и импортировать</strong> / <strong>Импорт JSON из буфера</strong>.</p>
+	<p class="text-sm mb-3">Добавление файлов, не покрытых моделью pySim: введите полный путь (например, <code class="font-mono text-sm">3F00/7F20/6F46</code>) и псевдоним (например, <code class="font-mono text-sm">EF.SPN</code>), затем нажмите <strong>Добавить</strong>; добавленные файлы появляются в дереве &laquo;Файловый менеджер&raquo;. В каждой строке есть кнопки <strong>&laquo;Редактировать&raquo;</strong> (загружает запись в форму — кнопка становится <strong>&laquo;Сохранить&raquo;</strong>, появляется <strong>&laquo;Отмена&raquo;</strong>) и <strong>&laquo;Удалить&raquo;</strong> (без подтверждения). Список сохраняется в <code class="font-mono text-sm">localStorage</code>; обмен — <strong>Экспорт в JSON</strong> / <strong>Экспорт в файл</strong> и <strong>Импорт из файла</strong> / <strong>Вставить и импортировать</strong> / <strong>Импорт JSON из буфера</strong>.</p>
 
 <section class="mb-10">
 	<h2 id="proactive-uicc" class="text-xl font-semibold mb-3 border-b border-gray-300 dark:border-slate-700 pb-1">6. Симулятор телефона</h2>
diff --git a/frontend/help.html b/frontend/help.html
index 30cbef0..0b870f7 100644
--- a/frontend/help.html
+++ b/frontend/help.html
@@ -405,7 +405,7 @@
 
 
 		<h4 id="custom-files" class="font-medium mb-1">Custom files</h4>
-	<p class="text-sm mb-3">Add files that pySim&rsquo;s model does not cover: enter the full path (e.g. <code class="font-mono text-sm">3F00/7F20/6F46</code>) and an alias (e.g. <code class="font-mono text-sm">EF.SPN</code>), then press <strong>Add</strong>; added files appear in the File manager tree. The list persists in <code class="font-mono text-sm">localStorage</code> and can be shared with <strong>Export as JSON</strong> / <strong>Export to file</strong> and restored with <strong>Import from file</strong> / <strong>Paste &amp; import</strong> / <strong>Import JSON from clipboard</strong>.</p>
+	<p class="text-sm mb-3">Add files that pySim&rsquo;s model does not cover: enter the full path (e.g. <code class="font-mono text-sm">3F00/7F20/6F46</code>) and an alias (e.g. <code class="font-mono text-sm">EF.SPN</code>), then press <strong>Add</strong>; added files appear in the File manager tree. Each row has <strong>Edit</strong> (reloads the entry into the form — the button becomes <strong>Save</strong> and a <strong>Cancel</strong> button appears) and <strong>Delete</strong> (no confirmation) buttons. The list persists in <code class="font-mono text-sm">localStorage</code> and can be shared with <strong>Export as JSON</strong> / <strong>Export to file</strong> and restored with <strong>Import from file</strong> / <strong>Paste &amp; import</strong> / <strong>Import JSON from clipboard</strong>.</p>
 
 <section class="mb-10">
 	<h2 id="proactive-uicc" class="text-xl font-semibold mb-3 border-b border-gray-300 dark:border-slate-700 pb-1">6. Phone simulator</h2>
diff --git a/frontend/index.html b/frontend/index.html
index 6d74eb9..f2f46e4 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -767,9 +767,10 @@
 			<div id="profiler-list-custom" class="hidden">
 				<div class="mb-2 text-xs font-mono text-gray-600 dark:text-slate-400" data-l10n="Add known file paths and aliases to the file tree.">Add known file paths and aliases to the file tree.</div>
 				<div class="flex gap-2 items-center mb-2">
-					<input id="pysim-cf-path" class="font-mono flex-1 border border-gray-300 dark:border-slate-600 text-sm rounded px-3 py-2.5 dark:bg-slate-800" placeholder="3F00/6F46" onkeydown="if(event.key==='Enter')pysimCustomAdd()">
-					<input id="pysim-cf-name" class="font-mono w-48 border border-gray-300 dark:border-slate-600 text-sm rounded px-3 py-2.5 dark:bg-slate-800" placeholder="EF.SPN" onkeydown="if(event.key==='Enter')pysimCustomAdd()">
-					<button onclick="pysimCustomAdd()" class="px-3 py-2.5 bg-blue-600 text-white text-sm font-medium rounded hover:bg-blue-700 whitespace-nowrap" data-l10n="Add">Add</button>
+					<input id="pysim-cf-path" class="font-mono flex-1 border border-gray-300 dark:border-slate-600 text-sm rounded px-3 py-2.5 dark:bg-slate-800" placeholder="3F00/6F46" onkeydown="if(event.key==='Enter')pysimCustomSubmit()">
+					<input id="pysim-cf-name" class="font-mono w-48 border border-gray-300 dark:border-slate-600 text-sm rounded px-3 py-2.5 dark:bg-slate-800" placeholder="EF.SPN" onkeydown="if(event.key==='Enter')pysimCustomSubmit()">
+					<button id="pysim-cf-add-btn" onclick="pysimCustomSubmit()" class="px-3 py-2.5 bg-blue-600 text-white text-sm font-medium rounded hover:bg-blue-700 whitespace-nowrap" data-l10n="Add">Add</button>
+					<button id="pysim-cf-cancel-btn" onclick="pysimCustomEditCancel()" class="hidden px-3 py-2.5 bg-gray-600 text-white text-sm font-medium rounded hover:bg-gray-700 whitespace-nowrap" data-l10n="Cancel">Cancel</button>
 				</div>
 				<div id="pysim-cf-list" class="text-xs font-mono text-gray-600 dark:text-slate-400"></div>
 			<input type="file" id="pysim-cf-file" accept=".json,application/json" class="hidden" onchange="pysimCustomImportFile(this)">
@@ -7118,7 +7119,9 @@ function pysimCustomSave() {
 	localStorage.setItem('pysim_custom_files', JSON.stringify(pysimCustomFiles));
 }
 
-function pysimCustomAdd() {
+let pysimCustomEditIndex = null;
+
+function pysimCustomSubmit() {
 	const pathEl = document.getElementById('pysim-cf-path');
 	const nameEl = document.getElementById('pysim-cf-name');
 	const path = pathEl.value.trim().toUpperCase();
@@ -7132,15 +7135,46 @@ function pysimCustomAdd() {
 	if (parts.length < 2) { alert('Path must have at least 2 parts, e.g. 3F00/6F46'); return; }
 	const fid = parts[parts.length - 1];
 	const parentFid = parts[parts.length - 2];
-	if (pysimCustomFiles.some(c => c.path.toUpperCase() === path)) { alert('Path already exists'); return; }
-	pysimCustomFiles.push({ path, name, fid, parentFid });
+	if (pysimCustomFiles.some((c, i) => i !== pysimCustomEditIndex && c.path.toUpperCase() === path)) { alert('Path already exists'); return; }
+	if (pysimCustomEditIndex !== null) {
+		pysimCustomFiles[pysimCustomEditIndex] = { path, name, fid, parentFid };
+	} else {
+		pysimCustomFiles.push({ path, name, fid, parentFid });
+	}
 	pysimCustomSave();
 	pysimCustomRender();
-	pathEl.value = '';
-	nameEl.value = '';
+	pysimCustomEditCancel();
+}
+
+function pysimCustomEdit(i) {
+	const c = pysimCustomFiles[i];
+	if (!c) return;
+	pysimCustomEditIndex = i;
+	const pathEl = document.getElementById('pysim-cf-path');
+	document.getElementById('pysim-cf-name').value = c.name;
+	pathEl.value = c.path;
+	const btn = document.getElementById('pysim-cf-add-btn');
+	btn.textContent = t('Save');
+	btn.setAttribute('data-l10n', 'Save');
+	document.getElementById('pysim-cf-cancel-btn').classList.remove('hidden');
+	pathEl.focus();
+}
+
+function pysimCustomEditCancel() {
+	pysimCustomEditIndex = null;
+	document.getElementById('pysim-cf-path').value = '';
+	document.getElementById('pysim-cf-name').value = '';
+	const btn = document.getElementById('pysim-cf-add-btn');
+	btn.textContent = t('Add');
+	btn.setAttribute('data-l10n', 'Add');
+	document.getElementById('pysim-cf-cancel-btn').classList.add('hidden');
 }
 
 function pysimCustomRemove(i) {
+	if (pysimCustomEditIndex !== null) {
+		if (i === pysimCustomEditIndex) pysimCustomEditCancel();
+		else if (i < pysimCustomEditIndex) pysimCustomEditIndex--;
+	}
 	pysimCustomFiles.splice(i, 1);
 	pysimCustomSave();
 	pysimCustomRender();
@@ -7154,7 +7188,10 @@ function pysimCustomRender() {
 		const c = pysimCustomFiles[i];
 		html += '<div class="flex items-center gap-2 py-1 border-b border-gray-200 dark:border-slate-700">';
 		html += '<span class="text-gray-500">' + esc(c.path) + '</span> <span class="text-blue-600 dark:text-blue-400">→</span> <b>' + esc(c.name) + '</b>';
-		html += '<span onclick="pysimCustomRemove(' + i + ')" class="ml-auto cursor-pointer text-red-400 hover:text-red-600">✕</span>';
+		html += '<span class="ml-auto flex gap-2">';
+		html += '<button onclick="pysimCustomEdit(' + i + ')" class="px-2 py-0.5 text-xs rounded bg-blue-600 text-white hover:bg-blue-700">' + esc(t('Edit')) + '</button>';
+		html += '<button onclick="pysimCustomRemove(' + i + ')" class="px-2 py-0.5 text-xs rounded bg-red-600 text-white hover:bg-red-700">' + esc(t('Delete')) + '</button>';
+		html += '</span>';
 		html += '</div>';
 	}
 	el.innerHTML = html;
diff --git a/frontend/sw.js b/frontend/sw.js
index 9f21f4f..a005d2a 100644
--- a/frontend/sw.js
+++ b/frontend/sw.js
@@ -1,4 +1,4 @@
-const CACHE = 'otaman-v114';
+const CACHE = 'otaman-v115';
 const URLS = [
   'index.html',
   'help.html',
diff --git a/frontend/tests/custom_files.test.js b/frontend/tests/custom_files.test.js
new file mode 100644
index 0000000..36c47d9
--- /dev/null
+++ b/frontend/tests/custom_files.test.js
@@ -0,0 +1,165 @@
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('node:fs');
+const path = require('node:path');
+
+const html = fs.readFileSync(path.join(__dirname, '..', 'index.html'), 'utf8');
+
+function extractFunc(src, name) {
+	const re = new RegExp('function\\s+' + name + '\\s*\\([^)]*\\)\\s*\\{');
+	const m = re.exec(src);
+	if (!m) throw new Error('function ' + name + ' not found');
+	let i = m.index + m[0].length - 1;
+	let depth = 0;
+	for (; i < src.length; i++) {
+		if (src[i] === '{') depth++;
+		else if (src[i] === '}') {
+			depth--;
+			if (depth === 0) break;
+		}
+	}
+	return src.slice(m.index, i + 1);
+}
+
+let code = 'var pysimCustomFiles = [];\nvar pysimCustomEditIndex = null;\n';
+for (const fn of ['pysimCustomSave', 'pysimCustomSubmit', 'pysimCustomEdit', 'pysimCustomEditCancel', 'pysimCustomRemove', 'pysimCustomRender']) {
+	code += extractFunc(html, fn) + '\n';
+}
+code += 'globalThis.esc = s => s;\nglobalThis.t = s => s;\n';
+eval(code);
+
+function fakeEl(id) {
+	const classes = new Set();
+	return {
+		id,
+		value: '',
+		innerHTML: '',
+		textContent: '',
+		attrs: {},
+		focused: 0,
+		classList: {
+			add: (...cs) => cs.forEach(c => classes.add(c)),
+			remove: (...cs) => cs.forEach(c => classes.delete(c)),
+			contains: c => classes.has(c),
+		},
+		setAttribute(k, v) { this.attrs[k] = v; },
+		focus() { this.focused++; },
+	};
+}
+
+function setup(entries) {
+	const els = {
+		'pysim-cf-path': fakeEl('pysim-cf-path'),
+		'pysim-cf-name': fakeEl('pysim-cf-name'),
+		'pysim-cf-list': fakeEl('pysim-cf-list'),
+		'pysim-cf-add-btn': fakeEl('pysim-cf-add-btn'),
+		'pysim-cf-cancel-btn': fakeEl('pysim-cf-cancel-btn'),
+	};
+	els['pysim-cf-cancel-btn'].classList.add('hidden');
+	const store = {};
+	globalThis.localStorage = {
+		getItem: k => (k in store ? store[k] : null),
+		setItem: (k, v) => { store[k] = String(v); },
+	};
+	globalThis.document = { getElementById: id => els[id] || null };
+	globalThis.alertCalls = [];
+	globalThis.alert = m => { globalThis.alertCalls.push(m); };
+	pysimCustomFiles = (entries || []).map(e => Object.assign({}, e));
+	pysimCustomEditIndex = null;
+	return els;
+}
+
+const entry = (fid, name, parentFid) => ({ path: (parentFid || '3F00') + '/' + fid, name, fid, parentFid: parentFid || '3F00' });
+
+test('rows render Edit and Delete buttons instead of the X glyph', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomRender();
+	const out = els['pysim-cf-list'].innerHTML;
+	assert.match(out, /pysimCustomEdit\(0\)/);
+	assert.match(out, /pysimCustomRemove\(0\)/);
+	assert.match(out, />Edit</);
+	assert.match(out, />Delete</);
+	assert.ok(!out.includes('✕'), 'old X glyph must be gone');
+});
+
+test('edit fills the top form and switches it to Save mode', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomEdit(0);
+	assert.strictEqual(pysimCustomEditIndex, 0);
+	assert.strictEqual(els['pysim-cf-path'].value, '3F00/6F46');
+	assert.strictEqual(els['pysim-cf-name'].value, 'EF.SPN');
+	assert.strictEqual(els['pysim-cf-add-btn'].textContent, 'Save');
+	assert.strictEqual(els['pysim-cf-add-btn'].attrs['data-l10n'], 'Save');
+	assert.ok(!els['pysim-cf-cancel-btn'].classList.contains('hidden'));
+	assert.strictEqual(els['pysim-cf-path'].focused, 1);
+});
+
+test('submit in edit mode updates the entry in place', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomEdit(0);
+	els['pysim-cf-path'].value = '3F00/7F20/6F46';
+	els['pysim-cf-name'].value = 'EF.SPNX';
+	pysimCustomSubmit();
+	assert.strictEqual(pysimCustomFiles.length, 1);
+	assert.deepStrictEqual(pysimCustomFiles[0], { path: '3F00/7F20/6F46', name: 'EF.SPNX', fid: '6F46', parentFid: '7F20' });
+	assert.strictEqual(pysimCustomEditIndex, null);
+	assert.strictEqual(els['pysim-cf-add-btn'].textContent, 'Add');
+	assert.ok(els['pysim-cf-cancel-btn'].classList.contains('hidden'));
+});
+
+test('saving an edited entry with its own path is not a duplicate', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomEdit(0);
+	pysimCustomSubmit();
+	assert.strictEqual(pysimCustomFiles.length, 1);
+	assert.deepStrictEqual(globalThis.alertCalls, []);
+});
+
+test('editing to another entry path is rejected as duplicate', () => {
+	const els = setup([entry('6F46', 'EF.SPN'), entry('6F44', 'EF.SPN2')]);
+	pysimCustomEdit(0);
+	els['pysim-cf-path'].value = '3F00/6F44';
+	pysimCustomSubmit();
+	assert.deepStrictEqual(globalThis.alertCalls, ['Path already exists']);
+	assert.deepStrictEqual(pysimCustomFiles.map(c => c.path), ['3F00/6F46', '3F00/6F44']);
+	assert.strictEqual(pysimCustomEditIndex, 0);
+});
+
+test('cancel restores the Add mode and clears the inputs', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomEdit(0);
+	pysimCustomEditCancel();
+	assert.strictEqual(pysimCustomEditIndex, null);
+	assert.strictEqual(els['pysim-cf-path'].value, '');
+	assert.strictEqual(els['pysim-cf-name'].value, '');
+	assert.strictEqual(els['pysim-cf-add-btn'].textContent, 'Add');
+	assert.strictEqual(els['pysim-cf-add-btn'].attrs['data-l10n'], 'Add');
+	assert.ok(els['pysim-cf-cancel-btn'].classList.contains('hidden'));
+});
+
+test('deleting the entry being edited cancels the edit', () => {
+	const els = setup([entry('6F46', 'EF.SPN')]);
+	pysimCustomEdit(0);
+	pysimCustomRemove(0);
+	assert.deepStrictEqual(pysimCustomFiles, []);
+	assert.strictEqual(pysimCustomEditIndex, null);
+	assert.strictEqual(els['pysim-cf-add-btn'].textContent, 'Add');
+});
+
+test('deleting before the edited row shifts the edit index', () => {
+	setup([entry('6F46', 'EF.SPN'), entry('6F44', 'EF.SPN2'), entry('6F42', 'EF.SPN3')]);
+	pysimCustomEdit(2);
+	pysimCustomRemove(0);
+	assert.strictEqual(pysimCustomEditIndex, 1);
+	assert.strictEqual(pysimCustomFiles[1].name, 'EF.SPN3');
+});
+
+test('submit adds a new entry when not editing', () => {
+	const els = setup([]);
+	els['pysim-cf-path'].value = '3f00/6f46';
+	els['pysim-cf-name'].value = 'EF.SPN';
+	pysimCustomSubmit();
+	assert.deepStrictEqual(pysimCustomFiles, [{ path: '3F00/6F46', name: 'EF.SPN', fid: '6F46', parentFid: '3F00' }]);
+	assert.strictEqual(els['pysim-cf-path'].value, '');
+	assert.strictEqual(els['pysim-cf-name'].value, '');
+});
diff --git a/frontend/tests/html.test.js b/frontend/tests/html.test.js
index c6f18e7..b640a21 100644
--- a/frontend/tests/html.test.js
+++ b/frontend/tests/html.test.js
@@ -54,3 +54,10 @@ test('file manager has FID / Name sort pills', () => {
     assert.match(html, /data-fs-sort="name" onclick="pysimFsSetSort\('name'\)"/);
     assert.ok(html.includes('pysim-fs-sort-pill'));
 });
+
+test('custom files form has add/save and cancel controls', () => {
+    assert.match(html, /id="pysim-cf-add-btn"[^>]*data-l10n="Add"/);
+    assert.match(html, /id="pysim-cf-cancel-btn"[^>]*class="hidden[^"]*"[^>]*data-l10n="Cancel"/);
+    assert.ok(html.includes("event.key==='Enter')pysimCustomSubmit()"));
+    assert.ok(!html.includes('pysimCustomAdd'));
+});