added page for creating and editing a transform

Sveltekit-App/src/lib/sidebar/navigation.ts

@@ -22,6 +22,11 @@ export const navigation = [
 				name: 'Example Form',
 				description: 'A form example using the IdentityNow SDK.'
 			},
+			{
+				url: '/home/transform-editor',
+				name: 'Transform Editor',
+				description: 'A form example to edit a transform.'
+			},
 			{
 				url: '/home/form-integration',
 				name: 'SailPoint Form Integration',

Sveltekit-App/src/routes/home/transform-editor/+page.server.ts

@@ -0,0 +1,89 @@
+import { createConfiguration } from '$lib/sailpoint/sdk';
+import {
+	Paginator,
+	TransformsApi,
+	type Transform,
+	TransformTypeEnum,
+	type TransformsApiUpdateTransformRequest,
+	type TransformsApiCreateTransformRequest,
+	type TransformRead
+} from 'sailpoint-api-client';
+import type { Actions } from './$types';
+import { Axios, AxiosError, isAxiosError, type AxiosResponse } from 'axios';
+import { fail } from '@sveltejs/kit';
+
+const createTransform: Transform = { name: 'Create New', type: TransformTypeEnum.AccountAttribute, attributes: null }
+
+export const actions = {
+	default: async ({ locals, request }) => {
+		const data = await request.formData();
+
+		console.log('default action');
+		console.log('data', data);
+
+		const config = createConfiguration(locals.session!.baseUrl, locals.idnSession!.access_token);
+		const api = new TransformsApi(config);
+		try {
+			let resp: AxiosResponse<TransformRead, any>
+			if ( JSON.parse(data.get('transform')?.toString() || '{}').id === undefined) {
+				console.log('creating new transform')
+				resp = await createNewTransform(data, api);
+			} else {
+				console.log('updating transform')
+				resp = await updateTransform(data, api);
+			}
+	
+	
+			return { status: 'success' };
+		} catch (error) {
+			if (error && isAxiosError(error) && error.response) {
+				return fail(error.response.status, {message: error.message})
+			}
+		}
+
+	}
+} satisfies Actions;
+
+async function updateTransform(data: FormData, api: TransformsApi) {
+	const transform = JSON.parse(data.get('transform')?.toString() || '{}');
+	const updatedTransform = JSON.parse(data.get('updatedTransform')?.toString()!);
+
+
+	const params: TransformsApiUpdateTransformRequest= {
+		id: transform.id,
+		transform: updatedTransform
+	};
+
+	const resp = await api.updateTransform(params);
+	return resp;
+
+}
+
+async function createNewTransform(data: FormData, api: TransformsApi) {
+	const updatedTransform = JSON.parse(data.get('updatedTransform')?.toString()!);
+
+
+	const params: TransformsApiCreateTransformRequest= {
+		transform: updatedTransform
+	};
+
+	const resp = await api.createTransform(params);
+	return resp;
+
+}
+
+export const load = async ({ locals }) => {
+	const config = createConfiguration(locals.session!.baseUrl, locals.idnSession!.access_token);
+	const api = new TransformsApi(config);
+
+	const transformResp = Paginator.paginate(api, api.listTransforms, { limit: 1000 });
+
+	const transforms = new Promise<Transform[]>((resolve) => {
+		transformResp.then((response) => {
+			
+			resolve([createTransform, ...response.data]);
+		});
+	});
+
+	return { transforms };
+};

Sveltekit-App/src/routes/home/transform-editor/+page.svelte

@@ -0,0 +1,88 @@
+<script lang="ts">
+	import { enhance } from '$app/forms';
+	import Progress from '$lib/Components/Progress.svelte';
+	import { onMount } from 'svelte';
+	import type { Writable } from 'svelte/store';
+	import { localStorageStore } from '@skeletonlabs/skeleton';
+	import {
+	TransformTypeEnum, type Transform
+
+
+} from 'sailpoint-api-client';
+	export let data;
+	export let form;
+
+	
+	const selectedSource: Writable<any> = localStorageStore('selectedSource', undefined);
+	const updatedTransform: Writable<string> = localStorageStore('updatedTransform', '');
+
+	onMount(async () => {
+		const sources = await data.transforms;
+		if (sources.length > 0) {
+			$selectedSource = JSON.stringify(sources[0]);
+			$updatedTransform = JSON.stringify(sources[0], undefined, 4);
+		}
+	});
+
+	const handleChange = (e: any) => {
+		$updatedTransform = JSON.stringify(JSON.parse(e.target.value), undefined, 4);
+	};
+
+	$: console.log($selectedSource);
+</script>
+
+{#if form}
+	{#if form.status === 'success'}
+		<div class="alert alert-success">
+			<p>updated transform</p>
+		</div>
+	{/if}
+	{#if form.message}
+		<div class="alert alert-error">
+			<p>{form.message}</p>
+		</div>
+	{/if}
+{/if}
+
+<div class="flex justify-center flex-col align-middle gap-2">
+	<div class="card p-4">
+		<p class="text-2xl text-center">Transform Editor</p>
+	</div>
+	<form method="POST" class="card p-4">
+		<p class="text-2xl text-center">Update Transform</p>
+		<div class="flex flex-col gap-4">
+			{#await data.transforms}
+				<div class="flex flex-row justify-center">
+					<Progress width="w-[100px]" />
+				</div>
+			{:then sources}
+				<label>
+					<span>Transforms:</span>
+					<select
+						on:change={handleChange}
+						name="transform"
+						placeholder="Select a transform"
+						bind:value={$selectedSource}
+						class="select"
+					>
+						<option hidden disabled>Select a transform</option>
+						
+						{#each sources as source}
+							{@const sourceString = JSON.stringify(source)}
+							<option value={sourceString} selected={$selectedSource === sourceString}>
+								{source.name}
+							</option>
+						{/each}
+					</select>
+				</label>
+
+				<label>
+					<span>Description:</span>
+					<pre><textarea name="updatedTransform" class="textarea h-80" bind:value={$updatedTransform} /></pre>
+				</label>
+			{/await}
+
+			<button type="submit" class="btn variant-filled">Submit</button>
+		</div>
+	</form>
+</div>