chore(data-modeling): update drawer icon label to be generic

packages/compass-data-modeling/src/components/drawer/diagram-editor-side-panel.tsx

@@ -39,7 +39,7 @@ const drawerTitleTextStyles = css({
 const drawerTitleActionGroupStyles = css({});
 
 type DiagramEditorSidePanelProps = {
-  selectedItems: (SelectedItems & { label: string }) | null;
+  selectedItems: (SelectedItems & { title: string }) | null;
   onDeleteCollection: (ns: string) => void;
   onDeleteRelationship: (rId: string) => void;
   onDeleteField: (ns: string, fieldPath: FieldPath) => void;
@@ -53,10 +53,11 @@ function DiagramEditorSidePanel({
   onDeleteRelationship,
   onDeleteField,
 }: DiagramEditorSidePanelProps) {
-  const { content, label, actions, handleAction } = useMemo(() => {
+  const { content, label, actions, title, handleAction } = useMemo(() => {
     if (selectedItems?.type === 'collection') {
       return {
-        label: selectedItems.label,
+        title: selectedItems.title,
+        label: 'Collection Configuration',
         content: (
           <CollectionDrawerContent
             key={selectedItems.id}
@@ -80,7 +81,8 @@ function DiagramEditorSidePanel({
 
     if (selectedItems?.type === 'relationship') {
       return {
-        label: selectedItems.label,
+        title: selectedItems.title,
+        label: 'Relationship Configuration',
         content: (
           <RelationshipDrawerContent
             key={selectedItems.id}
@@ -100,7 +102,8 @@ function DiagramEditorSidePanel({
 
     if (selectedItems?.type === 'field') {
       return {
-        label: selectedItems.label,
+        title: selectedItems.title,
+        label: 'Field Configuration',
         content: (
           <FieldDrawerContent
             key={`${selectedItems.namespace}.${JSON.stringify(
@@ -141,8 +144,8 @@ function DiagramEditorSidePanel({
       id={DATA_MODELING_DRAWER_ID}
       title={
         <div className={drawerTitleStyles}>
-          <span className={drawerTitleTextStyles} title={label}>
-            {label}
+          <span className={drawerTitleTextStyles} title={title}>
+            {title}
           </span>
 
           <ItemActionControls
@@ -197,7 +200,7 @@ export default connect(
       return {
         selectedItems: {
           ...selected,
-          label: getCollection(selected.id),
+          title: getCollection(selected.id),
         },
       };
     }
@@ -218,7 +221,7 @@ export default connect(
       return {
         selectedItems: {
           ...selected,
-          label: getDefaultRelationshipName(relationship.relationship),
+          title: getDefaultRelationshipName(relationship.relationship),
         },
       };
     }
@@ -241,7 +244,7 @@ export default connect(
       return {
         selectedItems: {
           ...selected,
-          label: `${getCollection(
+          title: `${getCollection(
             selected.namespace
           )}.${selected.fieldPath.join('.')}`,
         },

packages/compass-data-modeling/src/utils/nodes-and-edges.tsx

@@ -59,7 +59,7 @@ function getFieldTypeDisplay(bsonTypes: string[]) {
         </Body>
       }
     >
-      <div>(mixed)</div>
+      <i>(mixed)</i>
     </InlineDefinition>
   );
 }