svelte support for link query

main
Jackson Morgan 4 months ago
parent f8ad3ba5f6
commit 6255d93715
  1. 2
      packages/svelte/example/src/.ldo/solidProfile.shapeTypes.ts
  2. 5
      packages/svelte/example/src/App.svelte
  3. 2
      packages/svelte/example/test-server/configs/template/base/link-query/main-profile.ttl
  4. 2
      packages/svelte/example/test-server/configs/template/base/link-query/other-profile.ttl
  5. 2
      packages/svelte/example/test-server/configs/template/base/link-query/third-profile.ttl
  6. 14
      packages/svelte/src/createLdoSvelteMethods.tsx
  7. 43
      packages/svelte/src/methods/useLinkQuery.ts
  8. 5
      packages/svelte/src/util/useTrackingProxy.ts

@ -1,7 +1,7 @@
import { ShapeType } from "@ldo/ldo"; import { ShapeType } from "@ldo/ldo";
import { solidProfileSchema } from "./solidProfile.schema.js"; import { solidProfileSchema } from "./solidProfile.schema.js";
import { solidProfileContext } from "./solidProfile.context.js"; import { solidProfileContext } from "./solidProfile.context.js";
import { solidProfileSchema } from "./solidProfile.schema.js"; import { AddressShape, EmailShape, PhoneNumberShape, RSAPublicKeyShape, SolidProfileShape, TrustedAppShape } from "./solidProfile.typings.js";
/** /**
* ============================================================================= * =============================================================================

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { SolidProfileShapeShapeType } from "./.ldo/solidProfile.shapeTypes.js"; import { SolidProfileShapeShapeType } from "./.ldo/solidProfile.shapeTypes";
// Assuming these are the Svelte-specific functions/stores from your @ldo/svelte library // Assuming these are the Svelte-specific functions/stores from your @ldo/svelte library
import { useResource, useSubject } from "./ldoSvelteMethods.js"; import { useResource, useSubject } from "./ldoSvelteMethods";
const SAMPLE_DATA_URI = const SAMPLE_DATA_URI =
"http://localhost:3004/example/link-query/main-profile.ttl"; "http://localhost:3004/example/link-query/main-profile.ttl";
const resource = useResource(SAMPLE_DATA_URI); const resource = useResource(SAMPLE_DATA_URI);
@ -23,7 +23,6 @@
{:else} {:else}
<p>No friend found or friend has no @id.</p> <p>No friend found or friend has no @id.</p>
{/if} {/if}
<ul> <ul>
{#each friendArray as friend (friend["@id"])} {#each friendArray as friend (friend["@id"])}
<li>{friend["@id"]}</li> <li>{friend["@id"]}</li>

@ -4,4 +4,4 @@
:me a foaf:Person ; :me a foaf:Person ;
foaf:name "Main User" ; foaf:name "Main User" ;
foaf:mbox <mailto:main@example.org> ; foaf:mbox <mailto:main@example.org> ;
foaf:knows <http://localhost:3002/example/link-query/other-profile.ttl#me> . foaf:knows <http://localhost:3004/example/link-query/other-profile.ttl#me> .

@ -4,4 +4,4 @@
:me a foaf:Person ; :me a foaf:Person ;
foaf:name "Other User" ; foaf:name "Other User" ;
foaf:mbox <mailto:other@example.org> ; foaf:mbox <mailto:other@example.org> ;
foaf:knows <http://localhost:3002/example/link-query/main-profile.ttl#me> . foaf:knows <http://localhost:3004/example/link-query/main-profile.ttl#me> .

@ -4,4 +4,4 @@
:me a foaf:Person ; :me a foaf:Person ;
foaf:name "Third User" ; foaf:name "Third User" ;
foaf:mbox <mailto:third@example.org> ; foaf:mbox <mailto:third@example.org> ;
foaf:knows <http://localhost:3002/example/link-query/main-profile.ttl#me> . foaf:knows <http://localhost:3004/example/link-query/main-profile.ttl#me> .

@ -66,12 +66,12 @@ export function createLdoSvelteMethods<
return { return {
dataset, dataset,
useLdo: createUseLdo(dataset), useLdo: createUseLdo<Plugins>(dataset),
useMatchObject: createUseMatchObject(dataset), useMatchObject: createUseMatchObject<Plugins>(dataset),
useMatchSubject: createUseMatchSubject(dataset), useMatchSubject: createUseMatchSubject<Plugins>(dataset),
useResource: createUseResource(dataset), useResource: createUseResource<Plugins>(dataset),
useSubject: createUseSubject(dataset), useSubject: createUseSubject<Plugins>(dataset),
useSubscribeToResource: createUseSubscribeToResource(dataset), useSubscribeToResource: createUseSubscribeToResource<Plugins>(dataset),
useLinkQuery: createUseLinkQuery(dataset), useLinkQuery: createUseLinkQuery<Plugins>(dataset),
}; };
} }

@ -1,12 +1,15 @@
import type { import {
ConnectedLdoDataset, type ConnectedLdoDataset,
ConnectedPlugin, type ConnectedPlugin,
ExpandDeep, type ExpandDeep,
LQInput, type LQInput,
LQReturn, type LQReturn,
} from "@ldo/connected"; } from "@ldo/connected";
import type { LdoBase, ShapeType } from "@ldo/ldo"; import { type LdoBase, type LdoBuilder, type ShapeType } from "@ldo/ldo";
import type { SubjectNode } from "@ldo/rdf-utils"; import type { SubjectNode } from "@ldo/rdf-utils";
import { type Readable } from "svelte/store";
import { useTrackingProxy } from "../util/useTrackingProxy.js";
import { onDestroy } from "svelte";
/** /**
* @internal * @internal
@ -28,7 +31,29 @@ export function createUseLinkQuery<Plugins extends ConnectedPlugin[]>(
startingResource: string, startingResource: string,
startingSubject: SubjectNode | string, startingSubject: SubjectNode | string,
linkQuery: QueryInput, linkQuery: QueryInput,
): ExpandDeep<LQReturn<Type, QueryInput>> | undefined { ): Readable<ExpandDeep<LQReturn<Type, QueryInput>> | undefined> {
throw new Error("Link Query is Not Implemented for Svelte"); const resource = dataset.getResource(startingResource);
console.log(resource);
const lq = dataset
.usingType(shapeType)
.startLinkQuery(resource, startingSubject, linkQuery);
console.log("Calling subscribe");
lq.subscribe();
console.log("After call subscribe");
onDestroy(() => {
lq.unsubscribeAll();
});
const fromSubject = (builder: LdoBuilder<Type>) => {
if (!startingSubject) return;
return builder.fromSubject(startingSubject);
};
return useTrackingProxy(
shapeType,
fromSubject,
dataset,
) as unknown as Readable<ExpandDeep<LQReturn<Type, QueryInput>>>;
}; };
} }

@ -3,6 +3,7 @@ import type { LdoBase, LdoDataset, ShapeType } from "@ldo/ldo";
import { createTrackingProxyBuilder } from "@ldo/connected"; import { createTrackingProxyBuilder } from "@ldo/connected";
import { writable, type Readable } from "svelte/store"; import { writable, type Readable } from "svelte/store";
import type { nodeEventListener } from "@ldo/subscribable-dataset"; import type { nodeEventListener } from "@ldo/subscribable-dataset";
import { onDestroy } from "svelte";
/** /**
* @internal * @internal
@ -38,6 +39,10 @@ export function useTrackingProxy<Type extends LdoBase, ReturnType>(
}; };
}); });
onDestroy(() => {
dataset.removeListenerFromAllEvents(forceUpdate);
});
return { return {
subscribe: store.subscribe, subscribe: store.subscribe,
}; };

Loading…
Cancel
Save