Merge branch 'develop' of https://github.com/element-hq/matrix-react-sdk into langleyd/mobile_registeration

This commit is contained in:
David Langley
2024-09-16 13:46:33 +01:00
14 changed files with 272 additions and 27 deletions

View File

@@ -20,6 +20,7 @@ import { logger } from "matrix-js-sdk/src/logger";
import getEntryComponentForLoginType, {
ContinueKind,
CustomAuthType,
IStageComponent,
} from "../views/auth/InteractiveAuthEntryComponents";
import Spinner from "../views/elements/Spinner";
@@ -75,11 +76,11 @@ export interface InteractiveAuthProps<T> {
// Called when the stage changes, or the stage's phase changes. First
// argument is the stage, second is the phase. Some stages do not have
// phases and will be counted as 0 (numeric).
onStagePhaseChange?(stage: AuthType | null, phase: number): void;
onStagePhaseChange?(stage: AuthType | CustomAuthType | null, phase: number): void;
}
interface IState {
authStage?: AuthType;
authStage?: CustomAuthType | AuthType;
stageState?: IStageStatus;
busy: boolean;
errorText?: string;

View File

@@ -11,6 +11,8 @@ import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { AuthType, AuthDict, IInputs, IStageStatus } from "matrix-js-sdk/src/interactive-auth";
import { logger } from "matrix-js-sdk/src/logger";
import React, { ChangeEvent, createRef, FormEvent, Fragment } from "react";
import { Button, Text } from "@vector-im/compound-web";
import PopOutIcon from "@vector-im/compound-design-tokens/assets/web/icons/pop-out";
import EmailPromptIcon from "../../../../res/img/element-icons/email-prompt.svg";
import { _t } from "../../../languageHandler";
@@ -21,6 +23,7 @@ import AccessibleButton, { AccessibleButtonKind, ButtonEvent } from "../elements
import Field from "../elements/Field";
import Spinner from "../elements/Spinner";
import CaptchaForm from "./CaptchaForm";
import { Flex } from "../../utils/Flex";
/* This file contains a collection of components which are used by the
* InteractiveAuth to prompt the user to enter the information needed
@@ -905,11 +908,11 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
}
}
export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
private popupWindow: Window | null;
private fallbackButton = createRef<HTMLButtonElement>();
export class FallbackAuthEntry<T = {}> extends React.Component<IAuthEntryProps & T> {
protected popupWindow: Window | null;
protected fallbackButton = createRef<HTMLButtonElement>();
public constructor(props: IAuthEntryProps) {
public constructor(props: IAuthEntryProps & T) {
super(props);
// we have to make the user click a button, as browsers will block
@@ -967,6 +970,50 @@ export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
}
}
export enum CustomAuthType {
// Workaround for MAS requiring non-UIA authentication for resetting cross-signing.
MasCrossSigningReset = "org.matrix.cross_signing_reset",
}
export class MasUnlockCrossSigningAuthEntry extends FallbackAuthEntry<{
stageParams?: {
url?: string;
};
}> {
public static LOGIN_TYPE = CustomAuthType.MasCrossSigningReset;
private onGoToAccountClick = (): void => {
if (!this.props.stageParams?.url) return;
this.popupWindow = window.open(this.props.stageParams.url, "_blank");
};
private onRetryClick = (): void => {
this.props.submitAuthDict({});
};
public render(): React.ReactNode {
return (
<div>
<Text>{_t("auth|uia|mas_cross_signing_reset_description")}</Text>
<Flex gap="var(--cpd-space-4x)">
<Button
Icon={PopOutIcon}
onClick={this.onGoToAccountClick}
autoFocus
kind="primary"
className="mx_Dialog_nonDialogButton"
>
{_t("auth|uia|mas_cross_signing_reset_cta")}
</Button>
<Button onClick={this.onRetryClick} kind="secondary" className="mx_Dialog_nonDialogButton">
{_t("action|retry")}
</Button>
</Flex>
</div>
);
}
}
export interface IStageComponentProps extends IAuthEntryProps {
stageParams?: Record<string, any>;
inputs?: IInputs;
@@ -983,8 +1030,10 @@ export interface IStageComponent extends React.ComponentClass<React.PropsWithRef
focus?(): void;
}
export default function getEntryComponentForLoginType(loginType: AuthType): IStageComponent {
export default function getEntryComponentForLoginType(loginType: AuthType | CustomAuthType): IStageComponent {
switch (loginType) {
case CustomAuthType.MasCrossSigningReset:
return MasUnlockCrossSigningAuthEntry;
case AuthType.Password:
return PasswordAuthEntry;
case AuthType.Recaptcha:

View File

@@ -24,19 +24,22 @@ import { ReadPinsEventId } from "../components/views/right_panel/types";
import { useMatrixClientContext } from "../contexts/MatrixClientContext";
import { useAsyncMemo } from "./useAsyncMemo";
import PinningUtils from "../utils/PinningUtils";
import { batch } from "../utils/promise.ts";
/**
* Get the pinned event IDs from a room.
* The number of pinned events is limited to 100.
* @param room
*/
function getPinnedEventIds(room?: Room): string[] {
return (
const eventIds: string[] =
room
?.getLiveTimeline()
.getState(EventTimeline.FORWARDS)
?.getStateEvents(EventType.RoomPinnedEvents, "")
?.getContent()?.pinned ?? []
);
?.getContent()?.pinned ?? [];
// Limit the number of pinned events to 100
return eventIds.slice(0, 100);
}
/**
@@ -173,12 +176,11 @@ export function useFetchedPinnedEvents(room: Room, pinnedEventIds: string[]): Ar
const cli = useMatrixClientContext();
return useAsyncMemo(
() =>
Promise.all(
pinnedEventIds.map(
async (eventId): Promise<MatrixEvent | null> => fetchPinnedEvent(room, eventId, cli),
),
),
() => {
const fetchPromises = pinnedEventIds.map((eventId) => () => fetchPinnedEvent(room, eventId, cli));
// Fetch the pinned events in batches of 10
return batch(fetchPromises, 10);
},
[cli, room, pinnedEventIds],
null,
);

View File

@@ -29,7 +29,7 @@ import { MatrixClient, MatrixError } from "matrix-js-sdk/src/matrix";
*/
export const useUserTimezone = (cli: MatrixClient, userId: string): { timezone: string; friendly: string } | null => {
const [timezone, setTimezone] = useState<string>();
const [updateInterval, setUpdateInterval] = useState<number>();
const [updateInterval, setUpdateInterval] = useState<ReturnType<typeof setTimeout>>();
const [friendly, setFriendly] = useState<string>();
const [supported, setSupported] = useState<boolean>();

View File

@@ -370,6 +370,8 @@
"email_resend_prompt": "Did not receive it? <a>Resend it</a>",
"email_resent": "Resent!",
"fallback_button": "Start authentication",
"mas_cross_signing_reset_cta": "Go to your account",
"mas_cross_signing_reset_description": "Reset your identity through your account provider and then come back and click “Retry”.",
"msisdn": "A text message has been sent to %(msisdn)s",
"msisdn_token_incorrect": "Token incorrect",
"msisdn_token_prompt": "Please enter the code it contains:",

View File

@@ -1968,8 +1968,6 @@
"few": "%(count)s osoby proszą o dołączenie",
"many": "%(count)s osób prosi o dołączenie"
},
"release_announcement_description": "Ciesz się prostszym, bardziej przystosowanym nagłówkiem pokoju.",
"release_announcement_header": "Nowy design!",
"room_is_public": "Ten pokój jest publiczny",
"show_widgets_button": "Pokaż widżety",
"video_call_button_ec": "Rozmowa wideo (%(brand)s)",

View File

@@ -40,3 +40,18 @@ export async function retry<T, E extends Error>(
}
throw lastErr;
}
/**
* Batch promises into groups of a given size.
* Execute the promises in parallel, but wait for all promises in a batch to resolve before moving to the next batch.
* @param funcs - The promises to batch
* @param batchSize - The number of promises to execute in parallel
*/
export async function batch<T>(funcs: Array<() => Promise<T>>, batchSize: number): Promise<T[]> {
const results: T[] = [];
for (let i = 0; i < funcs.length; i += batchSize) {
const batch = funcs.slice(i, i + batchSize);
results.push(...(await Promise.all(batch.map((f) => f()))));
}
return results;
}