, key: string) {
upsertPerson({ ...person, [key]: e.target.value });
@@ -87,7 +91,7 @@ function PersonRow({ person }: PersonRowProps) {
/>
{name}
- {person.name && ({person.id})}
+ {person.name && ({nickName})}
@@ -126,7 +130,7 @@ function PersonRow({ person }: PersonRowProps) {
/>
{person.address}
|
-
+ |
{
test('without depth', () => {
const nodes = treesToPersonNode(trees);
expect(nodes).toEqual([
- { key: 'satyr', name: 'satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
- { key: 'surtr', name: 'surtr', s: 'F', attributes: ['S'], spouses: [] },
- { key: 'hound', name: 'hound', s: 'M', attributes: [], spouses: ['alpha'], father: 'satyr', mother: 'surtr' },
- { key: 'alpha', name: 'alpha', s: 'F', attributes: [], spouses: [] },
- { key: 'ryora', name: 'ryora', s: 'M', attributes: [], spouses: [], father: 'hound', mother: 'alpha' },
- { key: 'nala', name: 'nala', s: 'F', attributes: [], spouses: [] },
- { key: 'mufasa', name: 'mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
+ { key: 'satyr', name: 'Satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
+ { key: 'surtr', name: 'Surtr', s: 'F', attributes: ['S'], spouses: [] },
+ { key: 'hound', name: 'Hound', s: 'M', attributes: [], spouses: ['alpha'], father: 'satyr', mother: 'surtr' },
+ { key: 'alpha', name: 'Alpha', s: 'F', attributes: [], spouses: [] },
+ { key: 'ryora', name: 'Ryora', s: 'M', attributes: [], spouses: [], father: 'hound', mother: 'alpha' },
+ { key: 'nala', name: 'Nala', s: 'F', attributes: [], spouses: [] },
+ { key: 'mufasa', name: 'Mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
]);
});
test('with depth 2', () => {
const nodes = treesToPersonNode(trees, 2);
expect(nodes).toEqual([
- { key: 'satyr', name: 'satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
- { key: 'surtr', name: 'surtr', s: 'F', attributes: ['S'], spouses: [] },
- { key: 'hound', name: 'hound', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'surtr' },
- { key: 'nala', name: 'nala', s: 'F', attributes: [], spouses: [] },
- { key: 'mufasa', name: 'mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
+ { key: 'satyr', name: 'Satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
+ { key: 'surtr', name: 'Surtr', s: 'F', attributes: ['S'], spouses: [] },
+ { key: 'hound', name: 'Hound', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'surtr' },
+ { key: 'nala', name: 'Nala', s: 'F', attributes: [], spouses: [] },
+ { key: 'mufasa', name: 'Mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
]);
});
@@ -331,15 +332,15 @@ describe('treesToPersonNode', () => {
const trees = enrichTreeData(doubleFamilyData.trees, enrichingPeople);
const nodes = treesToPersonNode(trees);
expect(nodes).toEqual([
- { key: 'satyr', name: 'satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
- { key: 'surtr', name: 'surtr', s: 'F', attributes: ['S'], spouses: [] },
- { key: 'hound', name: 'hound', s: 'M', attributes: [], spouses: ['alpha'], father: 'satyr', mother: 'surtr' },
- { key: 'alpha', name: 'alpha', s: 'F', attributes: [], spouses: [], father: 'saber', mother: 'angela' },
- { key: 'ryora', name: 'ryora', s: 'M', attributes: [], spouses: [], father: 'hound', mother: 'alpha' },
- { key: 'nala', name: 'nala', s: 'F', attributes: [], spouses: [] },
- { key: 'mufasa', name: 'mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
- { key: 'angela', name: 'angela', s: 'F', attributes: [], spouses: ['saber'] },
- { key: 'saber', name: 'saber', s: 'M', attributes: [], spouses: [] },
+ { key: 'satyr', name: 'Satyr', s: 'M', attributes: [], spouses: ['surtr', 'nala'] },
+ { key: 'surtr', name: 'Surtr', s: 'F', attributes: ['S'], spouses: [] },
+ { key: 'hound', name: 'Hound', s: 'M', attributes: [], spouses: ['alpha'], father: 'satyr', mother: 'surtr' },
+ { key: 'alpha', name: 'Alpha', s: 'F', attributes: [], spouses: [], father: 'saber', mother: 'angela' },
+ { key: 'ryora', name: 'Ryora', s: 'M', attributes: [], spouses: [], father: 'hound', mother: 'alpha' },
+ { key: 'nala', name: 'Nala', s: 'F', attributes: [], spouses: [] },
+ { key: 'mufasa', name: 'Mufasa', s: 'M', attributes: [], spouses: [], father: 'satyr', mother: 'nala' },
+ { key: 'angela', name: 'Angela', s: 'F', attributes: [], spouses: ['saber'] },
+ { key: 'saber', name: 'Saber', s: 'M', attributes: [], spouses: [] },
]);
});
});
@@ -445,3 +446,12 @@ describe('deletePerson', () => {
}]);
});
});
+
+describe('idAsNickName', () => {
+ test('convert correctly', () => {
+ expect(idAsNickName('satyr')).toEqual('Satyr');
+ expect(idAsNickName(' satyr123 ')).toEqual('Satyr');
+ expect(idAsNickName('sat123yr')).toEqual('Satyr');
+ expect(idAsNickName('m..satyr')).toEqual('M Satyr');
+ });
+});
diff --git a/src/family.util.tsx b/src/family.util.tsx
index 94453f8..78a210e 100644
--- a/src/family.util.tsx
+++ b/src/family.util.tsx
@@ -190,7 +190,7 @@ export function treesToPersonNode(
if (!nodes[person.id]) {
nodes[person.id] = {
key: person.id,
- name: person.id,
+ name: idAsNickName(person.id),
s: person.sex ?? 'M',
attributes: [],
spouses: [],
@@ -231,3 +231,12 @@ export function treesToPersonNode(
return Object.values(nodes);
}
+
+// remove number and capitalize first letter
+export function idAsNickName(id: string): string {
+ return id
+ .trim()
+ .replace(/\d/g, '')
+ .replace(/[-_. ]+/g, ' ')
+ .replace(/\b\w/g, c => c.toUpperCase());
+}
|