diff --git a/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue b/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue
index 87bca808e7e..25e5153ebd7 100644
--- a/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue
+++ b/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue
@@ -55,6 +55,17 @@
 			</template>
 		</div>
 		<div class="participants-editor__buttons">
+			<NcButton v-if="breakoutRoomsConfigured"
+				class="delete"
+				:title="deleteButtonLabel"
+				:aria-label="deleteButtonLabel"
+				type="error"
+				@click="deleteBreakoutRooms">
+				<template #icon>
+					<Delete :size="20" />
+				</template>
+				{{ deleteButtonLabel }}
+			</NcButton>
 			<NcButton v-if="!isReorganizingAttendees"
 				type="tertiary"
 				@click="goBack">
@@ -94,6 +105,7 @@
 
 <script>
 import ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
+import Delete from 'vue-material-design-icons/Delete.vue'
 import GoogleCircles from 'vue-material-design-icons/GoogleCircles.vue'
 import Reload from 'vue-material-design-icons/Reload.vue'
 
@@ -104,7 +116,7 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
 import SelectableParticipant from './SelectableParticipant.vue'
 
-import { ATTENDEE, PARTICIPANT } from '../../constants.js'
+import { ATTENDEE, CONVERSATION, PARTICIPANT } from '../../constants.js'
 
 export default {
 	name: 'BreakoutRoomsParticipantsEditor',
@@ -118,6 +130,7 @@ export default {
 		SelectableParticipant,
 		NcButton,
 		ArrowLeft,
+		Delete,
 	},
 
 	props: {
@@ -194,6 +207,18 @@ export default {
 		resetButtonLabel() {
 			return t('spreed', 'Reset')
 		},
+
+		conversation() {
+			return this.$store.getters.conversation(this.token)
+		},
+
+		breakoutRoomsConfigured() {
+			return this.conversation.breakoutRoomMode !== CONVERSATION.BREAKOUT_ROOM_MODE.NOT_CONFIGURED
+		},
+
+		deleteButtonLabel() {
+			return t('spreed', 'Delete breakout rooms')
+		},
 	},
 
 	created() {
@@ -289,6 +314,27 @@ export default {
 			})
 			this.$emit('close')
 		},
+
+		deleteBreakoutRooms() {
+			OC.dialogs.confirmDestructive(
+				t('spreed', 'Current breakout rooms and settings will be lost'),
+				t('spreed', 'Delete breakout rooms'),
+				{
+					type: OC.dialogs.YES_NO_BUTTONS,
+					confirm: t('spreed', 'Delete breakout rooms'),
+					confirmClasses: 'error',
+					cancel: t('spreed', 'Cancel'),
+				},
+				(decision) => {
+					if (!decision) {
+						return
+					}
+					this.$store.dispatch('deleteBreakoutRoomsAction', {
+						token: this.token,
+					})
+				}
+			)
+		},
 	},
 }
 </script>
@@ -330,4 +376,8 @@ export default {
 	position: absolute !important;
 	left: 0;
 }
