From 4e57d40bcb51f8905a54fcdbd7b3c59f3b7eecf2 Mon Sep 17 00:00:00 2001
From: srgooglo <srgooglo@ragestudio.net>
Date: Thu, 4 Aug 2022 11:56:41 +0200
Subject: [PATCH] implement attached elements

---
 packages/app/src/layout/sidebar/index.jsx | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/packages/app/src/layout/sidebar/index.jsx b/packages/app/src/layout/sidebar/index.jsx
index 77ae812c..5131d86b 100644
--- a/packages/app/src/layout/sidebar/index.jsx
+++ b/packages/app/src/layout/sidebar/index.jsx
@@ -27,6 +27,7 @@ export default class Sidebar extends React.Component {
 			toggleVisibility: this.toggleVisibility,
 			toggleEdit: this.toggleEditMode,
 			toggleElevation: this.toggleElevation,
+			attachElement: this.attachElement,
 			isVisible: () => this.state.visible,
 			isEditMode: () => this.state.visible,
 			isCollapsed: () => this.state.collapsed,
@@ -44,6 +45,7 @@ export default class Sidebar extends React.Component {
 				top: [],
 			},
 			elevated: false,
+			additionalElements: [],
 		}
 
 		window.app.eventBus.on("edit_sidebar", () => this.toggleEditMode())
@@ -75,6 +77,12 @@ export default class Sidebar extends React.Component {
 		return window.app.settings.get("sidebarKeys")
 	}
 
+	attachElement = (element) => {
+		this.setState({
+			additionalElements: [...this.state.additionalElements, element],
+		})
+	}
+
 	appendItem = (item = {}) => {
 		const { position } = item
 
@@ -330,6 +338,10 @@ export default class Sidebar extends React.Component {
 					</div>
 				)}
 
+				{!this.state.editMode && <div key="additionalElements" className="additionalElements">
+					{this.state.additionalElements}
+				</div>}
+
 				{!this.state.editMode && (
 					<div key="bottom" className="app_sidebar_bottom">
 						<Menu selectable={false} mode="inline" theme={this.props.theme} onClick={this.handleClick}>