Add the ability to filter text from game names

src/modules/main_menu/components/basic-terms.vue

@@ -6,6 +6,7 @@
 			:words="item.words"
 			:removable="item.removable"
 			:adding="true"
+			:text_only="item.text_only"
 			@save="new_term"
 		/>
 		<div v-if="! val.length || val.length === 1 && hasInheritance" class="tw-mg-t-05 tw-c-text-alt-2 tw-font-size-4 tw-align-center tw-c-text-alt-2 tw-pd-05">
@@ -19,6 +20,7 @@
 				:colored="item.colored"
 				:words="item.words"
 				:removable="item.removable"
+				:text_only="item.text_only"
 				@remove="remove(term)"
 				@save="save(term, $event)"
 			/>
@@ -35,7 +37,14 @@ let last_id = 0;
 
 export default {
 	mixins: [SettingMixin],
-	props: ['item', 'context'],
+	props: {
+		item: Object,
+		context: Object,
+		text_only: {
+			type: Boolean,
+			default: false
+		}
+	},
 
 	data() {
 		return {

src/modules/main_menu/components/term-editor.vue

@@ -35,7 +35,7 @@
 					</figure>
 				</div>
 			</div>
-			<div class="tw-flex-shrink-0 tw-mg-x-05">
+			<div v-if="! text_only" class="tw-flex-shrink-0 tw-mg-x-05">
 				<span v-if="! editing">{{ term_type }}</span>
 				<select
 					v-else
@@ -56,6 +56,7 @@
 					</option>
 				</select>
 			</div>
+			<div v-else class="tw-mg-r-1" />
 			<div v-if="removable" class="tw-flex-shrink-0 tw-mg-r-05 tw-relative tw-tooltip-wrapper">
 				<button
 					v-if="editing"
@@ -160,6 +161,10 @@ export default {
 		adding: {
 			type: Boolean,
 			default: false
+		},
+		text_only: {
+			type: Boolean,
+			default: false
 		}
 	},
 

src/sites/twitch-twilight/modules/directory/game.jsx

@@ -38,6 +38,16 @@ export default class Game extends SiteModule {
 			default: [],
 			onUIChange: () => this.parent.updateCards()
 		});
+
+		this.settings.addUI('directory.game.filtered-text', {
+			ui: {
+				path: 'Directory > Categories >> Filtered Text',
+				component: 'basic-terms',
+				text_only: true,
+				onUIChange: () => this.parent.updateCards()
+			},
+			default: [],
+		});
 	}
 
 	onEnable() {
@@ -51,7 +61,7 @@ export default class Game extends SiteModule {
 		});
 
 		this.settings.provider.on('changed', key => {
-			if ( key === 'directory.game.blocked-games' || key === 'directory.game.hidden-thumbnails' ) {
+			if ( key === 'directory.game.blocked-games' || key === 'directory.game.hidden-thumbnails' || key === 'directory.game.filtered-text' ) {
 				this.parent.updateCards();
 
 				for(const inst of this.GameHeader.instances)

src/sites/twitch-twilight/modules/directory/index.jsx

@@ -336,6 +336,19 @@ export default class Directory extends SiteModule {
 
 		let bad_tag = false;
 
+		if (typeof game === 'string' || game instanceof String) {
+			const filtered_text = this.settings.profile(0).get('directory.game.filtered-text', []);
+			filtered_text.forEach(text => {
+				text = text.v.v;
+				if (game.includes(text)) {
+					const matchingElement = document.evaluate(`.//*[text()="${game}"]`, el, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
+					if (matchingElement) {
+						matchingElement.innerText = game.replaceAll(text, "");;
+					}
+				}
+			});
+		}
+
 		el.classList.toggle('ffz-hide-thumbnail', this.settings.provider.get('directory.game.hidden-thumbnails', []).includes(game));
 		el.dataset.ffzType = props.streamType;
 

src/sites/twitch-twilight/modules/layout.js

@@ -201,7 +201,7 @@ export default class Layout extends Module {
 
 		this.on('site.directory:update-cards', () => {
 			for(const inst of this.SideBarChannels.instances)
-				this.updateCardClass(inst);
+				this.updateCard(inst);
 		});
 
 		this.ResizeDetector.ready(() => {
@@ -213,11 +213,11 @@ export default class Layout extends Module {
 
 		this.SideBarChannels.ready((cls, instances) => {
 			for(const inst of instances)
-				this.updateCardClass(inst);
+				this.updateCard(inst);
 		});
 
-		this.SideBarChannels.on('mount', this.updateCardClass, this);
+		this.SideBarChannels.on('mount', this.updateCard, this);
-		this.SideBarChannels.on('update', this.updateCardClass, this);
+		this.SideBarChannels.on('update', this.updateCard, this);
 
 		/*const t = this;
 		this.RightColumn.ready((cls, instances) => {
@@ -291,7 +291,7 @@ export default class Layout extends Module {
 		return this.settings.get('layout.is-minimal')
 	}
 
-	updateCardClass(inst) {
+	updateCard(inst) {
 		const node = this.fine.getChildNode(inst);
 
 		if ( node ) {
@@ -304,6 +304,19 @@ export default class Layout extends Module {
 
 			const game = inst.props?.tooltipContent?.props?.gameName || inst.props?.metadataLeft?.props?.activity?.stream?.game?.name || inst.props?.metadataLeft;
 			node.classList.toggle('tw-hide', this.settings.provider.get('directory.game.blocked-games', []).includes(game));
+
+			if (typeof game === 'string' || game instanceof String) {
+				const filtered_text = this.settings.profile(0).get('directory.game.filtered-text', []);
+				filtered_text.forEach(text => {
+					text = text.v.v;
+					if (game.includes(text)) {
+						const matchingElement = document.evaluate(`.//*[text()="${game}"]`, node, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
+						if (matchingElement) {
+							matchingElement.innerText = game.replaceAll(text, "");;
+						}
+					}
+				});
+			}
 		}
 	}