Add Endpoint section for service runs on the run details page

Show service readiness status with waiting states and the endpoint URL
once the service is up and probes (if configured) have passed.
Replaces the inline service URL in the General section.

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: peterschmidt85

frontend/src/pages/Runs/Details/RunDetails/ConnectToServiceRun/index.tsx

@@ -0,0 +1,47 @@
+import React, { FC } from 'react';
+
+import { Alert, Box, Container, Header, Link, SpaceBetween } from 'components';
+
+import { getRunProbeStatuses } from 'libs/run';
+
+import { getRunListItemServiceUrl } from '../../../List/helpers';
+
+export const ConnectToServiceRun: FC<{ run: IRun }> = ({ run }) => {
+    const serviceUrl = getRunListItemServiceUrl(run);
+    const probeStatuses = getRunProbeStatuses(run);
+    const hasProbes = probeStatuses.length > 0;
+    const allProbesReady = hasProbes && probeStatuses.every((s) => s === 'success');
+    const serviceReady = run.status === 'running' && (!hasProbes || allProbesReady) && serviceUrl;
+
+    return (
+        <Container>
+            <Header variant="h2">Endpoint</Header>
+
+            {run.status !== 'running' && (
+                <SpaceBetween size="s">
+                    <Box />
+                    <Alert type="info">Waiting for the service to start.</Alert>
+                </SpaceBetween>
+            )}
+
+            {run.status === 'running' && !serviceReady && (
+                <SpaceBetween size="s">
+                    <Box />
+                    <Alert type="info">Waiting for the service to become ready.</Alert>
+                </SpaceBetween>
+            )}
+
+            {serviceReady && (
+                <SpaceBetween size="s">
+                    <Box />
+                    <Alert type="success">
+                        The service is ready at{' '}
+                        <Link href={serviceUrl} external>
+                            {serviceUrl}
+                        </Link>
+                    </Alert>
+                </SpaceBetween>
+            )}
+        </Container>
+    );
+};

frontend/src/pages/Runs/Details/RunDetails/index.tsx

@@ -29,12 +29,12 @@ import {
     getRunListItemRegion,
     getRunListItemResources,
     getRunListItemSchedule,
-    getRunListItemServiceUrl,
     getRunListItemSpot,
 } from '../../List/helpers';
 import { EventsList } from '../Events/List';
 import { JobList } from '../Jobs/List';
 import { ConnectToRunWithDevEnvConfiguration } from './ConnectToRunWithDevEnvConfiguration';
+import { ConnectToServiceRun } from './ConnectToServiceRun';
 
 export const RunDetails = () => {
     const { t } = useTranslation();
@@ -47,7 +47,6 @@ export const RunDetails = () => {
         id: paramRunId,
     });
 
-    const serviceUrl = runData ? getRunListItemServiceUrl(runData) : null;
     const schedule = runData ? getRunListItemSchedule(runData) : null;
     const nextTriggeredAt = runData ? runData.next_triggered_at : null;
 
@@ -191,17 +190,6 @@ export const RunDetails = () => {
                     </div>
                 </ColumnLayout>
 
-                {serviceUrl && (
-                    <ColumnLayout columns={1} variant="text-grid">
-                        <div>
-                            <Box variant="awsui-key-label">{t('projects.run.service_url')}</Box>
-                            <div>
-                                <a href={serviceUrl}>{serviceUrl}</a>
-                            </div>
-                        </div>
-                    </ColumnLayout>
-                )}
-
                 {schedule && (
                     <ColumnLayout columns={4} variant="text-grid">
                         <div>
@@ -220,6 +208,10 @@ export const RunDetails = () => {
                 <ConnectToRunWithDevEnvConfiguration run={runData} />
             )}
 
+            {runData.run_spec.configuration.type === 'service' && !runIsStopped(runData.status) && (
+                <ConnectToServiceRun run={runData} />
+            )}
+
             {runData.jobs.length > 1 && (
                 <JobList
                     projectName={paramProjectName}