improved relay history change log

This commit is contained in:
=
2023-03-09 14:00:02 +00:00
parent c7ab043dcc
commit 28b5590d1d
3 changed files with 32 additions and 13 deletions

View File

@@ -179,7 +179,7 @@ describe('generateRelaysChanges', () => {
], ],
} as Kind10002Event, } as Kind10002Event,
]); ]);
expect(r[0].changes).toEqual(['<div class="added">added <mark>wss://brando-relay1.com write only</mark></div>']); expect(r[0].changes).toEqual(['<div>added <mark>wss://brando-relay1.com</mark> as <mark class="added">write</mark> only</div>']);
}); });
test('when a relay is removed, the removal is listed in the changes array', () => { test('when a relay is removed, the removal is listed in the changes array', () => {
const r = generateRelayChanges([ const r = generateRelayChanges([
@@ -199,9 +199,9 @@ describe('generateRelaysChanges', () => {
], ],
} as Kind10002Event, } as Kind10002Event,
]); ]);
expect(r[0].changes).toEqual(['<div class="removed">removed <mark>wss://brando-relay1.com write only</mark></div>']); expect(r[0].changes).toEqual(['<div>removed <mark>wss://brando-relay1.com</mark> which was <mark class="removed">write</mark> only</div>']);
}); });
test('when a relay is modified, the removal is listed in the changes array', () => { test('when a relay is modified, the modification is listed in the changes array', () => {
const r = generateRelayChanges([ const r = generateRelayChanges([
{ {
...SampleEvents.kind10002, ...SampleEvents.kind10002,
@@ -218,7 +218,7 @@ describe('generateRelaysChanges', () => {
], ],
} as Kind10002Event, } as Kind10002Event,
]); ]);
expect(r[0].changes).toEqual(['<div class="modified">modified <mark>wss://brando-relay.com read only</mark></div>']); expect(r[0].changes).toEqual(['<div class="modified">modified <mark>wss://brando-relay.com</mark> to <mark class="added">read</mark> instead of <mark class="removed">write</mark></div>']);
}); });
test('when a contact is added and another removed, both events are listed in the changes array', () => { test('when a contact is added and another removed, both events are listed in the changes array', () => {
const r = generateRelayChanges([ const r = generateRelayChanges([
@@ -238,8 +238,8 @@ describe('generateRelaysChanges', () => {
} as Kind10002Event, } as Kind10002Event,
]); ]);
expect(r[0].changes).toEqual([ expect(r[0].changes).toEqual([
'<div class="added">added <mark>wss://brando-relay1.com write only</mark></div>', '<div>added <mark>wss://brando-relay1.com</mark> as <mark class="added">write</mark> only</div>',
'<div class="removed">removed <mark>wss://alicerelay.example.com</mark></div>', '<div>removed <mark>wss://alicerelay.example.com</mark> which was <mark class="removed">read</mark> and <mark class="removed">write</mark></div>',
]); ]);
}); });
}); });

View File

@@ -123,11 +123,20 @@ export const generateRelayChanges = (
if (i === a.length - 1) e.tags.forEach((r) => changes.push(summariseRelay(r))); if (i === a.length - 1) e.tags.forEach((r) => changes.push(summariseRelay(r)));
else { else {
const next = a[i + 1].tags; const next = a[i + 1].tags;
const relayReadAndWrite = (r:Kind10002Tag, addedorremoveed: 'added' | 'removed'): string => {
const wonly = `<mark class="${addedorremoveed}">write</mark>`;
const ronly = `<mark class="${addedorremoveed}">read</mark>`;
const randw = `${ronly} and ${wonly}`;
if (!r[2]) return randw;
if (r[2] === 'write') return `${wonly} only`;
return `${ronly} only`;
};
// list adds // list adds
const added = current.filter((c) => !next.some((n) => n[1] === c[1])); const added = current.filter((c) => !next.some((n) => n[1] === c[1]));
if (added.length > 0) { if (added.length > 0) {
added.forEach((r) => changes.push( added.forEach((r) => changes.push(
`<div class="added">added <mark>${summariseRelay(r)}</mark></div>`, `<div>added <mark>${r[1]}</mark> as ${relayReadAndWrite(r, 'added')}</div>`,
)); ));
} }
// list modified // list modified
@@ -135,15 +144,25 @@ export const generateRelayChanges = (
(c) => next.filter((n) => n[1] === c[1]).some((n) => c[2] !== n[2]), (c) => next.filter((n) => n[1] === c[1]).some((n) => c[2] !== n[2]),
); );
if (modified.length > 0) { if (modified.length > 0) {
modified.forEach((r) => changes.push( modified.forEach((r) => {
`<div class="modified">modified <mark>${summariseRelay(r)}</mark></div>`, const nv = next.find((n) => n[1] === r[1]);
)); let s: string;
if (!r[2]) {
if (!!nv && nv[2] === 'read') s = '<mark class="added">write</mark> as well as read';
else s = '<mark class="added">read</mark> as well as write';
} else if (r[2] === 'read') {
if (!nv) s = 'only read and no longer <mark class="removed">write</mark>';
else s = '<mark class="added">read</mark> instead of <mark class="removed">write</mark>';
} else if (!nv) s = 'only write and no longer <mark class="removed">read</mark>';
else s = '<mark class="added">write</mark> instead of <mark class="removed">read</mark>';
changes.push(`<div class="modified">modified <mark>${r[1]}</mark> to ${s}</div>`);
});
} }
// list deletes // list deletes
const removed = next.filter((c) => !current.some((n) => n[1] === c[1])); const removed = next.filter((c) => !current.some((n) => n[1] === c[1]));
if (removed.length > 0) { if (removed.length > 0) {
removed.forEach((r) => changes.push( removed.forEach((r) => changes.push(
`<div class="removed">removed <mark>${summariseRelay(r)}</mark></div>`, `<div>removed <mark>${r[1]}</mark> which was ${relayReadAndWrite(r, 'removed')}</div>`,
)); ));
} }
} }

View File

@@ -51,10 +51,10 @@ img[src=""] {
max-width:150px; max-width:150px;
} }
} }
.added mark { .added mark, mark.added {
background-color:rgb(29, 255, 116) background-color:rgb(29, 255, 116)
} }
.removed mark { .removed mark, mark.removed {
background-color:rgb(255, 125, 125) background-color:rgb(255, 125, 125)
} }