From 209cfe89655203b55edb5099b28ad0a88f75444a Mon Sep 17 00:00:00 2001
From: Pierre Hubert <pierre.git@communiquons.org>
Date: Mon, 28 Aug 2023 09:52:18 +0200
Subject: [PATCH] Minor improvements of simple family tree

---
 geneit_app/src/api/MemberApi.ts                    |  7 +++++++
 .../simple_family_tree/SimpleFamilyTree.tsx        | 14 +++++++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/geneit_app/src/api/MemberApi.ts b/geneit_app/src/api/MemberApi.ts
index 0a0074b..66b0d73 100644
--- a/geneit_app/src/api/MemberApi.ts
+++ b/geneit_app/src/api/MemberApi.ts
@@ -170,6 +170,13 @@ export class Member implements MemberDataApi {
     return birthDeath.join(" - ");
   }
 
+  get displayBirthDeathShort(): string {
+    let birthDeath = [];
+    if (this.birth_year) birthDeath.push(this.birth_year.toString());
+    if (this.death_year) birthDeath.push(this.death_year.toString());
+    return birthDeath.join(" - ");
+  }
+
   get hasContactInfo(): boolean {
     return this.email ||
       this.phone ||
diff --git a/geneit_app/src/widgets/simple_family_tree/SimpleFamilyTree.tsx b/geneit_app/src/widgets/simple_family_tree/SimpleFamilyTree.tsx
index e80fd27..a16707f 100644
--- a/geneit_app/src/widgets/simple_family_tree/SimpleFamilyTree.tsx
+++ b/geneit_app/src/widgets/simple_family_tree/SimpleFamilyTree.tsx
@@ -35,7 +35,7 @@ const SPOUSE_SPACING = 10;
 /**
  * Space between two siblings hierachy
  */
-const SIBLINGS_SPACING = 0;
+const SIBLINGS_SPACING = 15;
 
 /**
  * Vertical space between two generations
@@ -76,9 +76,10 @@ interface SimpleTreeNode {
  */
 function memberCardWidth(m?: Member): number {
   if (!m) return 0;
-  const nameWidth = getTextWidth(m.fullName, NAME_FONT);
+  const firstNameWidth = getTextWidth(m.first_name ?? "", NAME_FONT);
+  const lastNameWidth = getTextWidth(m.lastNameUpperCase ?? "", NAME_FONT);
   const birthDeathWidth = getTextWidth(m.displayBirthDeath, BIRTH_FONT);
-  return Math.max(FACE_WIDTH, nameWidth, birthDeathWidth);
+  return Math.max(FACE_WIDTH, firstNameWidth, lastNameWidth, birthDeathWidth);
 }
 
 function center(container_width: number, el_width: number): number {
@@ -389,12 +390,15 @@ function MemberCard(p: {
           {p.member.lastNameUpperCase ?? ""}
         </tspan>
         <tspan
-          x={center(w, getTextWidth(p.member.displayBirthDeath, BIRTH_FONT))}
+          x={center(
+            w,
+            getTextWidth(p.member.displayBirthDeathShort, BIRTH_FONT)
+          )}
           dy="14"
           font-size="10"
           fontFamily="Roboto"
         >
-          {p.member.displayBirthDeath}
+          {p.member.displayBirthDeathShort}
         </tspan>
       </text>
     </g>