Matrix/element-call-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-call.git synced 2026-06-06 11:45:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix footer stories

Browse Source
This commit is contained in:
Robin
2026-06-02 11:14:47 +02:00
parent 5fed562db2
commit cec78a383d
3 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/CallFooter.stories.tsx
View File

@@ -17,6 +17,9 @@ import { useStaticViewModel } from "../state/ViewModel";
import { ReactionsSenderContext } from "../reactions/useReactionsSender"; import { ReactionsSenderContext } from "../reactions/useReactionsSender";
import { type ReactionOption } from "../reactions"; import { type ReactionOption } from "../reactions";
import { type GridMode } from "../state/CallViewModel/CallViewModel"; import { type GridMode } from "../state/CallViewModel/CallViewModel";
import { MediaDevicesContext } from "../MediaDevicesContext";
import { MediaDevices } from "../state/MediaDevices";
import { globalScope } from "../state/ObservableScope";
// consts for tests // consts for tests
const reactionIdentifier = "@user:example.com:DEVICE"; const reactionIdentifier = "@user:example.com:DEVICE";
const reactionData = { const reactionData = {
@@ -24,6 +27,8 @@ const reactionData = {
reactions$: new BehaviorSubject({}), reactions$: new BehaviorSubject({}),
}; };
const mediaDevices = new MediaDevices(globalScope);
/** /**
* A wrapper component that is used for: * A wrapper component that is used for:
* - exposing the snapshot via props so the storybook documents the snapshot properties (basically unpack them form the vm) * - exposing the snapshot via props so the storybook documents the snapshot properties (basically unpack them form the vm)
@@ -41,17 +46,19 @@ function CallFooterStoryWrapper({
}): ReactNode { }): ReactNode {
const vm = useStaticViewModel(vmSnapshot); const vm = useStaticViewModel(vmSnapshot);
return ( return (
<div className={inCallViewStyles.inRoom}> <MediaDevicesContext value={mediaDevices}>
<ReactionsSenderContext <div className={inCallViewStyles.inRoom}>
value={{ <ReactionsSenderContext
supportsReactions: false, value={{
toggleRaisedHand: async () => Promise.resolve(), supportsReactions: false,
sendReaction: async (reaction: ReactionOption) => Promise.resolve(), toggleRaisedHand: async () => Promise.resolve(),
}} sendReaction: async (reaction: ReactionOption) => Promise.resolve(),
> }}
<CallFooter vm={vm} /> >
</ReactionsSenderContext> <CallFooter vm={vm} />
</div> </ReactionsSenderContext>
</div>
</MediaDevicesContext>
); );
} }

2
src/components/MediaMuteAndSwitchButton.tsx
View File

@@ -73,7 +73,7 @@ export const MediaMuteAndSwitchButton: FC<MediaMuteAndSwitchButtonProps> = ({
const devices = useMediaDevices(); const devices = useMediaDevices();
useEffect(() => { useEffect(() => {
if (menuOpen) devices.requestDeviceNames(); if (menuOpen) devices.requestDeviceNames(); // No-op after the first call
}, [menuOpen, devices]); }, [menuOpen, devices]);
let button; let button;

2
src/settings/SettingsModal.tsx
View File

@@ -100,7 +100,7 @@ export const SettingsModal: FC<Props> = ({
const devices = useMediaDevices(); const devices = useMediaDevices();
useEffect(() => { useEffect(() => {
if (open) devices.requestDeviceNames(); if (open) devices.requestDeviceNames(); // No-op after the first call
}, [open, devices]); }, [open, devices]);
const [soundVolume, setSoundVolume] = useSetting(soundEffectVolumeSetting); const [soundVolume, setSoundVolume] = useSetting(soundEffectVolumeSetting);