OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Wait for initial profile load before displaying widget (#7556) 

* wait for initial profile load before displaying jitsi

Signed-off-by: Kerry Archibald <kerrya@element.io>

* update comment

Signed-off-by: Kerry Archibald <kerrya@element.io>

* amke fn return boolean

Signed-off-by: Kerry Archibald <kerrya@element.io>

* listen for profile update once

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove unneccessary check

Signed-off-by: Kerry Archibald <kerrya@element.io>
pull/21833/head
Kerry 2022-01-17 14:47:07 +01:00 committed by GitHub
parent 1f298250b9
commit 42adedc468
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/views/elements/AppTile.tsx
View File

@ -44,6 +44,8 @@ import { replaceableComponent } from "../../../utils/replaceableComponent";
import CallHandler from '../../../CallHandler';
import { IApp } from "../../../stores/WidgetStore";
import { WidgetLayoutStore, Container } from "../../../stores/widgets/WidgetLayoutStore";
import { OwnProfileStore } from '../../../stores/OwnProfileStore';
import { UPDATE_EVENT } from '../../../stores/AsyncStore';
interface IProps {
app: IApp;
@ -87,6 +89,8 @@ interface IState {
// Assume that widget has permission to load if we are the user who
// added it to the room, or if explicitly granted by the user
hasPermissionToLoad: boolean;
// Wait for user profile load to display correct name
isUserProfileReady: boolean;
error: Error;
menuDisplayed: boolean;
widgetPageTitle: string;
@ -130,10 +134,22 @@ export default class AppTile extends React.Component<IProps, IState> {
}
this.state = this.getNewState(props);
this.watchUserReady();
this.allowedWidgetsWatchRef = SettingsStore.watchSetting("allowedWidgets", null, this.onAllowedWidgetsChange);
}
private watchUserReady = () => {
if (OwnProfileStore.instance.isProfileInfoFetched) {
return;
}
OwnProfileStore.instance.once(UPDATE_EVENT, this.onUserReady);
};
private onUserReady = (): void => {
this.setState({ isUserProfileReady: true });
};
// This is a function to make the impact of calling SettingsStore slightly less
private hasPermissionToLoad = (props: IProps): boolean => {
if (this.usingLocalWidget()) return true;
@ -160,6 +176,7 @@ export default class AppTile extends React.Component<IProps, IState> {
// Assume that widget has permission to load if we are the user who
// added it to the room, or if explicitly granted by the user
hasPermissionToLoad: this.hasPermissionToLoad(newProps),
isUserProfileReady: OwnProfileStore.instance.isProfileInfoFetched,
error: null,
menuDisplayed: false,
widgetPageTitle: this.props.widgetPageTitle,
@ -220,6 +237,7 @@ export default class AppTile extends React.Component<IProps, IState> {
}
SettingsStore.unwatchSetting(this.allowedWidgetsWatchRef);
OwnProfileStore.instance.removeListener(UPDATE_EVENT, this.onUserReady);
}
private resetWidget(newProps: IProps): void {
@ -473,7 +491,7 @@ export default class AppTile extends React.Component<IProps, IState> {
/>
</div>
);
} else if (this.state.initialising) {
} else if (this.state.initialising || !this.state.isUserProfileReady) {
appTileBody = (
<div className={appTileBodyClass + (this.state.loading ? 'mx_AppLoading' : '')} style={appTileBodyStyles}>
{ loadingElement }

12
src/stores/OwnProfileStore.ts
View File

@ -28,6 +28,7 @@ import { mediaFromMxc } from "../customisations/Media";
interface IState {
displayName?: string;
avatarUrl?: string;
fetchedAt?: number;
}
const KEY_DISPLAY_NAME = "mx_profile_displayname";
@ -67,6 +68,10 @@ export class OwnProfileStore extends AsyncStoreWithClient<IState> {
}
}
public get isProfileInfoFetched(): boolean {
return !!this.state.fetchedAt;
}
/**
* Gets the MXC URI of the user's avatar, or null if not present.
*/
@ -135,7 +140,12 @@ export class OwnProfileStore extends AsyncStoreWithClient<IState> {
} else {
window.localStorage.removeItem(KEY_AVATAR_URL);
}
await this.updateState({ displayName: profileInfo.displayname, avatarUrl: profileInfo.avatar_url });
await this.updateState({
displayName: profileInfo.displayname,
avatarUrl: profileInfo.avatar_url,
fetchedAt: Date.now(),
});
};
private onStateEvents = throttle(async (ev: MatrixEvent) => {