From f96a56ac0f0322a45eaebde3f9c2a7f5f06da4b6 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Tue, 22 Oct 2024 17:18:43 +0200
Subject: [PATCH] feat: replace audioRecorderStore with composable

Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../NewMessage/NewMessageAudioRecorder.vue    | 17 +++++-----
 src/composables/useAudioEncoder.ts            | 33 ++++++++++++++++++
 src/store/audioRecorderStore.js               | 34 -------------------
 src/store/storeConfig.js                      |  2 --
 4 files changed, 41 insertions(+), 45 deletions(-)
 create mode 100644 src/composables/useAudioEncoder.ts
 delete mode 100644 src/store/audioRecorderStore.js

diff --git a/src/components/NewMessage/NewMessageAudioRecorder.vue b/src/components/NewMessage/NewMessageAudioRecorder.vue
index 13a87cf1a04..977e287b887 100644
--- a/src/components/NewMessage/NewMessageAudioRecorder.vue
+++ b/src/components/NewMessage/NewMessageAudioRecorder.vue
@@ -54,6 +54,7 @@ import { t } from '@nextcloud/l10n'
 
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
+import { useAudioEncoder } from '../../composables/useAudioEncoder.ts'
 import { mediaDevicesManager } from '../../utils/webrtc/index.js'
 
 export default {
@@ -75,6 +76,13 @@ export default {
 
 	emits: ['recording', 'audio-file'],
 
+	setup() {
+		const encoderReady = useAudioEncoder()
+		return {
+			encoderReady,
+		}
+	},
+
 	data() {
 		return {
 			// The audio stream object
@@ -125,10 +133,6 @@ export default {
 			return t('spreed', 'Dismiss recording')
 		},
 
-		encoderReady() {
-			return this.$store.getters.encoderReady
-		},
-
 		canStartRecording() {
 			if (this.disabled) {
 				return false
@@ -139,16 +143,11 @@ export default {
 	},
 
 	watch: {
-
 		isRecording(newValue) {
 			console.debug('isRecording', newValue)
 		},
 	},
 
-	mounted() {
-		this.$store.dispatch('initializeAudioEncoder')
-	},
-
 	beforeDestroy() {
 		this.killStreams()
 	},
diff --git a/src/composables/useAudioEncoder.ts b/src/composables/useAudioEncoder.ts
new file mode 100644
index 00000000000..e4156ef8de4
--- /dev/null
+++ b/src/composables/useAudioEncoder.ts
@@ -0,0 +1,33 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import { register } from 'extendable-media-recorder'
+import { connect } from 'extendable-media-recorder-wav-encoder'
+import { readonly, ref } from 'vue'
+import type { Ref, DeepReadonly } from 'vue'
+
+let requiresInit = true
+const encoderReady = ref(false)
+
+/**
+ * Initialize the audio encoder
+ */
+async function initAudioEncoder() {
+	requiresInit = false
+	await register(await connect())
+	encoderReady.value = true
+}
+
+/**
+ * Composable to use audio encoder for voice messages feature
+ * @return {DeepReadonly<Ref<boolean>>} - whether the encoder is ready
+ */
+export function useAudioEncoder(): DeepReadonly<Ref<boolean>> {
+	if (requiresInit) {
+		initAudioEncoder()
+	}
+
+	return readonly(encoderReady)
+}
diff --git a/src/store/audioRecorderStore.js b/src/store/audioRecorderStore.js
deleted file mode 100644
index 66c3026b90f..00000000000
--- a/src/store/audioRecorderStore.js
+++ /dev/null
@@ -1,34 +0,0 @@
-/**
- * SPDX-FileCopyrightText: 2021 Nextcloud GmbH and Nextcloud contributors
- * SPDX-License-Identifier: AGPL-3.0-or-later
- */
-
-import { register } from 'extendable-media-recorder'
-import { connect } from 'extendable-media-recorder-wav-encoder'
-
-const state = () => ({
-	encoderReady: false,
-})
-
-const getters = {
-	encoderReady: state => {
-		return state.encoderReady
-	},
-}
-
-const mutations = {
-	encoderReady: (state) => {
-		state.encoderReady = true
-	},
-}
-
-const actions = {
-	async initializeAudioEncoder({ commit, state }) {
-		if (!state.encoderReady) {
-			register(await connect())
-			commit('encoderReady')
-		}
-	},
-}
-
-export default { state, mutations, getters, actions }
diff --git a/src/store/storeConfig.js b/src/store/storeConfig.js
index 23fc828ec54..1d5b6c19244 100644
--- a/src/store/storeConfig.js
+++ b/src/store/storeConfig.js
@@ -4,7 +4,6 @@
  */
 
 import actorStore from './actorStore.js'
-import audioRecorderStore from './audioRecorderStore.js'
 import conversationsStore from './conversationsStore.js'
 import fileUploadStore from './fileUploadStore.js'
 import messagesStore from './messagesStore.js'
@@ -14,7 +13,6 @@ import tokenStore from './tokenStore.js'
 export default {
 	modules: {
 		actorStore,
-		audioRecorderStore,
 		conversationsStore,
 		fileUploadStore,
 		messagesStore,