+
+.delete {
+	margin-right: auto;
+}
 </style>
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
new file mode 100644
index 00000000000..0666164f418
--- /dev/null
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue
@@ -0,0 +1,281 @@
+<template>
+	<!-- Series of buttons at the top of the tab, these affect all
+		 breakout rooms -->
+	<div v-if="canModerate || isInBreakoutRoom" class="breakout-rooms-actions">
+		<div class="breakout-rooms-actions__row">
+			<NcButton v-if="breakoutRoomsNotStarted && canModerate"
+				:title="startLabel"
+				:aria-label="startLabel"
+				type="primary"
+				:wide="true"
+				:disabled="!isInCall"
+				@click="startBreakoutRooms">
+				<template #icon>
+					<Play :size="20" />
+				</template>
+				{{ startLabel }}
+			</NcButton>
+			<NcButton v-else-if="canModerate"
+				:title="stopLabel"
+				:aria-label="stopLabel"
+				type="error"
+				:wide="true"
+				@click="stopBreakoutRooms">
+				<template #icon>
+					<StopIcon :size="20" />
+				</template>
+				{{ stopLabel }}
+			</NcButton>
+		</div>
+		<div class="breakout-rooms-actions__row">
+			<NcButton v-if="canModerate && !isInBreakoutRoom"
+				:title="sendMessageLabel"
+				:aria-label="sendMessageLabel"
+				type="secondary"
+				:wide="true"
+				@click="openSendMessageDialog">
+				<template #icon>
+					<Send :size="18" />
+				</template>
+				{{ sendMessageLabel }}
+			</NcButton>
+			<NcButton v-if="isInBreakoutRoom"
+				:title="backToMainRoomLabel"
+				:aria-label="backToMainRoomLabel"
+				:wide="true"
+				type="secondary"
+				@click="switchToParentRoom">
+				<template #icon>
+					<ArrowLeft :size="20" />
+				</template>
+				{{ backToMainRoomLabel }}
+			</NcButton>
+			<NcActions v-if="canModerate" class="right">
+				<NcActionButton v-if="canModerate && isInBreakoutRoom"
+					:title="sendMessageLabel"
+					:aria-label="sendMessageLabel"
+					@click="openSendMessageDialog">
+					<template #icon>
+						<Send :size="20" />
+					</template>
+				</NcActionButton>
+				<NcActionButton v-if="canModerate"
+					:title="manageBreakoutRoomsTitle"
+					:aria-label="manageBreakoutRoomsTitle"
+					@click="openParticipantsEditor">
+					<template #icon>
+						<Cog :size="20" />
+					</template>
+				</NcActionButton>
+			</NcActions>
+		</div>
+
+		<!-- Participants editor -->
+		<NcModal v-if="showParticipantsEditor"
+			@close="closeParticipantsEditor">
+			<div class="breakout-rooms-actions__editor">
+				<h2> {{ manageBreakoutRoomsTitle }} </h2>
+				<BreakoutRoomsParticipantsEditor :token="token"
+					:breakout-rooms="breakoutRooms"
+					:is-creating-rooms="false"
+					@close="closeParticipantsEditor"
+					v-on="$listeners" />
+			</div>
+		</NcModal>
+
+		<!-- Send message dialog -->
+		<SendMessageDialog v-if="sendMessageDialogOpened"
+			:token="token"
+			:broadcast="true"
+			@close="closeSendMessageDialog" />
+	</div>
+</template>
+
+<script>
+import ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
+import Cog from 'vue-material-design-icons/Cog.vue'
+import Play from 'vue-material-design-icons/Play.vue'
+import Send from 'vue-material-design-icons/Send.vue'
+import StopIcon from 'vue-material-design-icons/Stop.vue'
+
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
+
+import BreakoutRoomsParticipantsEditor from '../../BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue'
+import SendMessageDialog from '../../BreakoutRoomsEditor/SendMessageDialog.vue'
+
+import { CONVERSATION, PARTICIPANT } from '../../../constants.js'
+import isInCall from '../../../mixins/isInCall.js'
+import { EventBus } from '../../../services/EventBus.js'
+
+export default {
+	name: 'BreakoutRoomsActions',
+
+	components: {
+		// Components
+		NcButton,
+		BreakoutRoomsParticipantsEditor,
+		SendMessageDialog,
+		NcModal,
+		NcActions,
+		NcActionButton,
+
+		// Icons
+		Play,
+		Cog,
+		StopIcon,
+		ArrowLeft,
+		Send,
+	},
+
+	mixins: [isInCall],
+
+	props: {
+		token: {
+			type: String,
+			required: true,
+		},
+
+		conversation: {
+			type: Object,
+			required: true,
+		},
+
+		breakoutRooms: {
+			type: Array,
+			required: true,
+		},
+
+		breakoutRoomsConfigured: {
+			type: Boolean,
+			required: true,
+		},
+	},
+
+	data() {
+		return {
+			showParticipantsEditor: false,
+			sendMessageDialogOpened: false,
+		}
+	},
+
+	computed: {
+		canFullModerate() {
+			return this.participantType === PARTICIPANT.TYPE.OWNER || this.participantType === PARTICIPANT.TYPE.MODERATOR
+		},
+
+		canModerate() {
+			return !this.isOneToOne && (this.canFullModerate || this.participantType === PARTICIPANT.TYPE.GUEST_MODERATOR)
+		},
+
+		breakoutRoomsNotStarted() {
+			if (this.isInBreakoutRoom) {
+				return this.parentRoom.breakoutRoomStatus !== CONVERSATION.BREAKOUT_ROOM_STATUS.STARTED
+			} else {
+				return this.conversation.breakoutRoomStatus !== CONVERSATION.BREAKOUT_ROOM_STATUS.STARTED
+			}
+		},
+
+		isInBreakoutRoom() {
+			return this.conversation.objectType === 'room'
+		},
+
+		parentRoom() {
+			if (!this.isInBreakoutRoom) {
+				return undefined
+			} else {
+				return this.$store.getters.conversation(this.conversation.objectId)
+			}
+		},
+
+		manageBreakoutRoomsTitle() {
+			return t('spreed', 'Manage breakout rooms')
+		},
+
+		backToMainRoomLabel() {
+			return t('spreed', 'Back to main room')
+		},
+
+		participantType() {
+			return this.conversation.participantType
+		},
+
+		sendMessageLabel() {
+			return t('spreed', 'Message all rooms')
+		},
+
+		startLabel() {
+			return t('spreed', 'Start session')
+		},
+
+		stopLabel() {
+			return t('spreed', 'Stop session')
+		},
+	},
+
+	methods: {
+		startBreakoutRooms() {
+			if (this.isInBreakoutRoom) {
+				this.$store.dispatch('startBreakoutRoomsAction', this.parentRoom.token)
+			} else {
+				this.$store.dispatch('startBreakoutRoomsAction', this.token)
+			}
+
+		},
+
+		stopBreakoutRooms() {
+			if (this.isInBreakoutRoom) {
+				this.$store.dispatch('stopBreakoutRoomsAction', this.parentRoom.token)
+			} else {
+				this.$store.dispatch('stopBreakoutRoomsAction', this.token)
+			}
+		},
+
+		openSendMessageDialog() {
+			this.sendMessageDialogOpened = true
+		},
+
+		closeSendMessageDialog() {
+			this.sendMessageDialogOpened = false
+		},
+
+		openParticipantsEditor() {
+			this.showParticipantsEditor = true
+		},
+
+		closeParticipantsEditor() {
+			this.showParticipantsEditor = false
+		},
+
+		async switchToParentRoom() {
+			EventBus.$emit('switch-to-conversation', {
+				token: this.parentRoom.token,
+			})
+		},
+	},
+}
+</script>
+
+<style lang="scss" scoped>
+.breakout-rooms-actions {
+	display: flex;
+	flex-direction: column;
+	margin-bottom: calc(var(--default-grid-baseline) * 3);
+
+	&__row {
+		display: flex;
+		margin-bottom: var(--default-grid-baseline);
+		gap: var(--default-grid-baseline);
+	}
+
+	&__editor {
+		padding: 20px;
+	}
+}
+
+.right {
+	justify-content: right;
+}
+</style>
diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue
index efee7716fa5..99ec5155c26 100644
--- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue
+++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsTab.vue
@@ -21,145 +21,37 @@
 
 <template>
 	<div class="breakout-rooms">
