mosskoi/element-call-custom
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Refactor reactions / hand raised to use rxjs and start ordering tiles based on hand raised. (#2885)

Browse Source 
* Add support for using CallViewModel for reactions sounds.

* Drop setting

* Convert reaction sounds to call view model / rxjs

* Use call view model for hand raised reactions

* Support raising reactions for matrix rtc members.

* Tie up last bits of useReactions

* linting

* Update calleventaudiorenderer

* Update reaction audio renderer

* more test bits

* All the test bits and pieces

* More refactors

* Refactor reactions into a sender and receiver.

* Fixup reaction toggle button

* Adapt reactions test

* Tests all pass.

* lint

* fix a couple of bugs

* remove unused helper file

* lint

* finnish notation

* Add tests for useReactionsReader

* remove mistaken vitest file

* fix

* filter

* invert

* fixup tests with fake timers

* Port useReactionsReader hook to ReactionsReader class.

* lint

* exclude some files from coverage

* Add screen share sound effect.

* cancel sub on destroy

* tidy tidy
This commit is contained in:
Will Hunt
2024-12-19 15:54:28 +00:00
committed by GitHub
parent 7d00f85abc
commit abf2ecd521
28 changed files with 1835 additions and 1184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/room/ReactionAudioRenderer.tsx
View File

@@ -5,14 +5,14 @@ SPDX-License-Identifier: AGPL-3.0-only
Please see LICENSE in the repository root for full details.
*/
import { type ReactNode, useDeferredValue, useEffect, useState } from "react";
import { type ReactNode, useEffect, useState } from "react";
import { useReactions } from "../useReactions";
import { playReactionsSound, useSetting } from "../settings/settings";
import { GenericReaction, ReactionSet } from "../reactions";
import { useAudioContext } from "../useAudioContext";
import { prefetchSounds } from "../soundUtils";
import { useLatest } from "../useLatest";
import { type CallViewModel } from "../state/CallViewModel";
const soundMap = Object.fromEntries([
...ReactionSet.filter((v) => v.sound !== undefined).map((v) => [
@@ -22,8 +22,11 @@ const soundMap = Object.fromEntries([
[GenericReaction.name, GenericReaction.sound],
]);
export function ReactionsAudioRenderer(): ReactNode {
const { reactions } = useReactions();
export function ReactionsAudioRenderer({
vm,
}: {
vm: CallViewModel;
}): ReactNode {
const [shouldPlay] = useSetting(playReactionsSound);
const [soundCache, setSoundCache] = useState<ReturnType<
typeof prefetchSounds
@@ -33,7 +36,6 @@ export function ReactionsAudioRenderer(): ReactNode {
latencyHint: "interactive",
});
const audioEngineRef = useLatest(audioEngineCtx);
const oldReactions = useDeferredValue(reactions);
useEffect(() => {
if (!shouldPlay || soundCache) {
@@ -46,26 +48,19 @@ export function ReactionsAudioRenderer(): ReactNode {
}, [soundCache, shouldPlay]);
useEffect(() => {
if (!shouldPlay || !audioEngineRef.current) {
return;
}
const oldReactionSet = new Set(
Object.values(oldReactions).map((r) => r.name),
);
for (const reactionName of new Set(
Object.values(reactions).map((r) => r.name),
)) {
if (oldReactionSet.has(reactionName)) {
// Don't replay old reactions
return;
const sub = vm.audibleReactions$.subscribe((newReactions) => {
for (const reactionName of newReactions) {
if (soundMap[reactionName]) {
void audioEngineRef.current?.playSound(reactionName);
} else {
// Fallback sounds.
void audioEngineRef.current?.playSound("generic");
}
}
if (soundMap[reactionName]) {
void audioEngineRef.current.playSound(reactionName);
} else {
// Fallback sounds.
void audioEngineRef.current.playSound("generic");
}
}
}, [audioEngineRef, shouldPlay, oldReactions, reactions]);
});
return (): void => {
sub.unsubscribe();
};
}, [vm, audioEngineRef]);
return null;
}