added category titles

src/web/body.py

@@ -26,11 +26,16 @@ def generate_option_labels(model) -> List[str]:
     ]
     return labels
 
-def generate_options_map():
+def generate_experiential_options_map():
-    """Generate map of titles and options for labels container."""
+    """Generate map of titles and options for experiential labels."""
     options_map = {}
     # add experiential labels
     options_map["experiential".title()] = generate_option_labels(ExperientialModelOutput)
+    return options_map
+
+def generate_interpersonal_options_map():
+    """Generate map of titles and options for interpersonal labels."""
+    options_map = {}
     # add interpersonal labels
     options_map["contact".title()] = generate_option_labels(ContactModelOutput)
     options_map["angle".title()] = generate_option_labels(AngleModelOutput)
@@ -39,6 +44,11 @@ def generate_options_map():
     options_map["modality lighting".title()] = generate_option_labels(ModalityLightingModelOutput)
     options_map["modality color".title()] = generate_option_labels(ModalityColorModelOutput)
     options_map["modality depth".title()] = generate_option_labels(ModalityDepthModelOutput)
+    return options_map
+
+def generate_textual_options_map():
+    """Generate map of titles and options for textual labels."""
+    options_map = {}
     # add textual labels
     options_map["information value".title()] = generate_option_labels(InformationValueModelOutput)
     options_map["framing".title()] = generate_option_labels(FramingModelOutput)
@@ -52,20 +62,53 @@ def generate_body():
         withPlaceholder=True,
         placeholder=[dmc.Loader(color="gray", size="md")],
     )
-
+    # prepare experiential container
+    experiential_map = generate_experiential_options_map()
+    experiential_container = dmc.Col(
+        children=[
+            dmc.Container([
+                html.H4(list(experiential_map.keys())[0]),
+                html.B("visual syntax".title()),
+                dcc.RadioItems(options=list(experiential_map.values())[0]),
+            ])
+        ], span=4
+    )
+    # prepare interpersonal container
+    interpersonal_map = generate_interpersonal_options_map()
+    interpersonal_container = dmc.Col(
+        children=[
+            html.H4("interpersonal".title()),
+        ], span=4
+    )
+    for title, options in interpersonal_map.items():
+        interpersonal_container.children.append(
+            dmc.Container([
+                html.B(title),
+                dcc.RadioItems(options)
+            ])
+        )
+    # prepare textual container
+    textual_map = generate_textual_options_map()
+    textual_container = dmc.Col(
+        children=[
+            html.H4("textual".title()),
+        ], span=4
+    )
+    for title, options in textual_map.items():
+        textual_container.children.append(
+            dmc.Container([
+                html.B(title),
+                dcc.RadioItems(options)
+            ])
+        )
     # prepare labels container
     label_container = dmc.Grid(
-        children=[],
+        children=[
+            experiential_container,
+            interpersonal_container,
+            textual_container,
+        ],
     )
-    # add fields to labels container
-    for title, options in generate_options_map().items():
-        label_container.children.append(
-            dmc.Col([
-                html.H4(title),
-                dcc.RadioItems(options=options),
-            ], span=3)
-        )
-
     # build the full body container
     body_container = dmc.Container(
         dmc.Grid(
@@ -74,7 +117,7 @@ def generate_body():
                     dmc.Center(
                     image_container,
                     ),
-                    span=4,
+                    span=5,
                 ),
                 dmc.Col(
                     # radio buttons part
@@ -91,7 +134,7 @@ def generate_body():
                                 "height": "50px"
                             }
                         ),
-                    ], span=8,
+                    ], span=7,
                 ),
                 # dmc.Col(span=1),
             ], grow=True