From 46bb280f6e05ab90b08c997377d31eb5063717a3 Mon Sep 17 00:00:00 2001
From: kyle-ssg <kyle@solidstategroup.com>
Date: Wed, 1 Jul 2026 13:16:25 +0100
Subject: [PATCH] fix: add navigation to identity page from segment members
 list

- Add Link to each identity row in SegmentMembersList
- Pass environmentApiKey from parent component for URL building
- Use identity-id route format which only requires identifier

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../modals/CreateSegmentUsersTabContent.tsx      |  1 +
 .../web/components/modals/SegmentMembersList.tsx | 16 ++++++++++------
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/frontend/web/components/modals/CreateSegmentUsersTabContent.tsx b/frontend/web/components/modals/CreateSegmentUsersTabContent.tsx
index d52460dc6f64..35744144914f 100644
--- a/frontend/web/components/modals/CreateSegmentUsersTabContent.tsx
+++ b/frontend/web/components/modals/CreateSegmentUsersTabContent.tsx
@@ -176,6 +176,7 @@ const CreateSegmentUsersTabContent: React.FC<
               projectId={projectId}
               segmentId={segmentId}
               environmentId={selectedEnv.id}
+              environmentApiKey={selectedEnv.api_key}
               count={selectedMembership?.count}
             />
           ) : (
diff --git a/frontend/web/components/modals/SegmentMembersList.tsx b/frontend/web/components/modals/SegmentMembersList.tsx
index 5843f170cdcf..aaaf9907137e 100644
--- a/frontend/web/components/modals/SegmentMembersList.tsx
+++ b/frontend/web/components/modals/SegmentMembersList.tsx
@@ -1,4 +1,5 @@
 import React, { FC, useEffect, useState } from 'react'
+import { Link } from 'react-router-dom'
 import PanelSearch from 'components/PanelSearch'
 import Utils from 'common/utils/utils'
 import useDebouncedSearch from 'common/useDebouncedSearch'
@@ -11,6 +12,7 @@ type SegmentMembersListProps = {
   projectId: string | number
   segmentId: number
   environmentId: number
+  environmentApiKey: string
   // Total members for the selected environment, from the segment's
   // membership_counts. The list endpoint is cursor-paginated and returns no
   // count, so this drives the title total rather than the pager.
@@ -24,6 +26,7 @@ type SegmentMembersListProps = {
 // response carries the `next`/`previous` flags (via `transformCursorPaging`).
 const SegmentMembersList: FC<SegmentMembersListProps> = ({
   count,
+  environmentApiKey,
   environmentId,
   projectId,
   segmentId,
@@ -74,14 +77,15 @@ const SegmentMembersList: FC<SegmentMembersListProps> = ({
         // Cursor pagination cannot jump to an arbitrary page.
       }}
       renderRow={({ identifier }: SegmentMember, index: number) => (
-        <Row
-          className='list-item list-item-sm clickable'
+        <Link
+          to={`/project/${projectId}/environment/${environmentApiKey}/identities/${encodeURIComponent(
+            identifier,
+          )}`}
+          className='list-item list-item-sm clickable d-flex align-items-center px-3'
           data-test={`segment-member-${index}`}
         >
-          <Row space className='px-3'>
-            <div className='font-weight-medium'>{identifier}</div>
-          </Row>
-        </Row>
+          <div className='font-weight-medium'>{identifier}</div>
+        </Link>
       )}
       filterRow={() => true}
       search={searchInput}