-		<!-- Series of buttons at the top of the tab, these affect all
-		 breakout rooms -->
-		<div v-if="canModerate || isInBreakoutRoom" class="breakout-rooms__actions">
-			<div class="breakout-rooms__actions-group">
-				<NcButton v-if="breakoutRoomsNotStarted && canModerate"
-					:title="t('spreed', 'Start breakout rooms')"
-					:aria-label="t('spreed', 'Start breakout rooms')"
-					type="tertiary"
-					:disabled="!isInCall"
-					@click="startBreakoutRooms">
-					<template #icon>
-						<Play :size="20" />
-					</template>
-				</NcButton>
-				<NcButton v-else-if="canModerate"
-					:title="t('spreed', 'Stop breakout rooms')"
-					:aria-label="t('spreed', 'Stop breakout rooms')"
-					type="tertiary"
-					@click="stopBreakoutRooms">
-					<template #icon>
-						<StopIcon :size="20" />
-					</template>
-				</NcButton>
-				<NcButton v-if="isInBreakoutRoom"
-					:title="backToMainRoomLabel"
-					:aria-label="backToMainRoomLabel"
-					:wide="true"
-					type="secondary"
-					@click="switchToParentRoom">
-					<template #icon>
-						<ArrowLeft :size="20" />
-					</template>
-					{{ backToMainRoomLabel }}
-				</NcButton>
-				<NcButton v-if="canModerate"
-					:title="t('spreed', 'Send message to breakout rooms')"
-					:aria-label="t('spreed', 'Send message to breakout rooms')"
-					type="tertiary"
-					@click="openSendMessageDialog">
-					<template #icon>
-						<Message :size="18" />
-					</template>
-				</NcButton>
-			</div>
-			<div v-if="canModerate" class="breakout-rooms__actions-group right">
-				<!-- Re-arrange participants button -->
-				<NcButton type="tertiary"
-					:title="moveParticipantsButtonTitle"
-					:aria-label="moveParticipantsButtonTitle"
-					@click="openParticipantsEditor">
-					<template #icon>
-						<AccountMultiple :size="20" />
-					</template>
-				</NcButton>
-				<NcButton v-if="breakoutRoomsConfigured"
-					:title="t('spreed', 'Delete breakout rooms')"
-					:aria-label="t('spreed', 'Delete breakout rooms')"
-					type="tertiary"
-					@click="deleteBreakoutRooms">
-					<template #icon>
-						<Delete :size="20" />
-					</template>
-				</NcButton>
-			</div>
-		</div>
-
-		<template v-if="breakoutRoomsConfigured">
-			<!-- Breakout rooms list -->
-			<ul v-if="breakoutRooms">
-				<template v-for="breakoutRoom in breakoutRooms">
-					<BreakoutRoomItem :key="breakoutRoom.token"
-						:breakout-room="breakoutRoom" />
-				</template>
-			</ul>
-
-			<!-- Participants editor -->
-			<NcModal v-if="showParticipantsEditor"
-				@close="closeParticipantsEditor">
-				<div class="breakout-rooms__editor">
-					<h2> {{ moveParticipantsButtonTitle }} </h2>
-					<BreakoutRoomsParticipantsEditor :token="token"
-						:breakout-rooms="breakoutRooms"
-						:is-creating-rooms="false"
-						@close="closeParticipantsEditor"
-						v-on="$listeners" />
-				</div>
-			</NcModal>
-
-			<!-- Send message dialog -->
-			<SendMessageDialog v-if="sendMessageDialogOpened"
-				:token="token"
-				:broadcast="true"
-				@close="closeSendMessageDialog" />
-		</template>
+		<!-- Actions -->
+		<BreakoutRoomsActions :token="token"
+			:conversation="conversation"
+			:breakout-rooms="breakoutRooms"
+			:breakout-rooms-configured="breakoutRoomsConfigured" />
+		<!-- Breakout rooms list -->
+		<ul v-if="breakoutRooms">
+			<template v-for="breakoutRoom in breakoutRooms">
+				<BreakoutRoomItem :key="breakoutRoom.token"
+					:breakout-room="breakoutRoom" />
+			</template>
+		</ul>
 	</div>
 </template>
 
 <script>
