Patch the UserProfileModal component instead of injecting badges when the modal is opened
This commit is contained in:
parent
0944c0708f
commit
1e643b8164
|
@ -9,12 +9,10 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bd-profile-badges-wrap">
|
<div class="bd-profile-badges">
|
||||||
<div class="bd-profile-badges">
|
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
||||||
<div v-if="developer" v-tooltip="'BetterDiscord Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
||||||
<div v-else-if="webdev" v-tooltip="'BetterDiscord Web Developer'" class="bd-profile-badge bd-profile-badge-developer" @click="click"></div>
|
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="click"></div>
|
||||||
<div v-else-if="contributor" v-tooltip="'BetterDiscord Contributor'" class="bd-profile-badge bd-profile-badge-contributor" @click="click"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
import { shell } from 'electron';
|
import { shell } from 'electron';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: ['webdev', 'developer', 'contributor', 'hasBadges'],
|
props: ['webdev', 'developer', 'contributor'],
|
||||||
methods: {
|
methods: {
|
||||||
click() {
|
click() {
|
||||||
if (this.developer) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');
|
if (this.developer) return shell.openExternal('https://github.com/JsSucks/BetterDiscordApp');
|
||||||
|
|
|
@ -176,26 +176,59 @@ export default class extends Module {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Patches UserProfileModal to inject profile badges into the modal once opened.
|
* Patches UserProfileModal to render profile badges.
|
||||||
* TODO: just patch the modal component
|
|
||||||
*/
|
*/
|
||||||
async patchUserProfileModal() {
|
async patchUserProfileModal() {
|
||||||
const UserProfileModal = WebpackModules.getModuleByName('UserProfileModal');
|
this.UserProfileModal = await ReactComponents.getComponent('UserProfileModal');
|
||||||
|
this.unpatchUserProfileModal = MonkeyPatch('ProfileBadges', this.UserProfileModal.component.prototype).after('renderBadges', (component, args, retVal, setRetVal) => {
|
||||||
|
|
||||||
MonkeyPatch('BdUI', UserProfileModal).after('open', async (context, [userid]) => {
|
const user = ReactHelpers.findProp(component, 'user');
|
||||||
const c = contributors.find(c => c.id === userid);
|
if (!user) return;
|
||||||
|
const c = contributors.find(c => c.id === user.id);
|
||||||
if (!c) return;
|
if (!c) return;
|
||||||
|
|
||||||
const root = await Utils.until(() => document.querySelector('[class*="headerInfo"]'));
|
const element = ReactHelpers.React.createElement('span', {
|
||||||
const el = DOM.createElement('div', null, 'bdprofilebadges');
|
className: 'bd-profile-badges',
|
||||||
root.insertBefore(el.element, root.firstChild.nextSibling);
|
'data-userid': user.id
|
||||||
|
});
|
||||||
|
|
||||||
this.injectProfileBadge(userid, el.element);
|
if (!retVal) {
|
||||||
|
setRetVal(ReactHelpers.React.createElement('div', {
|
||||||
|
className: 'bd-profile-badges-wrap',
|
||||||
|
children: element
|
||||||
|
}));
|
||||||
|
} else retVal.props.children.splice(0, 0, element);
|
||||||
|
});
|
||||||
|
|
||||||
|
this.UserProfileModal.component.prototype.componentDidMount = this.UserProfileModal.component.prototype.componentDidMount || (() => {});
|
||||||
|
this.unpatchUserProfileModalMount = MonkeyPatch('ProfileBadges', this.UserProfileModal.component.prototype).after('componentDidMount', component => {
|
||||||
|
const element = ReactHelpers.ReactDOM.findDOMNode(component);
|
||||||
|
if (!element) return;
|
||||||
|
this.injectProfileBadges(element);
|
||||||
|
});
|
||||||
|
|
||||||
|
this.UserProfileModal.component.prototype.componentDidUpdate = this.UserProfileModal.component.prototype.componentDidUpdate || (() => {});
|
||||||
|
this.unpatchUserProfileModalUpdate = MonkeyPatch('ProfileBadges', this.UserProfileModal.component.prototype).after('componentDidUpdate', component => {
|
||||||
|
const element = ReactHelpers.ReactDOM.findDOMNode(component);
|
||||||
|
if (!element) return;
|
||||||
|
this.injectProfileBadges(element);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
injectProfileBadge(userid, root) {
|
injectProfileBadges(element) {
|
||||||
const c = contributors.find(c => c.id === userid);
|
for (const beo of element.getElementsByClassName('bd-profile-badges'))
|
||||||
|
this.injectProfileBadge(beo);
|
||||||
|
}
|
||||||
|
|
||||||
|
injectProfileBadge(root) {
|
||||||
|
while (root.firstChild) {
|
||||||
|
root.removeChild(root.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
const { userid } = root.dataset;
|
||||||
|
if (!userid) return;
|
||||||
|
|
||||||
|
const c = contributors.find(c => c.id == userid);
|
||||||
if (!c) return;
|
if (!c) return;
|
||||||
|
|
||||||
VueInjector.inject(root, {
|
VueInjector.inject(root, {
|
||||||
|
|
Loading…
Reference in New Issue