bite the bullet and pass the cache around to all the places

Author: Stvad

src/resolver/url-match-pattern.ts

@@ -65,7 +65,7 @@ const URL_match_pattern: Resolver = {
 		const id = applicable[0].value
 		const ci = applicable[0].valueIsCaseInsensitive
 
-		return await this.getEntityByRegexedId(prop, id, ci)
+		return this.getEntityByRegexedId(prop, id, ci)
 	},
 	getEntityByRegexedId: async function(prop, id, ci = false) {
 		const cached = await this.checkIfCached(prop, id)
@@ -106,7 +106,7 @@ const URL_match_pattern: Resolver = {
 			cache.externalIDCache = {}
 		}
 		cache.externalIDCache[this.formCacheKey(prop, id)] = entityId
-		browser.storage.local.set(cache)
+		return browser.storage.local.set(cache)
 	}
 }
 

src/sidebar/components/claims.tsx

@@ -3,14 +3,15 @@ import {Claim, renderStatement} from "../render-claims"
 
 export interface ClaimsProps {
 	statements: {id: string, claims: Claim[]}[]
+	renderingCache: any
 }
 
 // Integration based on https://reactjs.org/docs/integrating-with-other-libraries.html
-export const Claims = ({statements}: ClaimsProps) => {
+export const Claims = ({statements, renderingCache}: ClaimsProps) => {
 	const reference = useRef<HTMLDivElement>(null)
 	useEffect(() => {
 		const rendered = statements
-			.map(it => renderStatement(it.claims))
+			.map(it => renderStatement(it.claims, renderingCache))
 			.filter(Boolean)
 			.map(claim => claim.rendered)
 

src/sidebar/entity.js

@@ -189,7 +189,7 @@ function createReferenceItem(ref) {
 				if (refthing.datavalue) {
 					const refvalue = new DocumentFragment()
 
-					refvalue.append(...renderStatements(refthing, [], refthing.datavalue.type, 'reference', undefined))
+					refvalue.append(...renderStatements(refthing, [], refthing.datavalue.type, 'reference', undefined, cache))
 					refvalues.push(refvalue)
 				}
 			}
@@ -331,7 +331,7 @@ function updateView(id, useCache = true) {
 
 				const statementsToRender = getStatementsToRender(statements)
 
-				ReactDOM.render(<Claims statements={statementsToRender}/>, items, )
+				ReactDOM.render(<Claims statements={statementsToRender} renderingCache={cache}/>, items, )
 				renderFootnotes(content, collectFootnotes(statementsToRender))
 			}
 			if (e['senses']) {
@@ -584,7 +584,10 @@ function updateView(id, useCache = true) {
 			}
 		}
 
-		resolveBreadcrumbs(cache);
+		// Let react render main set of claims first
+		await delay(0)
+
+		resolveBreadcrumbs(cache)
 
 		resolveIdLinksPlaceholder();
 	})();

src/sidebar/render-claims.ts

@@ -1,13 +1,9 @@
 import {templates} from './components/templates.tpl'
 import {filterNotEmpty} from '../core/collections'
-import {ApplyFormatters} from './formatters'
 import {localLanguage} from '../core/env'
 
-const cache = {} //todo broken now!!
-
 const lang = localLanguage()
 
-
 function dateToString(value) {
 	const wiso = value.time
 	const prec = value.precision
@@ -99,7 +95,7 @@ function renderReferences(references) {
 	])
 }
 
-function renderQualifiers(scope, delta) {
+function renderQualifiers(scope, delta, renderingCache: any) {
 	if (!(scope === 'statement' && typeof delta != 'undefined' && delta.hasOwnProperty('qualifiers'))) {
 		return []
 	}
@@ -109,7 +105,7 @@ function renderQualifiers(scope, delta) {
 		const qvalues = []
 		for (const qv of delta.qualifiers[prop]) {
 			const qualvalue = new DocumentFragment()
-			qualvalue.append(...renderStatements(qv, [], qv.snaktype, 'qualifier', undefined))
+			qualvalue.append(...renderStatements(qv, [], qv.snaktype, 'qualifier', undefined, renderingCache))
 			qvalues.push(qualvalue)
 		}
 
@@ -130,7 +126,7 @@ function renderIdLinks(valueType, snak) {
 	return []
 }
 
-function renderStatementCore(snak, type, scope, valueType) {
+function renderStatementCore(snak, type, scope, valueType, renderingCache: any) {
 	if (type === 'preformatted') {
 		return [snak.datavalue.value]
 	}
@@ -147,7 +143,7 @@ function renderStatementCore(snak, type, scope, valueType) {
 			const vid = snak.datavalue.value.id
 			return filterNotEmpty([
 				snak.datavalue.parents ? templates.breadcrumbsPlaceholder(snak.datavalue.parents) : null,
-				templates.placeholder({entity: vid}, cache),
+				templates.placeholder({entity: vid}, renderingCache),
 			])
 		}
 		if (valueType === 'external-id') {
@@ -214,13 +210,13 @@ function renderStatementCore(snak, type, scope, valueType) {
 	return []
 }
 
-export function renderStatements(snak, references, type, scope, delta) {
+export function renderStatements(snak, references, type, scope, delta, renderingCache: any) {
 	const valueType = snak.datatype ? snak.datatype : snak.datavalue.type
 	return [
-		...renderStatementCore(snak, type, scope, valueType),
+		...renderStatementCore(snak, type, scope, valueType, renderingCache),
 		...renderReferences(references),
 		...renderIdLinks(valueType, snak),
-		...renderQualifiers(scope, delta),
+		...renderQualifiers(scope, delta, renderingCache),
 	]
 }
 
@@ -234,7 +230,7 @@ export interface Claim {
 	// todo improve
 }
 
-export function renderStatement(claims: Claim[]) {
+export function renderStatement(claims: Claim[], renderingCache: any) {
 	if (!claims[0]?.mainsnak) return
 
 	const pid = claims[0].mainsnak.property
@@ -253,15 +249,15 @@ export function renderStatement(claims: Claim[]) {
 				}
 			}
 
-			thisvalue.append(...renderStatements(delta.mainsnak, refs, type, 'statement', delta))
+			thisvalue.append(...renderStatements(delta.mainsnak, refs, type, 'statement', delta, renderingCache))
 			values.push(thisvalue)
 
 		}
 	}
 	const statement = templates.remark({
 		prop: templates.placeholder({
 			entity: pid,
-		}, cache),
+		}, renderingCache),
 		vals: values,
 		id: pid,
 	})