-import AccountMultiple from 'vue-material-design-icons/AccountMultiple.vue'
-import ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
-import Delete from 'vue-material-design-icons/Delete.vue'
-import Message from 'vue-material-design-icons/Message.vue'
-import Play from 'vue-material-design-icons/Play.vue'
-import StopIcon from 'vue-material-design-icons/Stop.vue'
-
-import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
-import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
-
-import BreakoutRoomsParticipantsEditor from '../../BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue'
-import SendMessageDialog from '../../BreakoutRoomsEditor/SendMessageDialog.vue'
 import BreakoutRoomItem from './BreakoutRoomItem.vue'
+import BreakoutRoomsActions from './BreakoutRoomsActions.vue'
 
 // Constants
-import { CONVERSATION, PARTICIPANT } from '../../../constants.js'
-import isInCall from '../../../mixins/isInCall.js'
-import { EventBus } from '../../../services/EventBus.js'
+import { CONVERSATION } from '../../../constants.js'
 
 export default {
 	name: 'BreakoutRoomsTab',
 
 	components: {
 		// Components
-		NcButton,
-		BreakoutRoomsParticipantsEditor,
-		SendMessageDialog,
 		BreakoutRoomItem,
-		NcModal,
-
-		// Icons
-		Delete,
-		Play,
-		AccountMultiple,
-		StopIcon,
-		Message,
-		ArrowLeft,
+		BreakoutRoomsActions,
 	},
 
-	mixins: [isInCall],
-
 	props: {
 		token: {
 			type: String,
@@ -179,8 +71,6 @@ export default {
 
 	data() {
 		return {
-			showParticipantsEditor: false,
-			sendMessageDialogOpened: false,
 			breakoutRoomsParticipantsInterval: undefined,
 		}
 	},
@@ -194,45 +84,6 @@ export default {
 			return this.conversation.breakoutRoomMode !== CONVERSATION.BREAKOUT_ROOM_MODE.NOT_CONFIGURED
 		},
 
-		breakoutRoomsNotStarted() {
-			if (this.isInBreakoutRoom) {
-				return this.parentRoom.breakoutRoomStatus !== CONVERSATION.BREAKOUT_ROOM_STATUS.STARTED
-			} else {
-				return this.conversation.breakoutRoomStatus !== CONVERSATION.BREAKOUT_ROOM_STATUS.STARTED
-			}
-		},
-
-		moveParticipantsButtonTitle() {
-			return t('spreed', 'Reorganize participants')
-		},
-
-		participantType() {
-			return this.conversation.participantType
-		},
-
-		canFullModerate() {
-			return this.participantType === PARTICIPANT.TYPE.OWNER || this.participantType === PARTICIPANT.TYPE.MODERATOR
-		},
-
-		canModerate() {
-			return !this.isOneToOne && (this.canFullModerate || this.participantType === PARTICIPANT.TYPE.GUEST_MODERATOR)
-		},
-
-		backToMainRoomLabel() {
-			return t('spreed', 'Back to main room')
-		},
-
-		isInBreakoutRoom() {
-			return this.conversation.objectType === 'room'
-		},
-
-		parentRoom() {
-			if (!this.isInBreakoutRoom) {
-				return undefined
-			} else {
-				return this.$store.getters.conversation(this.conversation.objectId)
-			}
-		},
 	},
 
 	watch: {
@@ -279,89 +130,6 @@ export default {
 				})
 			}
 		},
-
-		deleteBreakoutRooms() {
-			OC.dialogs.confirmDestructive(
-				t('spreed', 'Current breakout rooms and settings will be lost'),
-				t('spreed', 'Delete breakout rooms'),
-				{
-					type: OC.dialogs.YES_NO_BUTTONS,
-					confirm: t('spreed', 'Delete breakout rooms'),
-					confirmClasses: 'error',
-					cancel: t('spreed', 'Cancel'),
-				},
-				(decision) => {
-					if (!decision) {
-						return
-					}
-					this.$store.dispatch('deleteBreakoutRoomsAction', {
-						token: this.token,
-					})
-				}
-			)
-		},
-
-		openBreakoutRoomsEditor() {
-			if (!this.breakoutRoomsConfigured) {
-				this.showBreakoutRoomsEditor = true
-				return
-			}
-			OC.dialogs.confirmDestructive(
-				t('spreed', 'Current breakout rooms and settings will be lost'),
-				t('spreed', 'Re-configure breakout rooms'),
-				{
-					type: OC.dialogs.YES_NO_BUTTONS,
-					confirm: t('spreed', 'Re-configure breakout rooms'),
-					confirmClasses: 'primary',
-					cancel: t('spreed', 'Cancel'),
-				},
-				(decision) => {
-					if (!decision) {
-						return
-					}
-					this.showBreakoutRoomsEditor = true
-				}
-			)
-		},
-
-		startBreakoutRooms() {
-			if (this.isInBreakoutRoom) {
-				this.$store.dispatch('startBreakoutRoomsAction', this.parentRoom.token)
-			} else {
-				this.$store.dispatch('startBreakoutRoomsAction', this.token)
-			}
-
-		},
-
-		stopBreakoutRooms() {
-			if (this.isInBreakoutRoom) {
-				this.$store.dispatch('stopBreakoutRoomsAction', this.parentRoom.token)
-			} else {
-				this.$store.dispatch('stopBreakoutRoomsAction', this.token)
-			}
-		},
-
-		openSendMessageDialog() {
-			this.sendMessageDialogOpened = true
-		},
-
-		closeSendMessageDialog() {
-			this.sendMessageDialogOpened = false
-		},
-
-		openParticipantsEditor() {
-			this.showParticipantsEditor = true
-		},
-
-		closeParticipantsEditor() {
-			this.showParticipantsEditor = false
-		},
-
-		async switchToParentRoom() {
-			EventBus.$emit('switch-to-conversation', {
-				token: this.parentRoom.token,
-			})
-		},
 	},
 }
 </script>
@@ -369,25 +137,9 @@ export default {
 <style lang="scss" scoped>
 
 .breakout-rooms {
-	&__actions {
-		display: flex;
-		justify-content: space-between;
-		margin-bottom: calc(var(--default-grid-baseline) * 3);
-	}
-
-	&__actions-group {
-		display: flex;
-		gap: var(--default-grid-baseline);
-		flex-grow: 1;
-	}
-
 	&__room {
 		margin-top: var(--default-grid-baseline);
 	}
-
-	&__editor {
-		padding: 20px;
-	}
 }
 
 .right {