mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-25 08:30:58 -05:00
Update Typescript to 4.4.2.
Fix issues associated with new version.
This commit is contained in:
Paul
parent
7bd6348e9d
commit
0daaeef9d4
3 changed files with 95 additions and 74 deletions
|
|
@ -126,7 +126,7 @@
|
|||
"sass": "^1.35.1",
|
||||
"shade-blend-color": "^1.0.0",
|
||||
"styled-components": "^5.3.0",
|
||||
"typescript": "^4.3.2",
|
||||
"typescript": "^4.4.2",
|
||||
"ulid": "^2.3.0",
|
||||
"use-resize-observer": "^7.0.0",
|
||||
"vite-plugin-pwa": "^0.8.1",
|
||||
|
|
|
|||
|
|
@ -1,48 +1,58 @@
|
|||
import styles from "./Panes.module.scss";
|
||||
import { Text } from "preact-i18n";
|
||||
|
||||
import { connectState } from "../../../redux/connector";
|
||||
|
||||
import { voiceState, VoiceStatus } from "../../../lib/vortex/VoiceState";
|
||||
import { useEffect, useState } from "preact/hooks";
|
||||
|
||||
import { TextReact } from "../../../lib/i18n";
|
||||
import { stopPropagation } from "../../../lib/stopPropagation";
|
||||
import { voiceState } from "../../../lib/vortex/VoiceState";
|
||||
|
||||
import { connectState } from "../../../redux/connector";
|
||||
|
||||
import ComboBox from "../../../components/ui/ComboBox";
|
||||
import Overline from "../../../components/ui/Overline";
|
||||
import Tip from "../../../components/ui/Tip";
|
||||
import {useEffect, useState} from "preact/hooks";
|
||||
import { stopPropagation } from "../../../lib/stopPropagation";
|
||||
|
||||
|
||||
const constraints = { audio: true }
|
||||
const constraints = { audio: true };
|
||||
|
||||
export function Component() {
|
||||
const [mediaStream, setMediaStream] = useState<MediaStream|undefined>(undefined)
|
||||
const [mediaDevices, setMediaDevices] = useState<MediaDeviceInfo[] | undefined>(undefined);
|
||||
const [permission, setPermission] = useState<PermissionState | undefined>(undefined);
|
||||
const [error, setError] = useState<DOMException | undefined>(undefined)
|
||||
const [mediaStream, setMediaStream] = useState<MediaStream | undefined>(
|
||||
undefined,
|
||||
);
|
||||
const [mediaDevices, setMediaDevices] = useState<
|
||||
MediaDeviceInfo[] | undefined
|
||||
>(undefined);
|
||||
const [permission, setPermission] = useState<PermissionState | undefined>(
|
||||
undefined,
|
||||
);
|
||||
const [error, setError] = useState<DOMException | undefined>(undefined);
|
||||
|
||||
const askOrGetPermission = async () => {
|
||||
try {
|
||||
const mediaStream = await navigator.mediaDevices.getUserMedia(constraints)
|
||||
setMediaStream(mediaStream)
|
||||
const mediaStream = await navigator.mediaDevices.getUserMedia(
|
||||
constraints,
|
||||
);
|
||||
|
||||
setMediaStream(mediaStream);
|
||||
} catch (err) {
|
||||
// The user has blocked the permission
|
||||
setError(err)
|
||||
setError(err as DOMException);
|
||||
}
|
||||
|
||||
try {
|
||||
const { state } = await navigator.permissions.query({ name: 'microphone' })
|
||||
setPermission(state)
|
||||
const { state } = await navigator.permissions.query({
|
||||
// eslint-disable-next-line
|
||||
// @ts-ignore
|
||||
name: "microphone",
|
||||
});
|
||||
|
||||
setPermission(state);
|
||||
} catch (err) {
|
||||
// the browser might not support `query` functionnality
|
||||
setError(err);
|
||||
}
|
||||
setError(err as DOMException);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
askOrGetPermission()
|
||||
askOrGetPermission();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -50,22 +60,23 @@ export function Component() {
|
|||
return;
|
||||
}
|
||||
|
||||
navigator
|
||||
.mediaDevices
|
||||
.enumerateDevices()
|
||||
.then( devices => {
|
||||
setMediaDevices(devices)
|
||||
}, err => {
|
||||
setError(err)
|
||||
})
|
||||
navigator.mediaDevices.enumerateDevices().then(
|
||||
(devices) => {
|
||||
setMediaDevices(devices);
|
||||
},
|
||||
(err) => {
|
||||
setError(err as DOMException);
|
||||
},
|
||||
);
|
||||
}, [mediaStream]);
|
||||
|
||||
}, [mediaStream])
|
||||
|
||||
const handleAskForPermission = (ev: JSX.TargetedMouseEvent<HTMLAnchorElement>) => {
|
||||
stopPropagation(ev)
|
||||
setError(undefined)
|
||||
askOrGetPermission()
|
||||
}
|
||||
const handleAskForPermission = (
|
||||
ev: JSX.TargetedMouseEvent<HTMLAnchorElement>,
|
||||
) => {
|
||||
stopPropagation(ev);
|
||||
setError(undefined);
|
||||
askOrGetPermission();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
@ -75,45 +86,55 @@ export function Component() {
|
|||
</h3>
|
||||
<ComboBox
|
||||
value={window.localStorage.getItem("audioInputDevice") ?? 0}
|
||||
onChange={(e) => changeAudioDevice(e.currentTarget.value, "input")}>
|
||||
{
|
||||
mediaDevices?.filter(device => device.kind === "audioinput").map(device => {
|
||||
onChange={(e) =>
|
||||
changeAudioDevice(e.currentTarget.value, "input")
|
||||
}>
|
||||
{mediaDevices
|
||||
?.filter((device) => device.kind === "audioinput")
|
||||
.map((device) => {
|
||||
return (
|
||||
<option value={device.deviceId} key={device.deviceId}>
|
||||
{device.label || <Text id="app.settings.pages.audio.device_label_NA"/>}
|
||||
<option
|
||||
value={device.deviceId}
|
||||
key={device.deviceId}>
|
||||
{device.label || (
|
||||
<Text id="app.settings.pages.audio.device_label_NA" />
|
||||
)}
|
||||
</option>
|
||||
)
|
||||
})
|
||||
}
|
||||
);
|
||||
})}
|
||||
</ComboBox>
|
||||
{error && error.name === 'NotAllowedError' &&
|
||||
<Overline error="AudioPermissionBlock" type="error" block />}
|
||||
{error && error.name === "NotAllowedError" && (
|
||||
<Overline error="AudioPermissionBlock" type="error" block />
|
||||
)}
|
||||
|
||||
{error && permission === 'prompt' &&
|
||||
{error && permission === "prompt" && (
|
||||
<Tip>
|
||||
<TextReact id="app.settings.pages.audio.tip_retry" fields={{
|
||||
<TextReact
|
||||
id="app.settings.pages.audio.tip_retry"
|
||||
fields={{
|
||||
retryBtn: (
|
||||
<a onClick={handleAskForPermission}>
|
||||
<Text id="app.settings.pages.audio.button_retry" />
|
||||
</a>
|
||||
),
|
||||
}}/>
|
||||
}}
|
||||
/>
|
||||
</Tip>
|
||||
}
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function changeAudioDevice(deviceId: string, deviceType: string) {
|
||||
if(deviceType === "input") {
|
||||
window.localStorage.setItem("audioInputDevice", deviceId)
|
||||
if(voiceState.isProducing("audio")) {
|
||||
if (deviceType === "input") {
|
||||
window.localStorage.setItem("audioInputDevice", deviceId);
|
||||
if (voiceState.isProducing("audio")) {
|
||||
voiceState.stopProducing("audio");
|
||||
voiceState.startProducing("audio");
|
||||
}
|
||||
}else if(deviceType === "output") {
|
||||
window.localStorage.setItem("audioOutputDevice", deviceId)
|
||||
} else if (deviceType === "output") {
|
||||
window.localStorage.setItem("audioOutputDevice", deviceId);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4135,7 +4135,7 @@ type-fest@^0.20.2:
|
|||
resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
|
||||
integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
|
||||
|
||||
typescript@^4.3.2:
|
||||
typescript@^4.4.2:
|
||||
version "4.4.2"
|
||||
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.4.2.tgz#6d618640d430e3569a1dfb44f7d7e600ced3ee86"
|
||||
integrity sha512-gzP+t5W4hdy4c+68bfcv0t400HVJMMd2+H9B7gae1nQlBzCqvrXX+6GL/b3GAgyTH966pzrZ70/fRjwAtZksSQ==
|
||||
|
|
|
|||
Loading…
Reference in a new issue