feat: fetch verification flows

src/lib/slangroom/verificationFlows.ts

@@ -0,0 +1,79 @@
+import { backendUri } from '$lib/backendUri';
+import { Slangroom } from '@slangroom/core';
+import getPbList from '$lib/slangroom/getPbList.zen?raw';
+import { pocketbase } from '@slangroom/pocketbase';
+
+export type VerificationFlow = {
+	collectionId: string;
+	collectionName: string;
+	created: string;
+	description: string;
+	expand: Expand;
+	id: string;
+	name: string;
+	organization: string;
+	public: boolean;
+	relying_party: string;
+	template: string;
+	updated: string;
+};
+
+export type Expand = {
+	organization: Organization;
+	relying_party: RelyingParty;
+};
+
+export type Organization = {
+	avatar: string;
+	collectionId: string;
+	collectionName: string;
+	created: string;
+	description: string;
+	id: string;
+	name: string;
+	updated: string;
+};
+
+export type RelyingParty = {
+	collectionId: string;
+	collectionName: string;
+	created: string;
+	endpoint: string;
+	id: string;
+	name: string;
+	organization: string;
+	updated: string;
+};
+export type PaginatedResult<T> = {
+	page: number;
+	perPage: number;
+	totalItems: number;
+	totalPages: number;
+	items: T[];
+};
+
+export type Response<T> = {
+	result: T;
+	status: number;
+};
+
+const slangroom = new Slangroom(pocketbase);
+
+export const getVerificationFlows = async (): Promise<VerificationFlow[]> => {
+	try {
+		const data = {
+			pb_address: backendUri,
+			list_parameters: {
+				collection: 'verification_flows',
+				expand: 'relying_party, organization',
+				sort: '-updated',
+				type: 'all'
+			}
+		};
+		const res = await slangroom.execute(getPbList, { data });
+		//@ts-expect-error output needs to be typed
+		return res.result?.output?.records;
+	} catch (e: unknown) {
+		throw new Error(JSON.stringify(e));
+	}
+};

src/routes/[[lang]]/(protected)/(tabs)/home/+page.svelte

@@ -1,24 +1,28 @@
 <script lang="ts">
-	import Header from '$lib/components/molecules/Header.svelte';
-	import { getServices } from '$lib/slangroom/services';
+	import { getVerificationFlows } from '$lib/slangroom/verificationFlows';
 	import { m, r } from '$lib/i18n';
 	import { TabPage } from '$lib/components/tabs';
+	import { filesUri } from '$lib/backendUri';
 </script>
 
 <TabPage tab="home" title="HOME">
-	{#await getServices()}
+	{#await getVerificationFlows()}
 		<ion-spinner />
-	{:then res}
-		{@const services = res.result.items}
+	{:then verificationFlows}
 		<d-heading size="s">
 			{m.Verify_credential()}
 		</d-heading>
 		<div class="flex flex-col gap-2">
-			{#each services as service}
+			{#each verificationFlows as vf}
 				<d-credential-service
-					href={r(`/${service.id}/verify/`)}
-					name={service.display_name}
-					issuer={service.credential_issuer}
+					href={r(`/${vf.id}/verify/`)}
+					name={vf.name}
+					logoSrc={filesUri(
+						vf.expand.organization.avatar,
+						vf.expand.organization.collectionName,
+						vf.expand.organization.id
+					)}
+					issuer={vf.expand.relying_party.name}
 				/>
 			{/each}
 		</div>