oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-08-14 10:00:53 +00:00
Code Wiki Activity

4.53.0

Browse source 
* Added: Setting to hide streams in the directory based upon tags.
* Added: Setting to not automatically join raids to specific channels.
* Added: Setting to attempt to display Golden Kappa Trains when Hype Trains are otherwise hidden.
* Added: Settings profile filter rule for when the window is in fullscreen.
* Fixed: Do not activate theater mode settings when in fullscreen.
* API Added: The `site.player` module now has a `getUptime` method for getting the uptime of the current stream, if one is available.
* API Removed: The tag-related methods of `site.twitch_data`, aside from `getMatchingTags` which now has a different signature. The methods were non-functional due to Twitch removing the relevant endpoints.
* Developer: Added a debugging tool for viewing GraphQL queries in Apollo's cache.
* Maintenance: Tweak the webpack build to hopefully get Mozilla to stop complaining that their build environment is weird while accusing me of having the weird build environment.
This commit is contained in:
SirStendec 2023-09-13 16:08:10 -04:00
parent 8ac95f3a52
commit 92fcc853a6
26 changed files with 665 additions and 403 deletions
Download patch file Download diff file Expand all files Collapse all files

160
src/modules/main_menu/components/graphql-inspect.vue Normal file
View file

@ -0,0 +1,160 @@
<template>
<div class="ffz--graphql-inspector">
<div class="tw-flex tw-align-items-start">
<label for="selector" class="tw-mg-y-05">
{{ t('debug.graphql.query', 'Query:') }}
</label>
<div class="tw-flex tw-flex-column tw-mg-l-05 tw-full-width">
<select
id="selector"
ref="selector"
class="tw-full-width tw-border-top-left-radius-medium tw-border-top-right-radius-medium tw-font-size-6 ffz-select tw-pd-l-1 tw-pd-r-3 tw-pd-y-05"
@change="onSelectChange"
>
<option
v-for="(query, idx) in queries"
:key="query.name"
:selected="current === query"
:value="idx"
>
{{ query.name }}
</option>
</select>
</div>
</div>
<div v-if="current" class="ffz--example-report">
<div class="tw-mg-t-1 tw-c-background-alt-2 tw-font-size-5 tw-pd-y-05 tw-pd-x-1 tw-border-radius-large">
<code>{{ current.source }}</code>
</div>
</div>
<div v-if="current && current.variables" class="tw-mg-t-1">
<div v-html="highlightJson(current.variables)" />
</div>
<div v-if="current && current.result" class="ffz--example-report ffz--tall">
<div class="tw-mg-t-1 tw-c-background-alt-2 tw-font-size-5 tw-pd-y-05 tw-pd-x-1 tw-border-radius-large">
<code v-html="highlightJson(current.result, true)" />
</div>
</div>
</div>
</template>
<script>
import { highlightJson } from 'utilities/dom';
import { deep_copy } from 'utilities/object';
const BAD_KEYS = [
'kind',
'definitions',
'loc'
];
export default {
props: ['item', 'context'],
data() {
return {
has_client: false,
has_printer: false,
queryMap: {},
current: null
}
},
computed: {
queries() {
const queries = Object.values(this.queryMap);
queries.sort((a,b) => a.name.localeCompare(b.name));
return queries;
}
},
created() {
this.ffz = this.item.getFFZ();
this.client = this.ffz.resolve('site.apollo')?.client;
this.has_client = !! this.client;
this.printer = this.ffz.resolve('site.web_munch')?.getModule?.('gql-printer');
this.has_printer = !! this.printer;
},
beforeDestroy() {
this.client = null;
this.ffz = null;
this.has_client = false;
},
mounted() {
this.updateQueries();
},
methods: {
updateQueries() {
if ( ! this.client )
return;
const map = this.client.queryManager?.queries;
if ( ! map || ! map.values )
return;
for(const query of map.values()) {
if ( ! query?.document )
continue;
let name = guessNameFromDocument(query.document);
if ( ! name )
name = query.observableQuery?.queryName;
if ( ! this.queryMap[name] )
this.$set(this.queryMap, name, {
id: query.queryId,
name,
source: this.printQuery(query.document),
variables: null,
result: null
});
this.queryMap[name].variables = deep_copy(query.observableQuery?.variables);
this.queryMap[name].result = deep_copy(query.observableQuery?.lastResult?.data ?? null);
}
if ( ! this.current )
this.current = Object.values(this.queries)[0];
},
highlightJson(object, pretty) {
return highlightJson(object, pretty);
},
printQuery(doc) {
if ( this.printer )
try {
return this.printer(doc);
} catch(err) {
this.ffz.log.warn('Unable to print GQL using gql-printer.', err);
}
return doc.loc?.source?.body;
},
onSelectChange() {
const idx = this.$refs.selector.value,
item = this.queries[idx];
this.current = item;
}
}
}
function guessNameFromDocument(doc) {
const keys = Object.keys(doc).filter(key => ! BAD_KEYS.includes(key));
if ( keys.length === 1 )
return keys[0];
}
</script>