PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix crash on login when using social login

Browse source 
We weren't passing a matrix client through, and the peg wasn't set at this point. Just need to thread it through to the media endpoints.

Fixes https://github.com/vector-im/element-web/issues/16765
This commit is contained in:
Travis Ralston 2021-03-25 22:22:43 -06:00
parent 318db15e35
commit 8bc2356fd0
2 changed files with 19 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/views/elements/SSOButtons.tsx
View file

@ -73,7 +73,7 @@ const SSOButton: React.FC<ISSOButtonProps> = ({
brandClass = `mx_SSOButton_brand_${brandName}`; brandClass = `mx_SSOButton_brand_${brandName}`;
icon = <img src={brandIcon} height="24" width="24" alt={brandName} />; icon = <img src={brandIcon} height="24" width="24" alt={brandName} />;
} else if (typeof idp?.icon === "string" && idp.icon.startsWith("mxc://")) { } else if (typeof idp?.icon === "string" && idp.icon.startsWith("mxc://")) {
const src = mediaFromMxc(idp.icon).getSquareThumbnailHttp(24); const src = mediaFromMxc(idp.icon, matrixClient).getSquareThumbnailHttp(24);
icon = <img src={src} height="24" width="24" alt={idp.name} />; icon = <img src={src} height="24" width="24" alt={idp.name} />;
} }

27
src/customisations/Media.ts
View file

@ -17,6 +17,7 @@
import {MatrixClientPeg} from "../MatrixClientPeg"; import {MatrixClientPeg} from "../MatrixClientPeg";
import {IMediaEventContent, IPreparedMedia, prepEventContentAsMedia} from "./models/IMediaEventContent"; import {IMediaEventContent, IPreparedMedia, prepEventContentAsMedia} from "./models/IMediaEventContent";
import {ResizeMethod} from "../Avatar"; import {ResizeMethod} from "../Avatar";
import {MatrixClient} from "matrix-js-sdk/src/client";
// Populate this class with the details of your customisations when copying it. // Populate this class with the details of your customisations when copying it.
@ -30,8 +31,14 @@ import {ResizeMethod} from "../Avatar";
* "thumbnail media", derived from event contents or external sources. * "thumbnail media", derived from event contents or external sources.
*/ */
export class Media { export class Media {
private client: MatrixClient;
// Per above, this constructor signature can be whatever is helpful for you. // Per above, this constructor signature can be whatever is helpful for you.
constructor(private prepared: IPreparedMedia) { constructor(private prepared: IPreparedMedia, client?: MatrixClient) {
this.client = client ?? MatrixClientPeg.get();
if (!this.client) {
throw new Error("No possible MatrixClient for media resolution. Please provide one or log in.");
}
} }
/** /**
@ -67,7 +74,7 @@ export class Media {
* The HTTP URL for the source media. * The HTTP URL for the source media.
*/ */
public get srcHttp(): string { public get srcHttp(): string {
return MatrixClientPeg.get().mxcUrlToHttp(this.srcMxc); return this.client.mxcUrlToHttp(this.srcMxc);
} }
/** /**
@ -76,7 +83,7 @@ export class Media {
*/ */
public get thumbnailHttp(): string | undefined | null { public get thumbnailHttp(): string | undefined | null {
if (!this.hasThumbnail) return null; if (!this.hasThumbnail) return null;
return MatrixClientPeg.get().mxcUrlToHttp(this.thumbnailMxc); return this.client.mxcUrlToHttp(this.thumbnailMxc);
} }
/** /**
@ -89,7 +96,7 @@ export class Media {
*/ */
public getThumbnailHttp(width: number, height: number, mode: ResizeMethod = "scale"): string | null | undefined { public getThumbnailHttp(width: number, height: number, mode: ResizeMethod = "scale"): string | null | undefined {
if (!this.hasThumbnail) return null; if (!this.hasThumbnail) return null;
return MatrixClientPeg.get().mxcUrlToHttp(this.thumbnailMxc, width, height, mode); return this.client.mxcUrlToHttp(this.thumbnailMxc, width, height, mode);
} }
/** /**
@ -100,7 +107,7 @@ export class Media {
* @returns {string} The HTTP URL which points to the thumbnail. * @returns {string} The HTTP URL which points to the thumbnail.
*/ */
public getThumbnailOfSourceHttp(width: number, height: number, mode: ResizeMethod = "scale"): string { public getThumbnailOfSourceHttp(width: number, height: number, mode: ResizeMethod = "scale"): string {
return MatrixClientPeg.get().mxcUrlToHttp(this.srcMxc, width, height, mode); return this.client.mxcUrlToHttp(this.srcMxc, width, height, mode);
} }
/** /**
@ -128,17 +135,19 @@ export class Media {
/** /**
* Creates a media object from event content. * Creates a media object from event content.
* @param {IMediaEventContent} content The event content. * @param {IMediaEventContent} content The event content.
* @param {MatrixClient} client? Optional client to use.
* @returns {Media} The media object. * @returns {Media} The media object.
*/ */
export function mediaFromContent(content: IMediaEventContent): Media { export function mediaFromContent(content: IMediaEventContent, client?: MatrixClient): Media {
return new Media(prepEventContentAsMedia(content)); return new Media(prepEventContentAsMedia(content), client);
} }
/** /**
* Creates a media object from an MXC URI. * Creates a media object from an MXC URI.
* @param {string} mxc The MXC URI. * @param {string} mxc The MXC URI.
* @param {MatrixClient} client? Optional client to use.
* @returns {Media} The media object. * @returns {Media} The media object.
*/ */
export function mediaFromMxc(mxc: string): Media { export function mediaFromMxc(mxc: string, client?: MatrixClient): Media {
return mediaFromContent({url: mxc}); return mediaFromContent({url: mxc}, client);
} }