TyphonJS•2y ago

TJSDocumentCollection best practices?

Hi! I've got a little component I'm using whose purpose is basically to just show a tiny preview of a resolved actor UUID. However, I want it to "short-circuit" (really more like long circuit) so that it grabs a world actor with the same name first, so repeated drag-drops of the same actor onto a scene doesn't infinitely duplicate... TL;DR: I need to be reactive on game.actors, and to do so was going to use a TJSDocumentCollection. Now for my actual ask. Within my component I have the following code.

<script>
    import { TJSDocumentCollection } from "#runtime/svelte/store/fvtt/document";

    // A summon. Though this might be an odd choice, explicitly NOT a tjs document!
    export let uuid;

    const world_actors = new TJSDocumentCollection(game.actors);

    /// ... Blah blah blah
    $: foo = $world_actors.find(x => x.name == my_resolved_actor.name);
</script>

<script>
    import { TJSDocumentCollection } from "#runtime/svelte/store/fvtt/document";

    // A summon. Though this might be an odd choice, explicitly NOT a tjs document!
    export let uuid;

    const world_actors = new TJSDocumentCollection(game.actors);

    /// ... Blah blah blah
    $: foo = $world_actors.find(x => x.name == my_resolved_actor.name);
</script>

The actual logic is more or less irrelevant. My main question is, with the knowledge that this component is instantiated fairly frequently and multiple times, is it ok to just make a new TJSDocumentCollection each time? Is there any special reason to make one once and reuse it multiple times (e.x. setup/teardown costs?).

1 Reply

TyphonJS (Michael)•2y ago

I'd have to get a better feel for what you are trying to accomplish and how that relates to the component / UI you are trying to display. You can utilize TJSDocumentCollection via JS outside of a Svelte component as it is a store. IE provide custom logic to run when changes occur via using the subscribe function. The only example of this is an unreleased module I use for testing which creates a better macro directory / responds to changes of the macro collection to build a data structure to display macros: https://github.com/typhonjs-fvtt/better-macros-directory/blob/main/src/plugins/data/macros/MacroData.js Particularly here is where the logic occurs: https://github.com/typhonjs-fvtt/better-macros-directory/blob/main/src/plugins/data/macros/MacroData.js#L91-L101 In this example the result of processing changes to the macro collection itself creates data that is a store which is then used in the UI display when it is visible, but otherwise runs whenever there are changes to the macro collection. It may give you an idea on how to accomplish the task separately from embedding TJSDocumentCollection directly in a component. I guess I should note that I haven't updated that demo module for the absolute latest TRL yet / import path for TJSDocumentCollection is not right, etc. but the logic / use case is the same.

Gaming

Programming

TJSDocumentCollection best practices?