chore: allow custom content to toolbar

cognitedata · Jul 17, 2023 · 444d3f5 · 444d3f5
1 parent 569db51
commit 444d3f5
Showing 1 changed file with 22 additions and 20 deletions.
diff --git a/react-components/src/components/RevealToolbar/RevealToolbar.tsx b/react-components/src/components/RevealToolbar/RevealToolbar.tsx
@@ -15,32 +15,34 @@ const defaultStyle: ToolBarProps = {
   }
 };
 
-export const RevealToolbar = (toolBarProps: ToolBarProps): ReactElement => {
-  if (toolBarProps.className === undefined && toolBarProps.style === undefined) {
-    toolBarProps = { ...toolBarProps, ...defaultStyle };
-  }
-  return (
-    <ToolBar {...toolBarProps}>
-      <>
-        <Button type="ghost" icon="Layers" aria-label="3D Resource layers" />
+const defaultContent = (
+  <>
+    <Button type="ghost" icon="Layers" aria-label="3D Resource layers" />
+
+    <div className="cogs-toolbar-divider" />
 
-        <div className="cogs-toolbar-divider" />
+    <FitModelsButton />
+    <Button type="ghost" icon="Collapse" aria-label="Focus asset" />
 
-        <FitModelsButton />
-        <Button type="ghost" icon="Collapse" aria-label="Focus asset" />
+    <div className="cogs-toolbar-divider" />
 
-        <div className="cogs-toolbar-divider" />
+    <SlicerButton />
+    <Button type="ghost" icon="Ruler" aria-label="Make measurements" />
 
-        <SlicerButton />
-        <Button type="ghost" icon="Ruler" aria-label="Make measurements" />
+    <div className="cogs-toolbar-divider" />
 
-        <div className="cogs-toolbar-divider" />
+    <Button type="ghost" icon="Settings" aria-label="Show settings" />
+    <Button type="ghost" icon="Help" aria-label="Display help" />
+  </>
+);
 
-        <Button type="ghost" icon="Settings" aria-label="Show settings" />
-        <Button type="ghost" icon="Help" aria-label="Display help" />
-      </>
-    </ToolBar>
-  );
+export const RevealToolbar = (
+  props: ToolBarProps & { toolBarContent?: JSX.Element }
+): ReactElement => {
+  if (props.className === undefined && props.style === undefined) {
+    props = { ...props, ...defaultStyle };
+  }
+  return <ToolBar {...props}>{props.toolBarContent ?? defaultContent}</ToolBar>;
 };
 
 RevealToolbar.FitModelsButton = FitModelsButton;