diff --git a/admin/src/components/CustomNode.js b/admin/src/components/CustomNode.js index ef69f27..60ec676 100644 --- a/admin/src/components/CustomNode.js +++ b/admin/src/components/CustomNode.js @@ -5,7 +5,13 @@ */ import React from "react"; -import { Badge, Box, Divider, Tooltip, Typography } from "@strapi/design-system"; +import { + Badge, + Box, + Divider, + Tooltip, + Typography, +} from "@strapi/design-system"; import { useTheme } from "styled-components"; import { Handle } from "reactflow"; import { RelationIcon } from "./RelationIcon"; @@ -34,13 +40,28 @@ export default function CustomNode({ data }) { const theme = useTheme(); return ( - - + + {data.info.displayName}
- + {data.key} {attr[0]}

{data.options.showTypes && ( - + {attr[1].type} )} @@ -70,9 +95,16 @@ export default function CustomNode({ data }) { {attr[1].type === "relation" && ( <> - {getIcon(attr[1].relation)} + + {getIcon(attr[1].relation)} + - + )} diff --git a/admin/src/components/OptionsBar.js b/admin/src/components/OptionsBar.js index e19aa80..717843a 100644 --- a/admin/src/components/OptionsBar.js +++ b/admin/src/components/OptionsBar.js @@ -13,7 +13,7 @@ export default function OptionsBar() { style={{ display: "flex", justifyContent: "flex-start", - alignItems: "center", + alignItems: "flex-start", padding: "0 56px 24px", gap: "24px", }} @@ -25,14 +25,14 @@ export default function OptionsBar() { }} value={options.showTypes} > - Fields Data Types + Data Types toggleOption("showIcons")} value={options.showIcons} > - Fields Icons + Data Type Icons