Added link to API Explorer

Author: simonredfern

.env.example

@@ -38,3 +38,6 @@ REDIS_PORT="6379"
 # UI Configuration
 PUBLIC_LOGO_URL="/logo2x-1.png"
 PUBLIC_DARK_LOGO_URL="/obp_logo.svg"
+
+# Links for documentation and for other reasons. No default
+API_EXPLORER_URL=http://localhost:5173

src/routes/(protected)/dynamic-entities/system/create/+page.server.ts

@@ -2,7 +2,7 @@ import type { PageServerLoad } from "./$types";
 import { error } from "@sveltejs/kit";
 import { SessionOAuthHelper } from "$lib/oauth/sessionHelper";
 
-export const load: PageServerLoad = async ({ locals }) => {
+export const load: PageServerLoad = async ({ locals, parent }) => {
   const session = locals.session;
 
   if (!session?.data?.user) {
@@ -16,5 +16,10 @@ export const load: PageServerLoad = async ({ locals }) => {
     throw error(401, "No API access token available");
   }
 
-  return {};
+  // Get parent layout data to access externalLinks
+  const parentData = await parent();
+
+  return {
+    externalLinks: parentData.externalLinks || {},
+  };
 };

src/routes/(protected)/dynamic-entities/system/create/+page.svelte

@@ -1,11 +1,14 @@
 <script lang="ts">
   import { goto } from "$app/navigation";
+  import type { PageData } from "./$types";
   import {
     extractErrorFromResponse,
     formatErrorForDisplay,
     logErrorDetails,
   } from "$lib/utils/errorHandler";
 
+  let { data }: { data: PageData } = $props();
+
   let entityName = $state("");
   let entityDescription = $state("");
   let schemaJson = $state(`{
@@ -239,6 +242,32 @@
             <strong>example:</strong> Example value for the field (optional)
           </li>
         </ul>
+        {#if data.externalLinks?.API_EXPLORER_URL}
+          <div class="mt-3 border-t border-blue-300 pt-3 dark:border-blue-700">
+            <a
+              href="{data.externalLinks
+                .API_EXPLORER_URL}/resource-docs/OBPv6.0.0?operationid=OBPv4.0.0-createSystemDynamicEntity"
+              target="_blank"
+              rel="noopener noreferrer"
+              class="inline-flex items-center text-xs font-medium text-blue-700 hover:text-blue-900 hover:underline dark:text-blue-300 dark:hover:text-blue-100"
+            >
+              View API Documentation on API Explorer
+              <svg
+                class="ml-1 h-4 w-4"
+                fill="none"
+                stroke="currentColor"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
+                />
+              </svg>
+            </a>
+          </div>
+        {/if}
       </div>
 
       <!-- Actions -->

src/routes/+layout.server.ts

@@ -28,7 +28,9 @@ export async function load(event: RequestEvent) {
   let data: Partial<RootLayoutData> = {};
 
   let externalLinks = {
-    API_EXPLORER_URL: env.API_EXPLORER_URL,
+    API_EXPLORER_URL:
+      env.API_EXPLORER_URL ||
+      "https://apiexplorer-ii-sandbox.openbankproject.com",
     API_MANAGER_URL: env.API_MANAGER_URL,
     SUBSCRIPTIONS_URL: publicEnv.PUBLIC_SUBSCRIPTIONS_URL,
     LEGACY_PORTAL_URL: publicEnv.PUBLIC_LEGACY_PORTAL_URL,