Reactive pos-container-contents

[jg10-mastodon-social]

pos-container-contents currently has its contents set only on receiveResource and therefore does not re-render when the LDP container contents change in the store

PodOS/elements/src/components/pos-container-contents/pos-container-contents.tsx

Lines 43 to 47 in 32ada58

	receiveResource = (resource: Thing) => {
	this.container = resource.assume(LdpContainer);
	this.loading = false;
	this.contents = this.container.contains().sort((a, b) => a.name.localeCompare(b.name));
	};

LdpContainer needs a new reactive method to complement LdpContainer.contains

PodOS/core/src/ldp-container/LdpContainer.ts

Lines 17 to 29 in 32ada58

	contains(): ContainerContent[] {
	const contains = this.store.statementsMatching(
	sym(this.uri),
	sym("http://www.w3.org/ns/ldp#contains"),
	null,
	sym(this.uri),
	);
	return contains.map((content) => ({
	uri: content.object.value,
	name: labelFromUri(content.object.value),
	}));
	}
	}

Acceptance criteria:

• Add Store.observeStatementsMatching as reactive equivalent to Store.statementsMatching
• Add LDPContainer.observeContains as reactive equivalent to LDPContainer.contains
• pos-container-contents updates its contents by observing LDPContainer.observeContains

Edit: no need for Store.observeStatementsMatching - better to use a custom rxjs pipeline