Can set member biography

geneit_app/src/api/MemberApi.ts

@@ -159,6 +159,10 @@ export class Member implements MemberDataApi {
       ? true
       : false;
   }
+
+  get hasNote(): boolean {
+    return (this.note?.length ?? 0) > 0;
+  }
 }
 
 export function fmtDate(d?: DateValue): string {

geneit_app/src/routes/family/FamilyMemberRoute.tsx

@@ -576,9 +576,25 @@ export function MemberPage(p: {
         )}
 
         {/* Bio */}
+        {(p.editing || member.hasNote) && (
           <Grid item sm={12} md={6}>
-          <PropertiesBox title="Biographie">TODO</PropertiesBox>
+            <PropertiesBox title="Biographie">
+              <PropEdit
+                label="Biographie"
+                editable={p.editing}
+                multiline={true}
+                minRows={5}
+                maxRows={20}
+                value={member.note}
+                onValueChange={(v) => {
+                  member.note = v;
+                  updatedMember();
+                }}
+                size={ServerApi.Config.constraints.member_note}
+              />
+            </PropertiesBox>
           </Grid>
+        )}
 
         {/* Spouse */}
         <Grid item sm={12} md={6}>

geneit_app/src/widgets/forms/PropEdit.tsx

@@ -11,6 +11,9 @@ export function PropEdit(p: {
   onValueChange?: (newVal: string | undefined) => void;
   size?: LenConstraint;
   checkValue?: (s: string) => boolean;
+  multiline?: boolean;
+  minRows?: number;
+  maxRows?: number;
 }): React.ReactElement {
   if (((!p.editable && p.value) ?? "") === "") return <></>;
 
@@ -31,6 +34,9 @@ export function PropEdit(p: {
       }}
       variant={p.editable ? "filled" : "standard"}
       style={{ width: "100%", marginBottom: "15px" }}
+      multiline={p.multiline}
+      minRows={p.minRows}
+      maxRows={p.maxRows}
       error={
         (p.checkValue &&
           p.value &&