From ce4003287bcd3252849b84588f31ce917caf031b Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Tue, 9 Sep 2025 13:18:35 -0500
Subject: [PATCH 1/6] Feat: add search to agent sessions

Update graphql for sorting and search
Add new search bar with sorting
Add filtering by Flow name to search
Update specs

Changelog: changed
EE: true
---
 .../components/common/agent_flow_list.vue     |  91 ++++++++++++++-
 .../queries/get_agent_flows.query.graphql     |  12 +-
 .../queries/get_user_agent_flow.query.graphql |   4 +
 .../project/project_agents_platform_index.vue |  46 +++++++-
 .../user/user_agents_platform_index.vue       |  33 ++++++
 .../pages/index/duo_agents_platform_index.vue |  20 +++-
 .../components/common/agent_flow_list_spec.js | 105 ++++++++++++++++--
 .../project_agents_platform_index_spec.js     |  95 ++++++++++++++++
 .../user/user_agents_platform_index_spec.js   |   1 +
 locale/gitlab.pot                             |  21 ++++
 10 files changed, 411 insertions(+), 17 deletions(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
index 93ff2ebfc4f791..f5924d580c715e 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
@@ -1,17 +1,31 @@
 <script>
-import { GlEmptyState, GlKeysetPagination } from '@gitlab/ui';
+import { GlEmptyState, GlFilteredSearchToken, GlKeysetPagination } from '@gitlab/ui';
 import emptyStateIllustrationPath from '@gitlab/svgs/dist/illustrations/empty-state/empty-pipeline-md.svg';
+import EmptyResult from '~/vue_shared/components/empty_result.vue';
+import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
+import { OPERATORS_IS } from '~/vue_shared/components/filtered_search_bar/constants';
+import { s__ } from '~/locale';
 import { AGENTS_PLATFORM_SHOW_ROUTE } from '../../router/constants';
 import AgentFlowListItem from './agent_flow_list_item.vue';
 
 export default {
   name: 'AgentFlowList',
   components: {
+    EmptyResult,
+    FilteredSearchBar,
     GlEmptyState,
     GlKeysetPagination,
     AgentFlowListItem,
   },
   props: {
+    hasInitialWorkflows: {
+      required: true,
+      type: Boolean,
+    },
+    initialSort: {
+      required: true,
+      type: String,
+    },
     showProjectInfo: {
       required: false,
       type: Boolean,
@@ -26,28 +40,96 @@ export default {
       type: Object,
     },
   },
+  data() {
+    return {
+      localFilters: {},
+    };
+  },
   computed: {
     hasWorkflows() {
       return this.workflows?.length > 0;
     },
+    tokens() {
+      return [
+        {
+          type: 'flow-name',
+          title: s__('DuoAgentsPlatform|Flow Name'),
+          icon: 'flow-ai',
+          token: GlFilteredSearchToken,
+          operators: OPERATORS_IS,
+          unique: true,
+          options: [
+            { value: 'software_development', title: s__('DuoAgentsPlatform|Software Development') },
+            { value: 'convert_to_gitlab_ci', title: s__('DuoAgentsPlatform|Convert to gitlab ci') },
+            { value: 'chat', title: s__('DuoAgentsPlatform|Chat') },
+          ],
+        },
+      ];
+    },
+  },
+  methods: {
+    handleFilter(filters) {
+      this.localFilters = filters;
+      this.$emit('filter', filters);
+    },
+    handleSort(sortBy) {
+      this.$emit('sort', sortBy);
+    },
     displayPagination() {
       return this.workflowsPageInfo?.hasNextPage || this.workflowsPageInfo?.hasPreviousPage;
     },
   },
   showRoute: AGENTS_PLATFORM_SHOW_ROUTE,
+  availableSortOptions: [
+    {
+      id: 1,
+      title: s__('DuoAgentsPlatform|Created date'),
+      sortDirection: {
+        descending: 'CREATED_DESC',
+        ascending: 'CREATED_ASC',
+      },
+    },
+    {
+      id: 2,
+      title: s__('DuoAgentsPlatform|Updated date'),
+      sortDirection: {
+        descending: 'UPDATED_DESC',
+        ascending: 'UPDATED_ASC',
+      },
+    },
+  ],
   emptyStateIllustrationPath,
 };
 </script>
 <template>
   <div :class="{ 'gl-self-center': !hasWorkflows }" class="gl-w-full">
     <gl-empty-state
-      v-if="!hasWorkflows"
+      v-if="!hasInitialWorkflows"
       :title="s__('DuoAgentsPlatform|No agent sessions yet')"
       :description="s__('DuoAgentsPlatform|New agent sessions will appear here.')"
       :svg-path="$options.emptyStateIllustrationPath"
     />
     <template v-else>
-      <ul class="gl-divide-x-0 gl-divide-y-1 gl-divide-solid gl-divide-subtle gl-px-0">
+      <filtered-search-bar
+        namespace="duo-agents-platform"
+        recent-searches-storage-key="agent-sessions"
+        :tokens="tokens"
+        :search-input-placeholder="s__('DuoAgentsPlatform|Search for a session')"
+        :sort-options="$options.availableSortOptions"
+        :initial-sort-by="initialSort"
+        :initial-sort="initialSort"
+        :value="localFilters"
+        sync-filter-and-sort
+        terms-as-tokens
+        class="gl-grow gl-border-t-0 @sm/panel:gl-flex"
+        data-testid="agent-sessions-search-container"
+        @onFilter="handleFilter"
+        @onSort="handleSort"
+      />
+      <ul
+        v-if="hasWorkflows"
+        class="gl-divide-x-0 gl-divide-y-1 gl-divide-solid gl-divide-subtle gl-px-0"
+      >
         <agent-flow-list-item
           v-for="item in workflows"
           :key="item.id"
@@ -55,8 +137,9 @@ export default {
           :show-project-info="showProjectInfo"
         />
       </ul>
+      <empty-result v-else type="search" />
       <gl-keyset-pagination
-        v-if="displayPagination"
+        v-if="displayPagination()"
         v-bind="workflowsPageInfo"
         class="gl-mt-5 gl-flex gl-justify-center"
         @prev="$emit('prev-page')"
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
index c6d2fdc419a130..d5b910bc382545 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
@@ -1,6 +1,14 @@
 #import "../fragments/flow.fragment.graphql"
 
-query getAgentFlows($projectPath: ID!, $after: String, $before: String, $first: Int, $last: Int) {
+query getAgentFlows(
+  $projectPath: ID!
+  $after: String
+  $before: String
+  $first: Int
+  $last: Int
+  $sort: Sort
+  $type: String
+) {
   project(fullPath: $projectPath) {
     id
     duoWorkflowWorkflows(
@@ -9,6 +17,8 @@ query getAgentFlows($projectPath: ID!, $after: String, $before: String, $first:
       after: $after
       last: $last
       before: $before
+      sort: $sort
+      type: $type
     ) {
       pageInfo {
         startCursor
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
index 2d0779f403bccc..c0782fa8725705 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
@@ -6,6 +6,8 @@ query getUserAgentFlows(
   $first: Int
   $last: Int
   $excludeTypes: [String!]
+  $sort: Sort
+  $type: String
 ) {
   duoWorkflowWorkflows(
     first: $first
@@ -13,6 +15,8 @@ query getUserAgentFlows(
     last: $last
     before: $before
     excludeTypes: $excludeTypes
+    sort: $sort
+    type: $type
   ) {
     pageInfo {
       startCursor
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
index 33f8d513bbccd5..1446e68cdd5156 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
@@ -9,8 +9,12 @@ export default {
   inject: ['projectPath'],
   data() {
     return {
+      allWorkflows: [],
       workflows: [],
       workflowsPageInfo: {},
+      currentSort: 'UPDATED_ASC',
+      currentFilters: {},
+      isSearchActive: false,
     };
   },
   apollo: {
@@ -22,10 +26,19 @@ export default {
           first: 20,
           before: null,
           last: null,
+          sort: this.currentSort,
+          ...this.currentFilters,
         };
       },
       update(data) {
-        return data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+        const workflows = data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+
+        // Store all workflows from initial load if not in search mode
+        if (!this.isSearchActive) {
+          this.allWorkflows = [...workflows];
+        }
+
+        return workflows;
       },
       result({ data }) {
         this.workflowsPageInfo = data?.project?.duoWorkflowWorkflows?.pageInfo || {};
@@ -42,14 +55,45 @@ export default {
     isLoadingWorkflows() {
       return this.$apollo.queries.workflows.loading;
     },
+    hasInitialWorkflows() {
+      return this.allWorkflows.length > 0;
+    },
+  },
+  methods: {
+    handleSort(sortBy) {
+      if (this.currentSort === sortBy) {
+        return;
+      }
+      this.currentSort = sortBy;
+
+      this.$apollo.queries.workflows.refetch();
+    },
+    handleFilter(filters) {
+      const processedFilters = {};
+
+      filters.forEach((filter) => {
+        if (filter.type === 'flow-name' && filter.value?.data) {
+          processedFilters.type = filter.value.data;
+        }
+      });
+
+      this.isSearchActive = Boolean(processedFilters.type);
+
+      this.currentFilters = processedFilters;
+      this.$apollo.queries.workflows.refetch();
+    },
   },
 };
 </script>
 <template>
   <duo-agents-platform-index
+    :initial-sort="currentSort"
     :is-loading-workflows="isLoadingWorkflows"
+    :has-initial-workflows="hasInitialWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
     :workflow-query="$apollo.queries.workflows"
+    @sort="handleSort"
+    @filter="handleFilter"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
index 8cf0360c7e55bd..3d42a95abe0d79 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
@@ -10,6 +10,9 @@ export default {
     return {
       workflows: [],
       workflowsPageInfo: {},
+      currentSort: 'UPDATED_ASC',
+      currentFilters: {},
+      isSearchActive: false,
     };
   },
   apollo: {
@@ -22,6 +25,8 @@ export default {
           before: null,
           last: null,
           excludeTypes: ['chat'],
+          sort: this.currentSort,
+          ...this.currentFilters,
         };
       },
       update(data) {
@@ -43,14 +48,42 @@ export default {
       return this.$apollo.queries.workflows.loading;
     },
   },
+  methods: {
+    handleSort(sortBy) {
+      if (this.currentSort === sortBy) {
+        return;
+      }
+      this.currentSort = sortBy;
+
+      this.$apollo.queries.workflows.refetch();
+    },
+    handleFilter(filters) {
+      const processedFilters = {};
+
+      filters.forEach((filter) => {
+        if (filter.type === 'flow-name' && filter.value?.data) {
+          processedFilters.type = filter.value.data;
+        }
+      });
+
+      this.isSearchActive = Boolean(processedFilters.type);
+
+      this.currentFilters = processedFilters;
+      this.$apollo.queries.workflows.refetch();
+    },
+  },
 };
 </script>
 <template>
   <duo-agents-platform-index
+    :initial-sort="currentSort"
     :is-loading-workflows="isLoadingWorkflows"
+    :has-initial-workflows="true"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
     :workflow-query="$apollo.queries.workflows"
     class="gl-min-w-full"
+    @sort="handleSort"
+    @filter="handleFilter"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
index 8427b68d162d2d..e09cba5f5641a1 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
@@ -19,6 +19,18 @@ export default {
     },
   },
   props: {
+    hasInitialWorkflows: {
+      required: true,
+      type: Boolean,
+    },
+    initialSort: {
+      required: true,
+      type: String,
+    },
+    isLoadingWorkflows: {
+      required: true,
+      type: Boolean,
+    },
     workflowQuery: {
       required: true,
       type: Object,
@@ -31,10 +43,6 @@ export default {
       required: true,
       type: Object,
     },
-    isLoadingWorkflows: {
-      required: true,
-      type: Boolean,
-    },
   },
   computed: {
     headerClass() {
@@ -86,10 +94,14 @@ export default {
     <agent-flow-list
       v-else
       :show-project-info="isSidePanelView"
+      :has-initial-workflows="hasInitialWorkflows"
+      :initial-sort="initialSort"
       :workflows="workflows"
       :workflows-page-info="workflowsPageInfo"
       @next-page="handleNextPage"
       @prev-page="handlePrevPage"
+      @sort="$emit('sort', $event)"
+      @filter="$emit('filter', $event)"
     />
   </div>
 </template>
diff --git a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
index f7c2e5829ef994..7a453421e74114 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
@@ -2,6 +2,7 @@ import { GlEmptyState, GlKeysetPagination } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import AgentFlowList from 'ee/ai/duo_agents_platform/components/common/agent_flow_list.vue';
 import AgentFlowListItem from 'ee/ai/duo_agents_platform/components/common/agent_flow_list_item.vue';
+import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import { mockAgentFlows } from '../../../mocks';
 
 describe('AgentFlowList', () => {
@@ -14,12 +15,15 @@ describe('AgentFlowList', () => {
   const createWrapper = (props = {}) => {
     wrapper = shallowMount(AgentFlowList, {
       propsData: {
+        hasInitialWorkflows: true,
+        initialSort: 'CREATED_DESC',
         workflows: mockAgentFlows,
         workflowsPageInfo: {},
         ...props,
       },
     });
   };
+  const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
 
   describe('when component is mounted', () => {
     beforeEach(() => {
@@ -27,8 +31,8 @@ describe('AgentFlowList', () => {
     });
 
     describe('and there are no workflows', () => {
-      beforeEach(async () => {
-        await createWrapper({ workflows: [] });
+      beforeEach(() => {
+        createWrapper({ hasInitialWorkflows: false, workflows: [] });
       });
 
       it('renders the emptyState', () => {
@@ -46,13 +50,29 @@ describe('AgentFlowList', () => {
     });
 
     describe('when there are workflows', () => {
+      beforeEach(() => {
+        createWrapper({
+          hasInitialWorkflows: true,
+          workflows: mockAgentFlows,
+          workflowsPageInfo: {
+            startCursor: 'start',
+            endCursor: 'end',
+            hasNextPage: true,
+            hasPreviousPage: false,
+          },
+        });
+      });
+
       it('render the agent flow list items', () => {
         expect(findAgentFlowListItems().length).toBeGreaterThan(0);
       });
 
       describe('when showProjectInfo is false', () => {
         beforeEach(() => {
-          createWrapper({ showProjectInfo: false });
+          createWrapper({
+            hasInitialWorkflows: true,
+            showProjectInfo: false,
+          });
         });
 
         it('passes showProjectInfo as false to each AgentFlowListItem', () => {
@@ -64,7 +84,10 @@ describe('AgentFlowList', () => {
 
       describe('when showProjectInfo is true', () => {
         beforeEach(() => {
-          createWrapper({ showProjectInfo: true });
+          createWrapper({
+            hasInitialWorkflows: true,
+            showProjectInfo: true,
+          });
         });
 
         it('passes showProjectInfo as true to each AgentFlowListItem', () => {
@@ -76,7 +99,7 @@ describe('AgentFlowList', () => {
 
       describe('when showProjectInfo is not provided', () => {
         beforeEach(() => {
-          createWrapper();
+          createWrapper({ hasInitialWorkflows: true });
         });
 
         it('defaults showProjectInfo to false for each AgentFlowListItem', () => {
@@ -85,14 +108,78 @@ describe('AgentFlowList', () => {
           });
         });
       });
+
+      it('renders the filtered search bar with sort options', () => {
+        expect(findFilteredSearchBar().exists()).toBe(true);
+        expect(findFilteredSearchBar().props('sortOptions')).toEqual([
+          {
+            id: 1,
+            title: 'Created date',
+            sortDirection: {
+              descending: 'CREATED_DESC',
+              ascending: 'CREATED_ASC',
+            },
+          },
+          {
+            id: 2,
+            title: 'Updated date',
+            sortDirection: {
+              descending: 'UPDATED_DESC',
+              ascending: 'UPDATED_ASC',
+            },
+          },
+        ]);
+      });
+
+      it('renders the filtered search bar with filter tokens', () => {
+        const tokens = findFilteredSearchBar().props('tokens');
+
+        expect(tokens).toHaveLength(1);
+
+        expect(tokens[0]).toMatchObject({
+          type: 'flow-name',
+          title: 'Flow Name',
+          icon: 'flow-ai',
+          unique: true,
+        });
+        expect(tokens[0].options).toEqual([
+          { value: 'software_development', title: 'Software Development' },
+          { value: 'convert_to_gitlab_ci', title: 'Convert to gitlab ci' },
+          { value: 'chat', title: 'Chat' },
+        ]);
+      });
+
+      describe('when sorting', () => {
+        it('emits sort event when onSort is triggered', () => {
+          findFilteredSearchBar().vm.$emit('onSort', 'UPDATED_DESC');
+
+          expect(wrapper.emitted('sort')).toHaveLength(1);
+          expect(wrapper.emitted('sort')[0]).toEqual(['UPDATED_DESC']);
+        });
+      });
+
+      describe('when filtering', () => {
+        it('emits filter event when onFilter is triggered', () => {
+          const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
+          findFilteredSearchBar().vm.$emit('onFilter', filters);
+
+          expect(wrapper.emitted('filter')).toHaveLength(1);
+          expect(wrapper.emitted('filter')[0]).toEqual([filters]);
+        });
+      });
     });
   });
 
   describe('keyset pagination controls', () => {
     describe('when there is no pagination data', () => {
       beforeEach(() => {
-        createWrapper({
-          workflowsPageInfo: {},
+        wrapper = shallowMount(AgentFlowList, {
+          propsData: {
+            hasInitialWorkflows: true,
+            initialSort: 'CREATED_DESC',
+            workflows: mockAgentFlows,
+            workflowsPageInfo: {},
+          },
         });
       });
 
@@ -112,6 +199,8 @@ describe('AgentFlowList', () => {
       describe('when hasNextPage is false and hasPreviousPage is false', () => {
         beforeEach(() => {
           createWrapper({
+            hasInitialWorkflows: true,
+            workflows: mockAgentFlows,
             workflowsPageInfo: createPaginationData(false, false),
           });
         });
@@ -130,6 +219,8 @@ describe('AgentFlowList', () => {
         ({ hasNextPage, hasPreviousPage }) => {
           beforeEach(() => {
             createWrapper({
+              hasInitialWorkflows: true,
+              workflows: mockAgentFlows,
               workflowsPageInfo: createPaginationData(hasNextPage, hasPreviousPage),
             });
           });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
index b7d74df9299d4a..a09ba2d8779868 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
@@ -74,6 +74,7 @@ describe('ProjectAgentsPlatformIndex', () => {
             before: null,
             first: 20,
             last: null,
+            sort: 'UPDATED_ASC',
           });
         });
 
@@ -142,4 +143,98 @@ describe('ProjectAgentsPlatformIndex', () => {
       });
     });
   });
+
+  describe('filtering', () => {
+    beforeEach(async () => {
+      await createWrapper();
+    });
+
+    it('handles status filter correctly', async () => {
+      const filters = [{ type: 'status', value: { data: 'running' } }];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+      });
+    });
+
+    it('handles flow-name filter correctly', async () => {
+      const filters = [{ type: 'flow-name', value: { data: 'chat' } }];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        type: 'chat',
+      });
+    });
+
+    it('handles multiple filters correctly', async () => {
+      const filters = [
+        { type: 'status', value: { data: 'finished' } },
+        { type: 'flow-name', value: { data: 'software_development' } },
+      ];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        type: 'software_development',
+      });
+    });
+
+    it('clears filters when empty array is passed', async () => {
+      // First apply some filters
+      const filters = [{ type: 'status', value: { data: 'running' } }];
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      // Then clear filters
+      findIndexComponent().vm.$emit('filter', []);
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenLastCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+      });
+    });
+  });
+
+  describe('sorting', () => {
+    beforeEach(async () => {
+      await createWrapper();
+    });
+
+    it('handles sort correctly', async () => {
+      findIndexComponent().vm.$emit('sort', 'CREATED_ASC');
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'CREATED_ASC',
+      });
+    });
+  });
 });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
index 4e321c13e9afa6..c0e0324111b67c 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
@@ -91,6 +91,7 @@ describe('UserAgentsPlatformIndex', () => {
             before: null,
             last: null,
             excludeTypes: ['chat'],
+            sort: 'UPDATED_ASC',
           });
         });
 
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 06f751cdf5021d..8b0a02e8b20e5b 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -24799,6 +24799,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Automate"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Chat"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Concise"
 msgstr ""
 
@@ -24811,6 +24814,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Configuration source"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Convert to gitlab ci"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Could not display logs. Please try again."
 msgstr ""
 
@@ -24832,6 +24838,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Create merge request"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Created date"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Default"
 msgstr ""
 
@@ -24886,6 +24895,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Flow"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Flow Name"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Flow trigger created successfully."
 msgstr ""
 
@@ -24964,6 +24976,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Search files"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Search for a session"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Search issues"
 msgstr ""
 
@@ -24985,6 +25000,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Service account user"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Software Development"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Something went wrong while fetching Agent Flows"
 msgstr ""
 
@@ -25006,6 +25024,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Unknown"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Updated date"
+msgstr ""
+
 msgid "DuoAgentsPlatform|Write file"
 msgstr ""
 
-- 
GitLab


From cdd3e0c5fd0630017e85a8d22e1b3d9807a9a16b Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Tue, 9 Sep 2025 13:18:35 -0500
Subject: [PATCH 2/6] Feat: add search to agent sessions

Update graphql for sorting and search
Add new search bar with sorting
Add filtering by Flow name to search
Update specs

Changelog: changed
EE: true
---
 .../duo_agents_platform/components/common/agent_flow_list.vue   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
index f5924d580c715e..6963336a49c0b4 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
@@ -121,7 +121,7 @@ export default {
         :value="localFilters"
         sync-filter-and-sort
         terms-as-tokens
-        class="gl-grow gl-border-t-0 @sm/panel:gl-flex"
+        class="gl-grow gl-border-t-0 gl-p-4 @sm/panel:gl-flex"
         data-testid="agent-sessions-search-container"
         @onFilter="handleFilter"
         @onSort="handleSort"
-- 
GitLab


From 9740425c72b462726ce1eb5bcb3c424e5de3263c Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Mon, 29 Sep 2025 10:43:06 -0500
Subject: [PATCH 3/6] Update specs and add fuzzy search

Add client side fuzzy search
Update test cases for search
Add empty states
---
 .../ai/duo_agentic_chat/components/app.vue    |   2 +-
 .../components/common/agent_flow_list.vue     |  73 +---------
 .../ai/duo_agents_platform/constants.js       |   6 +
 .../project/project_agents_platform_index.vue |  35 +++--
 .../user/user_agents_platform_index.vue       |  29 ++--
 .../pages/index/duo_agents_platform_index.vue |  69 ++++++++-
 .../components/common/agent_flow_list_spec.js |  61 --------
 .../project_agents_platform_index_spec.js     |  80 +++++++---
 .../user/user_agents_platform_index_spec.js   | 137 +++++++++++++++++-
 .../index/duo_agents_platform_index_spec.js   |  98 +++++++++++++
 ee/spec/frontend/ai/mocks.js                  |  20 ++-
 locale/gitlab.pot                             |   9 +-
 12 files changed, 424 insertions(+), 195 deletions(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agentic_chat/components/app.vue b/ee/app/assets/javascripts/ai/duo_agentic_chat/components/app.vue
index 0f3974289a3760..78c896b4f7914c 100644
--- a/ee/app/assets/javascripts/ai/duo_agentic_chat/components/app.vue
+++ b/ee/app/assets/javascripts/ai/duo_agentic_chat/components/app.vue
@@ -178,7 +178,7 @@ export default {
         <template #mainview>
           <router-view
             v-bind="baseProps"
-            class="gl-flex gl-overflow-auto"
+            class="gl-overflow-auto"
             :class="siderail.classes"
             @chat-resize="onChatResize"
           />
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
index 6963336a49c0b4..97ea9039125a1e 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
@@ -1,10 +1,7 @@
 <script>
-import { GlEmptyState, GlFilteredSearchToken, GlKeysetPagination } from '@gitlab/ui';
+import { GlEmptyState, GlKeysetPagination } from '@gitlab/ui';
 import emptyStateIllustrationPath from '@gitlab/svgs/dist/illustrations/empty-state/empty-pipeline-md.svg';
 import EmptyResult from '~/vue_shared/components/empty_result.vue';
-import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
-import { OPERATORS_IS } from '~/vue_shared/components/filtered_search_bar/constants';
-import { s__ } from '~/locale';
 import { AGENTS_PLATFORM_SHOW_ROUTE } from '../../router/constants';
 import AgentFlowListItem from './agent_flow_list_item.vue';
 
@@ -12,7 +9,6 @@ export default {
   name: 'AgentFlowList',
   components: {
     EmptyResult,
-    FilteredSearchBar,
     GlEmptyState,
     GlKeysetPagination,
     AgentFlowListItem,
@@ -22,10 +18,6 @@ export default {
       required: true,
       type: Boolean,
     },
-    initialSort: {
-      required: true,
-      type: String,
-    },
     showProjectInfo: {
       required: false,
       type: Boolean,
@@ -40,64 +32,17 @@ export default {
       type: Object,
     },
   },
-  data() {
-    return {
-      localFilters: {},
-    };
-  },
   computed: {
     hasWorkflows() {
       return this.workflows?.length > 0;
     },
-    tokens() {
-      return [
-        {
-          type: 'flow-name',
-          title: s__('DuoAgentsPlatform|Flow Name'),
-          icon: 'flow-ai',
-          token: GlFilteredSearchToken,
-          operators: OPERATORS_IS,
-          unique: true,
-          options: [
-            { value: 'software_development', title: s__('DuoAgentsPlatform|Software Development') },
-            { value: 'convert_to_gitlab_ci', title: s__('DuoAgentsPlatform|Convert to gitlab ci') },
-            { value: 'chat', title: s__('DuoAgentsPlatform|Chat') },
-          ],
-        },
-      ];
-    },
   },
   methods: {
-    handleFilter(filters) {
-      this.localFilters = filters;
-      this.$emit('filter', filters);
-    },
-    handleSort(sortBy) {
-      this.$emit('sort', sortBy);
-    },
     displayPagination() {
       return this.workflowsPageInfo?.hasNextPage || this.workflowsPageInfo?.hasPreviousPage;
     },
   },
   showRoute: AGENTS_PLATFORM_SHOW_ROUTE,
-  availableSortOptions: [
-    {
-      id: 1,
-      title: s__('DuoAgentsPlatform|Created date'),
-      sortDirection: {
-        descending: 'CREATED_DESC',
-        ascending: 'CREATED_ASC',
-      },
-    },
-    {
-      id: 2,
-      title: s__('DuoAgentsPlatform|Updated date'),
-      sortDirection: {
-        descending: 'UPDATED_DESC',
-        ascending: 'UPDATED_ASC',
-      },
-    },
-  ],
   emptyStateIllustrationPath,
 };
 </script>
@@ -110,22 +55,6 @@ export default {
       :svg-path="$options.emptyStateIllustrationPath"
     />
     <template v-else>
-      <filtered-search-bar
-        namespace="duo-agents-platform"
-        recent-searches-storage-key="agent-sessions"
-        :tokens="tokens"
-        :search-input-placeholder="s__('DuoAgentsPlatform|Search for a session')"
-        :sort-options="$options.availableSortOptions"
-        :initial-sort-by="initialSort"
-        :initial-sort="initialSort"
-        :value="localFilters"
-        sync-filter-and-sort
-        terms-as-tokens
-        class="gl-grow gl-border-t-0 gl-p-4 @sm/panel:gl-flex"
-        data-testid="agent-sessions-search-container"
-        @onFilter="handleFilter"
-        @onSort="handleSort"
-      />
       <ul
         v-if="hasWorkflows"
         class="gl-divide-x-0 gl-divide-y-1 gl-divide-solid gl-divide-subtle gl-px-0"
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
index 80a7550fabe5a0..ce3931ea675f9f 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
@@ -1,3 +1,5 @@
+import { s__ } from '~/locale';
+
 export const AGENTFLOW_TYPE_JENKINS_TO_CI = 'convert_to_gitlab_ci';
 export const DUO_AGENTS_PLATFORM_POLLING_INTERVAL = 10000;
 
@@ -47,3 +49,7 @@ export const AGENT_PLATFORM_STATUS_ICON = {
     color: 'red',
   },
 };
+
+export const RAW_TEXT_WARNING = s__(
+  'DuoAgentsPlatform|Raw text search is not currently supported. Please use the available search tokens.',
+);
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
index 1446e68cdd5156..3fdd95e18c7d70 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
@@ -1,15 +1,17 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
+import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import getProjectAgentFlows from '../../graphql/queries/get_agent_flows.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
+import { RAW_TEXT_WARNING } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
   inject: ['projectPath'],
   data() {
     return {
-      allWorkflows: [],
+      hasInitialWorkflows: false,
       workflows: [],
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
@@ -31,14 +33,13 @@ export default {
         };
       },
       update(data) {
-        const workflows = data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+        const returnedWorkflows =
+          data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
 
-        // Store all workflows from initial load if not in search mode
-        if (!this.isSearchActive) {
-          this.allWorkflows = [...workflows];
-        }
+        if (!this.hasInitialWorkflows && returnedWorkflows.length > 0)
+          this.hasInitialWorkflows = true;
 
-        return workflows;
+        return returnedWorkflows;
       },
       result({ data }) {
         this.workflowsPageInfo = data?.project?.duoWorkflowWorkflows?.pageInfo || {};
@@ -55,18 +56,10 @@ export default {
     isLoadingWorkflows() {
       return this.$apollo.queries.workflows.loading;
     },
-    hasInitialWorkflows() {
-      return this.allWorkflows.length > 0;
-    },
   },
   methods: {
     handleSort(sortBy) {
-      if (this.currentSort === sortBy) {
-        return;
-      }
       this.currentSort = sortBy;
-
-      this.$apollo.queries.workflows.refetch();
     },
     handleFilter(filters) {
       const processedFilters = {};
@@ -74,13 +67,19 @@ export default {
       filters.forEach((filter) => {
         if (filter.type === 'flow-name' && filter.value?.data) {
           processedFilters.type = filter.value.data;
+        } else if (filter.type === FILTERED_SEARCH_TERM && filter.value?.data) {
+          processedFilters.freeTextSearch = filter.value.data.trim();
         }
       });
 
-      this.isSearchActive = Boolean(processedFilters.type);
-
+      this.isSearchActive = Boolean(processedFilters.type || processedFilters.freeTextSearch);
       this.currentFilters = processedFilters;
-      this.$apollo.queries.workflows.refetch();
+
+      if (processedFilters.freeTextSearch) {
+        createAlert({ message: RAW_TEXT_WARNING, type: 'warning' });
+      } else {
+        this.$apollo.queries.workflows.refetch();
+      }
     },
   },
 };
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
index 3d42a95abe0d79..7e86b94269d3cf 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
@@ -1,13 +1,16 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
+import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import getUserAgentFlows from '../../graphql/queries/get_user_agent_flow.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
+import { RAW_TEXT_WARNING } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
   data() {
     return {
+      hasInitialWorkflows: false,
       workflows: [],
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
@@ -30,7 +33,12 @@ export default {
         };
       },
       update(data) {
-        return data?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+        const returnedWorkflows = data?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+
+        if (!this.hasInitialWorkflows && returnedWorkflows.length > 0)
+          this.hasInitialWorkflows = true;
+
+        return returnedWorkflows;
       },
       result({ data }) {
         this.workflowsPageInfo = data?.duoWorkflowWorkflows?.pageInfo || {};
@@ -50,12 +58,7 @@ export default {
   },
   methods: {
     handleSort(sortBy) {
-      if (this.currentSort === sortBy) {
-        return;
-      }
       this.currentSort = sortBy;
-
-      this.$apollo.queries.workflows.refetch();
     },
     handleFilter(filters) {
       const processedFilters = {};
@@ -63,13 +66,19 @@ export default {
       filters.forEach((filter) => {
         if (filter.type === 'flow-name' && filter.value?.data) {
           processedFilters.type = filter.value.data;
+        } else if (filter.type === FILTERED_SEARCH_TERM && filter.value?.data) {
+          processedFilters.freeTextSearch = filter.value.data.trim();
         }
       });
 
-      this.isSearchActive = Boolean(processedFilters.type);
-
+      this.isSearchActive = Boolean(processedFilters.type || processedFilters.freeTextSearch);
       this.currentFilters = processedFilters;
-      this.$apollo.queries.workflows.refetch();
+
+      if (processedFilters.freeTextSearch) {
+        createAlert({ message: RAW_TEXT_WARNING, type: 'warning' });
+      } else {
+        this.$apollo.queries.workflows.refetch();
+      }
     },
   },
 };
@@ -78,7 +87,7 @@ export default {
   <duo-agents-platform-index
     :initial-sort="currentSort"
     :is-loading-workflows="isLoadingWorkflows"
-    :has-initial-workflows="true"
+    :has-initial-workflows="hasInitialWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
     :workflow-query="$apollo.queries.workflows"
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
index e09cba5f5641a1..1f1252aa39dad8 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
@@ -1,7 +1,10 @@
 <script>
-import { GlExperimentBadge, GlSkeletonLoader } from '@gitlab/ui';
+import { GlExperimentBadge, GlSkeletonLoader, GlFilteredSearchToken } from '@gitlab/ui';
 import emptyStateIllustrationPath from '@gitlab/svgs/dist/illustrations/empty-state/empty-pipeline-md.svg?url';
 import PageHeading from '~/vue_shared/components/page_heading.vue';
+import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
+import { OPERATORS_IS } from '~/vue_shared/components/filtered_search_bar/constants';
+import { __, s__ } from '~/locale';
 import AgentFlowList from '../../components/common/agent_flow_list.vue';
 import { AGENT_PLATFORM_INDEX_COMPONENT_NAME } from '../../constants';
 
@@ -9,6 +12,7 @@ export default {
   name: AGENT_PLATFORM_INDEX_COMPONENT_NAME,
   components: {
     AgentFlowList,
+    FilteredSearchBar,
     GlExperimentBadge,
     GlSkeletonLoader,
     PageHeading,
@@ -19,10 +23,6 @@ export default {
     },
   },
   props: {
-    hasInitialWorkflows: {
-      required: true,
-      type: Boolean,
-    },
     initialSort: {
       required: true,
       type: String,
@@ -31,6 +31,10 @@ export default {
       required: true,
       type: Boolean,
     },
+    hasInitialWorkflows: {
+      required: true,
+      type: Boolean,
+    },
     workflowQuery: {
       required: true,
       type: Object,
@@ -68,8 +72,46 @@ export default {
         last: 20,
       });
     },
+    handleFilter(filters) {
+      this.$emit('filter', filters);
+    },
+    handleSort(sortBy) {
+      this.$emit('sort', sortBy);
+    },
   },
   emptyStateIllustrationPath,
+  availableSortOptions: [
+    {
+      id: 1,
+      title: __('Created date'),
+      sortDirection: {
+        descending: 'CREATED_DESC',
+        ascending: 'CREATED_ASC',
+      },
+    },
+    {
+      id: 2,
+      title: s__('DuoAgentsPlatform|Updated date'),
+      sortDirection: {
+        descending: 'UPDATED_DESC',
+        ascending: 'UPDATED_ASC',
+      },
+    },
+  ],
+  tokens: [
+    {
+      type: 'flow-name',
+      title: s__('DuoAgentsPlatform|Flow Name'),
+      icon: 'flow-ai',
+      token: GlFilteredSearchToken,
+      operators: OPERATORS_IS,
+      unique: true,
+      options: [
+        { value: 'software_development', title: s__('DuoAgentsPlatform|Software Development') },
+        { value: 'convert_to_gitlab_ci', title: s__('DuoAgentsPlatform|Convert to gitlab ci') },
+      ],
+    },
+  ],
 };
 </script>
 <template>
@@ -82,6 +124,21 @@ export default {
         </div>
       </template>
     </page-heading>
+    <filtered-search-bar
+      v-if="hasInitialWorkflows"
+      namespace="duo-agents-platform"
+      :tokens="$options.tokens"
+      :search-input-placeholder="s__('DuoAgentsPlatform|Search for a session')"
+      :sort-options="$options.availableSortOptions"
+      :initial-sort-by="initialSort"
+      :initial-sort="initialSort"
+      sync-filter-and-sort
+      terms-as-tokens
+      class="gl-grow gl-border-t-0 gl-p-4"
+      data-testid="agent-sessions-search-container"
+      @onFilter="handleFilter"
+      @onSort="handleSort"
+    />
     <div
       v-if="isLoadingWorkflows"
       class="gl-flex gl-w-full gl-flex-col gl-gap-5 gl-p-5"
@@ -100,8 +157,6 @@ export default {
       :workflows-page-info="workflowsPageInfo"
       @next-page="handleNextPage"
       @prev-page="handlePrevPage"
-      @sort="$emit('sort', $event)"
-      @filter="$emit('filter', $event)"
     />
   </div>
 </template>
diff --git a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
index 7a453421e74114..1047b0e39ef251 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
@@ -2,7 +2,6 @@ import { GlEmptyState, GlKeysetPagination } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import AgentFlowList from 'ee/ai/duo_agents_platform/components/common/agent_flow_list.vue';
 import AgentFlowListItem from 'ee/ai/duo_agents_platform/components/common/agent_flow_list_item.vue';
-import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import { mockAgentFlows } from '../../../mocks';
 
 describe('AgentFlowList', () => {
@@ -23,7 +22,6 @@ describe('AgentFlowList', () => {
       },
     });
   };
-  const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
 
   describe('when component is mounted', () => {
     beforeEach(() => {
@@ -108,65 +106,6 @@ describe('AgentFlowList', () => {
           });
         });
       });
-
-      it('renders the filtered search bar with sort options', () => {
-        expect(findFilteredSearchBar().exists()).toBe(true);
-        expect(findFilteredSearchBar().props('sortOptions')).toEqual([
-          {
-            id: 1,
-            title: 'Created date',
-            sortDirection: {
-              descending: 'CREATED_DESC',
-              ascending: 'CREATED_ASC',
-            },
-          },
-          {
-            id: 2,
-            title: 'Updated date',
-            sortDirection: {
-              descending: 'UPDATED_DESC',
-              ascending: 'UPDATED_ASC',
-            },
-          },
-        ]);
-      });
-
-      it('renders the filtered search bar with filter tokens', () => {
-        const tokens = findFilteredSearchBar().props('tokens');
-
-        expect(tokens).toHaveLength(1);
-
-        expect(tokens[0]).toMatchObject({
-          type: 'flow-name',
-          title: 'Flow Name',
-          icon: 'flow-ai',
-          unique: true,
-        });
-        expect(tokens[0].options).toEqual([
-          { value: 'software_development', title: 'Software Development' },
-          { value: 'convert_to_gitlab_ci', title: 'Convert to gitlab ci' },
-          { value: 'chat', title: 'Chat' },
-        ]);
-      });
-
-      describe('when sorting', () => {
-        it('emits sort event when onSort is triggered', () => {
-          findFilteredSearchBar().vm.$emit('onSort', 'UPDATED_DESC');
-
-          expect(wrapper.emitted('sort')).toHaveLength(1);
-          expect(wrapper.emitted('sort')[0]).toEqual(['UPDATED_DESC']);
-        });
-      });
-
-      describe('when filtering', () => {
-        it('emits filter event when onFilter is triggered', () => {
-          const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
-          findFilteredSearchBar().vm.$emit('onFilter', filters);
-
-          expect(wrapper.emitted('filter')).toHaveLength(1);
-          expect(wrapper.emitted('filter')[0]).toEqual([filters]);
-        });
-      });
     });
   });
 
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
index a09ba2d8779868..9c3e15cbe61b82 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
@@ -7,10 +7,14 @@ import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import DuoAgentsPlatformIndex from 'ee/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue';
 import { createAlert } from '~/alert';
+import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import { mockAgentFlowsResponse } from '../../../mocks';
 
 Vue.use(VueApollo);
 jest.mock('~/alert');
+jest.mock('ee/ai/duo_agents_platform/utils', () => ({
+  filterAgentSessionsByFuzzyText: jest.fn(),
+}));
 
 describe('ProjectAgentsPlatformIndex', () => {
   let wrapper;
@@ -40,6 +44,7 @@ describe('ProjectAgentsPlatformIndex', () => {
     await createWrapper();
 
     expect(findIndexComponent().props()).toMatchObject({
+      initialSort: 'UPDATED_ASC',
       isLoadingWorkflows: expect.any(Boolean),
       workflows: expect.any(Array),
       workflowsPageInfo: expect.any(Object),
@@ -149,8 +154,8 @@ describe('ProjectAgentsPlatformIndex', () => {
       await createWrapper();
     });
 
-    it('handles status filter correctly', async () => {
-      const filters = [{ type: 'status', value: { data: 'running' } }];
+    it('handles flow-name filter correctly', async () => {
+      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
 
       findIndexComponent().vm.$emit('filter', filters);
       await waitForPromises();
@@ -161,30 +166,34 @@ describe('ProjectAgentsPlatformIndex', () => {
         first: 20,
         last: null,
         sort: 'UPDATED_ASC',
+        type: 'convert_to_gitlab_ci',
       });
     });
 
-    it('handles flow-name filter correctly', async () => {
-      const filters = [{ type: 'flow-name', value: { data: 'chat' } }];
+    it('sets isSearchActive to true when filters are applied', async () => {
+      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
 
       findIndexComponent().vm.$emit('filter', filters);
       await waitForPromises();
 
-      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        type: 'chat',
-      });
+      expect(wrapper.vm.isSearchActive).toBe(true);
     });
 
-    it('handles multiple filters correctly', async () => {
-      const filters = [
-        { type: 'status', value: { data: 'finished' } },
-        { type: 'flow-name', value: { data: 'software_development' } },
-      ];
+    it('sets isSearchActive to false when no filters are applied', async () => {
+      // First apply filters
+      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      // Then clear filters
+      findIndexComponent().vm.$emit('filter', []);
+      await waitForPromises();
+
+      expect(wrapper.vm.isSearchActive).toBe(false);
+    });
+
+    it('refetches data when no free text search is present', async () => {
+      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
 
       findIndexComponent().vm.$emit('filter', filters);
       await waitForPromises();
@@ -201,7 +210,7 @@ describe('ProjectAgentsPlatformIndex', () => {
 
     it('clears filters when empty array is passed', async () => {
       // First apply some filters
-      const filters = [{ type: 'status', value: { data: 'running' } }];
+      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
       findIndexComponent().vm.$emit('filter', filters);
       await waitForPromises();
 
@@ -209,12 +218,38 @@ describe('ProjectAgentsPlatformIndex', () => {
       findIndexComponent().vm.$emit('filter', []);
       await waitForPromises();
 
+      expect(wrapper.vm.currentFilters).toEqual({});
+      expect(getAgentFlowsHandler).toHaveBeenLastCalledWith({
+        projectPath,
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+      });
+    });
+
+    it('refetches data when switching from free text search to other filters', async () => {
+      // Apply free text search first (this should not trigger additional server calls)
+      const searchFilters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
+      findIndexComponent().vm.$emit('filter', searchFilters);
+      await waitForPromises();
+
+      // Reset the mock to count only the calls from the filter switch
+      getAgentFlowsHandler.mockClear();
+
+      // Switch to flow-name filter
+      const nonSearchFilters = [{ type: 'flow-name', value: { data: 'software_development' } }];
+      findIndexComponent().vm.$emit('filter', nonSearchFilters);
+      await waitForPromises();
+
+      // Verify that server calls were made and the correct parameters were used
       expect(getAgentFlowsHandler).toHaveBeenLastCalledWith({
         projectPath,
         before: null,
         first: 20,
         last: null,
         sort: 'UPDATED_ASC',
+        type: 'software_development',
       });
     });
   });
@@ -236,5 +271,14 @@ describe('ProjectAgentsPlatformIndex', () => {
         sort: 'CREATED_ASC',
       });
     });
+
+    it('does not refetch when sort value is the same', async () => {
+      const initialCallCount = getAgentFlowsHandler.mock.calls.length;
+
+      findIndexComponent().vm.$emit('sort', 'UPDATED_ASC');
+      await waitForPromises();
+
+      expect(getAgentFlowsHandler).toHaveBeenCalledTimes(initialCallCount);
+    });
   });
 });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
index c0e0324111b67c..bbfb2fa1ca6603 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
@@ -7,6 +7,7 @@ import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import DuoAgentsPlatformIndex from 'ee/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue';
 import { createAlert } from '~/alert';
+import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import { mockAgentFlowEdges } from '../../../mocks';
 
 Vue.use(VueApollo);
@@ -90,8 +91,8 @@ describe('UserAgentsPlatformIndex', () => {
             first: 20,
             before: null,
             last: null,
-            excludeTypes: ['chat'],
             sort: 'UPDATED_ASC',
+            excludeTypes: ['chat'],
           });
         });
 
@@ -267,4 +268,138 @@ describe('UserAgentsPlatformIndex', () => {
       });
     });
   });
+
+  describe('filtering', () => {
+    beforeEach(async () => {
+      await createWrapper();
+    });
+
+    it('handles flow-name filter correctly', async () => {
+      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        excludeTypes: ['chat'],
+        type: 'software_development',
+      });
+    });
+
+    it('sets isSearchActive to true when filters are applied', async () => {
+      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(wrapper.vm.isSearchActive).toBe(true);
+    });
+
+    it('sets isSearchActive to false when no filters are applied', async () => {
+      // First apply filters
+      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      // Then clear filters
+      findIndexComponent().vm.$emit('filter', []);
+      await waitForPromises();
+
+      expect(wrapper.vm.isSearchActive).toBe(false);
+    });
+
+    it('refetches data when no free text search is present', async () => {
+      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
+
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        excludeTypes: ['chat'],
+        type: 'convert_to_gitlab_ci',
+      });
+    });
+
+    it('clears filters when empty array is passed', async () => {
+      // First apply some filters
+      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
+      findIndexComponent().vm.$emit('filter', filters);
+      await waitForPromises();
+
+      // Then clear filters
+      findIndexComponent().vm.$emit('filter', []);
+      await waitForPromises();
+
+      expect(wrapper.vm.currentFilters).toEqual({});
+      expect(getUserAgentFlowsHandler).toHaveBeenLastCalledWith({
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        excludeTypes: ['chat'],
+        type: 'software_development',
+      });
+    });
+
+    it('refetches data when switching from free text search to other filters', async () => {
+      // Apply free text search first (this should not trigger additional server calls)
+      const searchFilters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
+      findIndexComponent().vm.$emit('filter', searchFilters);
+      await waitForPromises();
+
+      // Reset the mock to count only the calls from the filter switch
+      getUserAgentFlowsHandler.mockClear();
+
+      // Switch to flow-name filter
+      const nonSearchFilters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
+      findIndexComponent().vm.$emit('filter', nonSearchFilters);
+      await waitForPromises();
+
+      // Verify that server calls were made and the correct parameters were used
+      expect(getUserAgentFlowsHandler).toHaveBeenLastCalledWith({
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'UPDATED_ASC',
+        excludeTypes: ['chat'],
+        type: 'convert_to_gitlab_ci',
+      });
+    });
+  });
+
+  describe('sorting', () => {
+    beforeEach(async () => {
+      await createWrapper();
+    });
+
+    it('handles sort correctly', async () => {
+      findIndexComponent().vm.$emit('sort', 'CREATED_ASC');
+      await waitForPromises();
+
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
+        before: null,
+        first: 20,
+        last: null,
+        sort: 'CREATED_ASC',
+        excludeTypes: ['chat'],
+      });
+    });
+
+    it('does not refetch when sort value is the same', async () => {
+      const initialCallCount = getUserAgentFlowsHandler.mock.calls.length;
+
+      findIndexComponent().vm.$emit('sort', 'UPDATED_ASC');
+      await waitForPromises();
+
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(initialCallCount);
+    });
+  });
 });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
index 73a9255528628d..358a6c44344cfa 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
@@ -4,6 +4,7 @@ import PageHeading from '~/vue_shared/components/page_heading.vue';
 
 import AgentFlowList from 'ee/ai/duo_agents_platform/components/common/agent_flow_list.vue';
 import AgentsPlatformIndex from 'ee/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue';
+import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 
 import waitForPromises from 'helpers/wait_for_promises';
 
@@ -44,6 +45,7 @@ describe('AgentsPlatformIndex', () => {
   const findLoadingIcon = () => wrapper.find('[data-testid="loading-container"]');
   const findPageHeading = () => wrapper.findComponent(PageHeading);
   const findExperimentBadge = () => wrapper.findComponent(GlExperimentBadge);
+  const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
 
   describe('when not in side panel view', () => {
     beforeEach(() => {
@@ -101,6 +103,102 @@ describe('AgentsPlatformIndex', () => {
     });
   });
 
+  describe('filtering and sorting', () => {
+    beforeEach(async () => {
+      await createWrapper({ props: { hasInitialWorkflows: true } });
+    });
+
+    it('renders the filtered search bar with correct props', () => {
+      expect(findFilteredSearchBar().exists()).toBe(true);
+      expect(findFilteredSearchBar().props()).toMatchObject({
+        namespace: 'duo-agents-platform',
+        searchInputPlaceholder: 'Search for a session',
+        syncFilterAndSort: true,
+        termsAsTokens: true,
+      });
+    });
+
+    it('renders the filtered search bar with sort options', () => {
+      expect(findFilteredSearchBar().props('sortOptions')).toEqual([
+        {
+          id: 1,
+          title: 'Created date',
+          sortDirection: {
+            descending: 'CREATED_DESC',
+            ascending: 'CREATED_ASC',
+          },
+        },
+        {
+          id: 2,
+          title: 'Updated date',
+          sortDirection: {
+            descending: 'UPDATED_DESC',
+            ascending: 'UPDATED_ASC',
+          },
+        },
+      ]);
+    });
+
+    it('renders the filtered search bar with filter tokens', () => {
+      const tokens = findFilteredSearchBar().props('tokens');
+
+      expect(tokens).toHaveLength(1);
+
+      expect(tokens[0]).toMatchObject({
+        type: 'flow-name',
+        title: 'Flow Name',
+        icon: 'flow-ai',
+        unique: true,
+      });
+      expect(tokens[0].options).toEqual([
+        { value: 'software_development', title: 'Software Development' },
+        { value: 'convert_to_gitlab_ci', title: 'Convert to gitlab ci' },
+      ]);
+    });
+
+    describe('when sorting', () => {
+      it('emits sort event when onSort is triggered', () => {
+        findFilteredSearchBar().vm.$emit('onSort', 'UPDATED_DESC');
+
+        expect(wrapper.emitted('sort')).toHaveLength(1);
+        expect(wrapper.emitted('sort')[0]).toEqual(['UPDATED_DESC']);
+      });
+    });
+
+    describe('when filtering', () => {
+      const searchTestCases = [
+        {
+          name: 'with flow-name token',
+          filters: [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }],
+        },
+        {
+          name: 'with free text search',
+          filters: [{ type: 'filtered-search-term', value: { data: 'software dev' } }],
+        },
+        {
+          name: 'with combined token and free text search',
+          filters: [
+            { type: 'flow-name', value: { data: 'software_development' } },
+            { type: 'filtered-search-term', value: { data: 'dev' } },
+          ],
+        },
+        {
+          name: 'when filters are cleared',
+          filters: [],
+        },
+      ];
+
+      searchTestCases.forEach(({ name, filters }) => {
+        it(`emits filter event ${name}`, () => {
+          findFilteredSearchBar().vm.$emit('onFilter', filters);
+
+          expect(wrapper.emitted('filter')).toHaveLength(1);
+          expect(wrapper.emitted('filter')[0]).toEqual([filters]);
+        });
+      });
+    });
+  });
+
   describe('pagination', () => {
     beforeEach(async () => {
       await createWrapper();
diff --git a/ee/spec/frontend/ai/mocks.js b/ee/spec/frontend/ai/mocks.js
index b23e3705401657..e5412e51cad889 100644
--- a/ee/spec/frontend/ai/mocks.js
+++ b/ee/spec/frontend/ai/mocks.js
@@ -24,7 +24,7 @@ export const mockAgentFlowEdges = [
       status: 'RUNNING',
       humanStatus: 'running',
       updatedAt: '2024-01-02T00:00:00Z',
-      workflowDefinition: 'convert_to_ci',
+      workflowDefinition: 'convert_to_gitlab_ci',
       project: {
         id: 'gid://gitlab/Project/2',
         name: 'Another Project',
@@ -35,6 +35,24 @@ export const mockAgentFlowEdges = [
       },
     },
   },
+  {
+    node: {
+      __typename: 'DuoWorkflow',
+      id: 'gid://gitlab/DuoWorkflow::Workflow/3',
+      status: 'CREATED',
+      humanStatus: 'created',
+      updatedAt: '2024-01-03T00:00:00Z',
+      workflowDefinition: 'chat',
+      project: {
+        id: 'gid://gitlab/Project/3',
+        name: 'Chat Project',
+        namespace: {
+          id: 'gid://gitlab/Group/2',
+          name: 'test-group',
+        },
+      },
+    },
+  },
 ];
 
 export const mockAgentFlows = mockAgentFlowEdges.map((edge) => edge.node);
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 8b0a02e8b20e5b..f091bf182467c7 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -24799,9 +24799,6 @@ msgstr ""
 msgid "DuoAgentsPlatform|Automate"
 msgstr ""
 
-msgid "DuoAgentsPlatform|Chat"
-msgstr ""
-
 msgid "DuoAgentsPlatform|Concise"
 msgstr ""
 
@@ -24838,9 +24835,6 @@ msgstr ""
 msgid "DuoAgentsPlatform|Create merge request"
 msgstr ""
 
-msgid "DuoAgentsPlatform|Created date"
-msgstr ""
-
 msgid "DuoAgentsPlatform|Default"
 msgstr ""
 
@@ -24964,6 +24958,9 @@ msgstr ""
 msgid "DuoAgentsPlatform|Prompt"
 msgstr ""
 
+msgid "DuoAgentsPlatform|Raw text search is not currently supported. Please use the available search tokens."
+msgstr ""
+
 msgid "DuoAgentsPlatform|Read file"
 msgstr ""
 
-- 
GitLab


From 9392b1d8c9dad08e9169a0eba0a054178159f1ae Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Thu, 2 Oct 2025 07:44:40 -0400
Subject: [PATCH 4/6] Remove fuzzy search and add alert

Centralize sort and filtering
---
 .../components/common/agent_flow_list.vue     |   4 +-
 .../ai/duo_agents_platform/constants.js       |   6 -
 .../project/project_agents_platform_index.vue |  49 +-----
 .../user/user_agents_platform_index.vue       |  48 +----
 .../pages/index/duo_agents_platform_index.vue |  84 +++++++--
 .../components/common/agent_flow_list_spec.js |  18 +-
 .../project_agents_platform_index_spec.js     | 166 ++++--------------
 .../user/user_agents_platform_index_spec.js   | 162 ++---------------
 .../index/duo_agents_platform_index_spec.js   | 132 ++++++++++----
 locale/gitlab.pot                             |   3 -
 10 files changed, 250 insertions(+), 422 deletions(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
index 97ea9039125a1e..1d3df8d600e454 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/components/common/agent_flow_list.vue
@@ -14,7 +14,7 @@ export default {
     AgentFlowListItem,
   },
   props: {
-    hasInitialWorkflows: {
+    showEmptyState: {
       required: true,
       type: Boolean,
     },
@@ -49,7 +49,7 @@ export default {
 <template>
   <div :class="{ 'gl-self-center': !hasWorkflows }" class="gl-w-full">
     <gl-empty-state
-      v-if="!hasInitialWorkflows"
+      v-if="showEmptyState"
       :title="s__('DuoAgentsPlatform|No agent sessions yet')"
       :description="s__('DuoAgentsPlatform|New agent sessions will appear here.')"
       :svg-path="$options.emptyStateIllustrationPath"
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
index ce3931ea675f9f..80a7550fabe5a0 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
@@ -1,5 +1,3 @@
-import { s__ } from '~/locale';
-
 export const AGENTFLOW_TYPE_JENKINS_TO_CI = 'convert_to_gitlab_ci';
 export const DUO_AGENTS_PLATFORM_POLLING_INTERVAL = 10000;
 
@@ -49,7 +47,3 @@ export const AGENT_PLATFORM_STATUS_ICON = {
     color: 'red',
   },
 };
-
-export const RAW_TEXT_WARNING = s__(
-  'DuoAgentsPlatform|Raw text search is not currently supported. Please use the available search tokens.',
-);
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
index 3fdd95e18c7d70..8bd0dc3f4cdb0d 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
@@ -1,22 +1,18 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
-import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import getProjectAgentFlows from '../../graphql/queries/get_agent_flows.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
-import { RAW_TEXT_WARNING } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
   inject: ['projectPath'],
   data() {
     return {
-      hasInitialWorkflows: false,
       workflows: [],
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
-      currentFilters: {},
-      isSearchActive: false,
+      hasInitialWorkflows: false,
     };
   },
   apollo: {
@@ -29,20 +25,18 @@ export default {
           before: null,
           last: null,
           sort: this.currentSort,
-          ...this.currentFilters,
         };
       },
       update(data) {
-        const returnedWorkflows =
-          data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
-
-        if (!this.hasInitialWorkflows && returnedWorkflows.length > 0)
-          this.hasInitialWorkflows = true;
-
-        return returnedWorkflows;
+        return data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
       },
       result({ data }) {
         this.workflowsPageInfo = data?.project?.duoWorkflowWorkflows?.pageInfo || {};
+
+        const workflows = data?.project?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+        if (workflows.length > 0) {
+          this.hasInitialWorkflows = true;
+        }
       },
       error(error) {
         createAlert({
@@ -57,42 +51,15 @@ export default {
       return this.$apollo.queries.workflows.loading;
     },
   },
-  methods: {
-    handleSort(sortBy) {
-      this.currentSort = sortBy;
-    },
-    handleFilter(filters) {
-      const processedFilters = {};
-
-      filters.forEach((filter) => {
-        if (filter.type === 'flow-name' && filter.value?.data) {
-          processedFilters.type = filter.value.data;
-        } else if (filter.type === FILTERED_SEARCH_TERM && filter.value?.data) {
-          processedFilters.freeTextSearch = filter.value.data.trim();
-        }
-      });
-
-      this.isSearchActive = Boolean(processedFilters.type || processedFilters.freeTextSearch);
-      this.currentFilters = processedFilters;
-
-      if (processedFilters.freeTextSearch) {
-        createAlert({ message: RAW_TEXT_WARNING, type: 'warning' });
-      } else {
-        this.$apollo.queries.workflows.refetch();
-      }
-    },
-  },
 };
 </script>
 <template>
   <duo-agents-platform-index
+    :has-initial-workflows="hasInitialWorkflows"
     :initial-sort="currentSort"
     :is-loading-workflows="isLoadingWorkflows"
-    :has-initial-workflows="hasInitialWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
     :workflow-query="$apollo.queries.workflows"
-    @sort="handleSort"
-    @filter="handleFilter"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
index 7e86b94269d3cf..820c931ceb8984 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
@@ -1,21 +1,17 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
-import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import getUserAgentFlows from '../../graphql/queries/get_user_agent_flow.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
-import { RAW_TEXT_WARNING } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
   data() {
     return {
-      hasInitialWorkflows: false,
       workflows: [],
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
-      currentFilters: {},
-      isSearchActive: false,
+      hasInitialWorkflows: false,
     };
   },
   apollo: {
@@ -29,19 +25,18 @@ export default {
           last: null,
           excludeTypes: ['chat'],
           sort: this.currentSort,
-          ...this.currentFilters,
         };
       },
       update(data) {
-        const returnedWorkflows = data?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
-
-        if (!this.hasInitialWorkflows && returnedWorkflows.length > 0)
-          this.hasInitialWorkflows = true;
-
-        return returnedWorkflows;
+        return data?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
       },
       result({ data }) {
         this.workflowsPageInfo = data?.duoWorkflowWorkflows?.pageInfo || {};
+
+        const workflows = data?.duoWorkflowWorkflows?.edges?.map((w) => w.node) || [];
+        if (workflows.length > 0) {
+          this.hasInitialWorkflows = true;
+        }
       },
       error(error) {
         createAlert({
@@ -56,43 +51,16 @@ export default {
       return this.$apollo.queries.workflows.loading;
     },
   },
-  methods: {
-    handleSort(sortBy) {
-      this.currentSort = sortBy;
-    },
-    handleFilter(filters) {
-      const processedFilters = {};
-
-      filters.forEach((filter) => {
-        if (filter.type === 'flow-name' && filter.value?.data) {
-          processedFilters.type = filter.value.data;
-        } else if (filter.type === FILTERED_SEARCH_TERM && filter.value?.data) {
-          processedFilters.freeTextSearch = filter.value.data.trim();
-        }
-      });
-
-      this.isSearchActive = Boolean(processedFilters.type || processedFilters.freeTextSearch);
-      this.currentFilters = processedFilters;
-
-      if (processedFilters.freeTextSearch) {
-        createAlert({ message: RAW_TEXT_WARNING, type: 'warning' });
-      } else {
-        this.$apollo.queries.workflows.refetch();
-      }
-    },
-  },
 };
 </script>
 <template>
   <duo-agents-platform-index
+    :has-initial-workflows="hasInitialWorkflows"
     :initial-sort="currentSort"
     :is-loading-workflows="isLoadingWorkflows"
-    :has-initial-workflows="hasInitialWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
     :workflow-query="$apollo.queries.workflows"
     class="gl-min-w-full"
-    @sort="handleSort"
-    @filter="handleFilter"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
index 1f1252aa39dad8..b8591f080b43f8 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
@@ -1,9 +1,12 @@
 <script>
-import { GlExperimentBadge, GlSkeletonLoader, GlFilteredSearchToken } from '@gitlab/ui';
+import { GlAlert, GlExperimentBadge, GlSkeletonLoader, GlFilteredSearchToken } from '@gitlab/ui';
 import emptyStateIllustrationPath from '@gitlab/svgs/dist/illustrations/empty-state/empty-pipeline-md.svg?url';
 import PageHeading from '~/vue_shared/components/page_heading.vue';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
-import { OPERATORS_IS } from '~/vue_shared/components/filtered_search_bar/constants';
+import {
+  OPERATORS_IS,
+  FILTERED_SEARCH_TERM,
+} from '~/vue_shared/components/filtered_search_bar/constants';
 import { __, s__ } from '~/locale';
 import AgentFlowList from '../../components/common/agent_flow_list.vue';
 import { AGENT_PLATFORM_INDEX_COMPONENT_NAME } from '../../constants';
@@ -13,6 +16,7 @@ export default {
   components: {
     AgentFlowList,
     FilteredSearchBar,
+    GlAlert,
     GlExperimentBadge,
     GlSkeletonLoader,
     PageHeading,
@@ -23,6 +27,10 @@ export default {
     },
   },
   props: {
+    hasInitialWorkflows: {
+      required: true,
+      type: Boolean,
+    },
     initialSort: {
       required: true,
       type: String,
@@ -31,10 +39,6 @@ export default {
       required: true,
       type: Boolean,
     },
-    hasInitialWorkflows: {
-      required: true,
-      type: Boolean,
-    },
     workflowQuery: {
       required: true,
       type: Object,
@@ -48,10 +52,30 @@ export default {
       type: Object,
     },
   },
+  data() {
+    return {
+      showAlert: false,
+      currentFilters: [],
+    };
+  },
   computed: {
     headerClass() {
       return this.isSidePanelView ? 'gl-mt-0' : '';
     },
+    showEmptyState() {
+      return !this.hasInitialWorkflows;
+    },
+    processedFiltersForGraphQL() {
+      const processedFilters = {};
+
+      this.currentFilters.forEach((filter) => {
+        if (filter.type === 'flow-name' && filter.value?.data) {
+          processedFilters.type = filter.value.data;
+        }
+      });
+
+      return processedFilters;
+    },
   },
   methods: {
     handleNextPage() {
@@ -72,11 +96,36 @@ export default {
         last: 20,
       });
     },
+    handleSort(sortBy) {
+      this.workflowQuery.refetch({
+        ...this.workflowQuery.variables,
+        sort: sortBy,
+      });
+    },
     handleFilter(filters) {
-      this.$emit('filter', filters);
+      if (this.hasUnsupportedTextSearch(filters)) {
+        this.showAlert = true;
+        this.currentFilters = []; // Clear the filters
+        this.$forceUpdate(); // Force re-render to clear the search input
+        return;
+      }
+
+      this.showAlert = false;
+      this.currentFilters = filters;
+      this.refetchWithFilters(this.processedFiltersForGraphQL);
     },
-    handleSort(sortBy) {
-      this.$emit('sort', sortBy);
+    hasUnsupportedTextSearch(filters) {
+      return filters.some((filter) => filter.type === FILTERED_SEARCH_TERM && filter.value?.data);
+    },
+    refetchWithFilters(processedFilters) {
+      this.workflowQuery.refetch({
+        ...this.workflowQuery.variables,
+        type: undefined, // Clear previous filter values when no filters are applied
+        ...processedFilters,
+      });
+    },
+    dismissAlert() {
+      this.showAlert = false;
     },
   },
   emptyStateIllustrationPath,
@@ -91,7 +140,7 @@ export default {
     },
     {
       id: 2,
-      title: s__('DuoAgentsPlatform|Updated date'),
+      title: __('Updated date'),
       sortDirection: {
         descending: 'UPDATED_DESC',
         ascending: 'UPDATED_ASC',
@@ -124,6 +173,19 @@ export default {
         </div>
       </template>
     </page-heading>
+    <gl-alert
+      v-if="showAlert"
+      variant="warning"
+      dismissible
+      class="gl-mx-4 gl-mt-2"
+      @dismiss="dismissAlert"
+    >
+      {{
+        s__(
+          'DuoAgentsPlatform|Raw text search is not currently supported. Please use the available search tokens.',
+        )
+      }}
+    </gl-alert>
     <filtered-search-bar
       v-if="hasInitialWorkflows"
       namespace="duo-agents-platform"
@@ -151,7 +213,7 @@ export default {
     <agent-flow-list
       v-else
       :show-project-info="isSidePanelView"
-      :has-initial-workflows="hasInitialWorkflows"
+      :show-empty-state="showEmptyState"
       :initial-sort="initialSort"
       :workflows="workflows"
       :workflows-page-info="workflowsPageInfo"
diff --git a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
index 1047b0e39ef251..b796723be731a6 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/components/common/agent_flow_list_spec.js
@@ -14,7 +14,7 @@ describe('AgentFlowList', () => {
   const createWrapper = (props = {}) => {
     wrapper = shallowMount(AgentFlowList, {
       propsData: {
-        hasInitialWorkflows: true,
+        showEmptyState: false,
         initialSort: 'CREATED_DESC',
         workflows: mockAgentFlows,
         workflowsPageInfo: {},
@@ -30,7 +30,7 @@ describe('AgentFlowList', () => {
 
     describe('and there are no workflows', () => {
       beforeEach(() => {
-        createWrapper({ hasInitialWorkflows: false, workflows: [] });
+        createWrapper({ showEmptyState: true, workflows: [] });
       });
 
       it('renders the emptyState', () => {
@@ -50,7 +50,7 @@ describe('AgentFlowList', () => {
     describe('when there are workflows', () => {
       beforeEach(() => {
         createWrapper({
-          hasInitialWorkflows: true,
+          showEmptyState: false,
           workflows: mockAgentFlows,
           workflowsPageInfo: {
             startCursor: 'start',
@@ -68,7 +68,7 @@ describe('AgentFlowList', () => {
       describe('when showProjectInfo is false', () => {
         beforeEach(() => {
           createWrapper({
-            hasInitialWorkflows: true,
+            showEmptyState: false,
             showProjectInfo: false,
           });
         });
@@ -83,7 +83,7 @@ describe('AgentFlowList', () => {
       describe('when showProjectInfo is true', () => {
         beforeEach(() => {
           createWrapper({
-            hasInitialWorkflows: true,
+            showEmptyState: false,
             showProjectInfo: true,
           });
         });
@@ -97,7 +97,7 @@ describe('AgentFlowList', () => {
 
       describe('when showProjectInfo is not provided', () => {
         beforeEach(() => {
-          createWrapper({ hasInitialWorkflows: true });
+          createWrapper({ showEmptyState: false });
         });
 
         it('defaults showProjectInfo to false for each AgentFlowListItem', () => {
@@ -114,7 +114,7 @@ describe('AgentFlowList', () => {
       beforeEach(() => {
         wrapper = shallowMount(AgentFlowList, {
           propsData: {
-            hasInitialWorkflows: true,
+            showEmptyState: true,
             initialSort: 'CREATED_DESC',
             workflows: mockAgentFlows,
             workflowsPageInfo: {},
@@ -138,7 +138,7 @@ describe('AgentFlowList', () => {
       describe('when hasNextPage is false and hasPreviousPage is false', () => {
         beforeEach(() => {
           createWrapper({
-            hasInitialWorkflows: true,
+            showEmptyState: true,
             workflows: mockAgentFlows,
             workflowsPageInfo: createPaginationData(false, false),
           });
@@ -158,7 +158,7 @@ describe('AgentFlowList', () => {
         ({ hasNextPage, hasPreviousPage }) => {
           beforeEach(() => {
             createWrapper({
-              hasInitialWorkflows: true,
+              showEmptyState: false,
               workflows: mockAgentFlows,
               workflowsPageInfo: createPaginationData(hasNextPage, hasPreviousPage),
             });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
index 9c3e15cbe61b82..cd85e28236a674 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
@@ -7,14 +7,10 @@ import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import DuoAgentsPlatformIndex from 'ee/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue';
 import { createAlert } from '~/alert';
-import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import { mockAgentFlowsResponse } from '../../../mocks';
 
 Vue.use(VueApollo);
 jest.mock('~/alert');
-jest.mock('ee/ai/duo_agents_platform/utils', () => ({
-  filterAgentSessionsByFuzzyText: jest.fn(),
-}));
 
 describe('ProjectAgentsPlatformIndex', () => {
   let wrapper;
@@ -89,6 +85,13 @@ describe('ProjectAgentsPlatformIndex', () => {
 
           expect(findIndexComponent().props('workflows')).toEqual(expectedWorkflows);
         });
+
+        it('passes workflowsPageInfo to DuoAgentsPlatformIndex component', () => {
+          const expectedPageInfo =
+            mockAgentFlowsResponse.data.project.duoWorkflowWorkflows.pageInfo;
+
+          expect(findIndexComponent().props('workflowsPageInfo')).toEqual(expectedPageInfo);
+        });
       });
 
       describe('when workflows query fails', () => {
@@ -111,6 +114,20 @@ describe('ProjectAgentsPlatformIndex', () => {
         });
       });
 
+      describe('when workflows query fails without error message', () => {
+        beforeEach(async () => {
+          getAgentFlowsHandler.mockRejectedValue(new Error());
+          await createWrapper();
+        });
+
+        it('calls createAlert with default error message', () => {
+          expect(createAlert).toHaveBeenCalledWith({
+            message: 'Failed to fetch workflows',
+            captureError: true,
+          });
+        });
+      });
+
       describe('when workflows query returns empty edges', () => {
         beforeEach(async () => {
           getAgentFlowsHandler.mockResolvedValue({
@@ -149,136 +166,27 @@ describe('ProjectAgentsPlatformIndex', () => {
     });
   });
 
-  describe('filtering', () => {
-    beforeEach(async () => {
-      await createWrapper();
-    });
-
-    it('handles flow-name filter correctly', async () => {
-      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        type: 'convert_to_gitlab_ci',
-      });
-    });
-
-    it('sets isSearchActive to true when filters are applied', async () => {
-      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(wrapper.vm.isSearchActive).toBe(true);
-    });
-
-    it('sets isSearchActive to false when no filters are applied', async () => {
-      // First apply filters
-      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      // Then clear filters
-      findIndexComponent().vm.$emit('filter', []);
-      await waitForPromises();
-
-      expect(wrapper.vm.isSearchActive).toBe(false);
-    });
-
-    it('refetches data when no free text search is present', async () => {
-      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        type: 'software_development',
-      });
-    });
-
-    it('clears filters when empty array is passed', async () => {
-      // First apply some filters
-      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      // Then clear filters
-      findIndexComponent().vm.$emit('filter', []);
-      await waitForPromises();
-
-      expect(wrapper.vm.currentFilters).toEqual({});
-      expect(getAgentFlowsHandler).toHaveBeenLastCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-      });
-    });
-
-    it('refetches data when switching from free text search to other filters', async () => {
-      // Apply free text search first (this should not trigger additional server calls)
-      const searchFilters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-      findIndexComponent().vm.$emit('filter', searchFilters);
-      await waitForPromises();
-
-      // Reset the mock to count only the calls from the filter switch
-      getAgentFlowsHandler.mockClear();
-
-      // Switch to flow-name filter
-      const nonSearchFilters = [{ type: 'flow-name', value: { data: 'software_development' } }];
-      findIndexComponent().vm.$emit('filter', nonSearchFilters);
-      await waitForPromises();
+  describe('computed properties', () => {
+    describe('isLoadingWorkflows', () => {
+      describe('when query is loading', () => {
+        beforeEach(() => {
+          createWrapper();
+        });
 
-      // Verify that server calls were made and the correct parameters were used
-      expect(getAgentFlowsHandler).toHaveBeenLastCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        type: 'software_development',
+        it('passes isLoadingWorkflows as true to DuoAgentsPlatformIndex', () => {
+          expect(findIndexComponent().props('isLoadingWorkflows')).toBe(true);
+        });
       });
-    });
-  });
 
-  describe('sorting', () => {
-    beforeEach(async () => {
-      await createWrapper();
-    });
-
-    it('handles sort correctly', async () => {
-      findIndexComponent().vm.$emit('sort', 'CREATED_ASC');
-      await waitForPromises();
+      describe('when query is not loading', () => {
+        beforeEach(async () => {
+          await createWrapper();
+        });
 
-      expect(getAgentFlowsHandler).toHaveBeenCalledWith({
-        projectPath,
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'CREATED_ASC',
+        it('passes isLoadingWorkflows as false to DuoAgentsPlatformIndex', () => {
+          expect(findIndexComponent().props('isLoadingWorkflows')).toBe(false);
+        });
       });
     });
-
-    it('does not refetch when sort value is the same', async () => {
-      const initialCallCount = getAgentFlowsHandler.mock.calls.length;
-
-      findIndexComponent().vm.$emit('sort', 'UPDATED_ASC');
-      await waitForPromises();
-
-      expect(getAgentFlowsHandler).toHaveBeenCalledTimes(initialCallCount);
-    });
   });
 });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
index bbfb2fa1ca6603..615af00b6bc815 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
@@ -7,7 +7,6 @@ import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import DuoAgentsPlatformIndex from 'ee/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue';
 import { createAlert } from '~/alert';
-import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 import { mockAgentFlowEdges } from '../../../mocks';
 
 Vue.use(VueApollo);
@@ -58,6 +57,7 @@ describe('UserAgentsPlatformIndex', () => {
     await createWrapper();
 
     expect(findIndexComponent().props()).toMatchObject({
+      initialSort: 'UPDATED_ASC',
       isLoadingWorkflows: expect.any(Boolean),
       workflows: expect.any(Array),
       workflowsPageInfo: expect.any(Object),
@@ -227,8 +227,8 @@ describe('UserAgentsPlatformIndex', () => {
           createWrapper();
         });
 
-        it('returns true', () => {
-          expect(wrapper.vm.isLoadingWorkflows).toBe(true);
+        it('passes isLoadingWorkflows as true to DuoAgentsPlatformIndex', () => {
+          expect(findIndexComponent().props('isLoadingWorkflows')).toBe(true);
         });
       });
 
@@ -237,169 +237,35 @@ describe('UserAgentsPlatformIndex', () => {
           await createWrapper();
         });
 
-        it('returns false', () => {
-          expect(wrapper.vm.isLoadingWorkflows).toBe(false);
+        it('passes isLoadingWorkflows as false to DuoAgentsPlatformIndex', () => {
+          expect(findIndexComponent().props('isLoadingWorkflows')).toBe(false);
         });
       });
     });
-
-    describe('polling', () => {
-      beforeEach(async () => {
-        await createWrapper();
-      });
-
-      it('polls every 10 seconds', async () => {
-        expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(1);
-
-        jest.advanceTimersByTime(5000);
-        await waitForPromises();
-
-        expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(1);
-
-        jest.advanceTimersByTime(10000);
-        await waitForPromises();
-
-        expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(2);
-
-        jest.advanceTimersByTime(10000);
-        await waitForPromises();
-
-        expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(3);
-      });
-    });
   });
 
-  describe('filtering', () => {
+  describe('polling', () => {
     beforeEach(async () => {
       await createWrapper();
     });
 
-    it('handles flow-name filter correctly', async () => {
-      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        excludeTypes: ['chat'],
-        type: 'software_development',
-      });
-    });
-
-    it('sets isSearchActive to true when filters are applied', async () => {
-      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(wrapper.vm.isSearchActive).toBe(true);
-    });
-
-    it('sets isSearchActive to false when no filters are applied', async () => {
-      // First apply filters
-      const filters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      // Then clear filters
-      findIndexComponent().vm.$emit('filter', []);
-      await waitForPromises();
-
-      expect(wrapper.vm.isSearchActive).toBe(false);
-    });
-
-    it('refetches data when no free text search is present', async () => {
-      const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
-
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        excludeTypes: ['chat'],
-        type: 'convert_to_gitlab_ci',
-      });
-    });
-
-    it('clears filters when empty array is passed', async () => {
-      // First apply some filters
-      const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
-      findIndexComponent().vm.$emit('filter', filters);
-      await waitForPromises();
-
-      // Then clear filters
-      findIndexComponent().vm.$emit('filter', []);
-      await waitForPromises();
-
-      expect(wrapper.vm.currentFilters).toEqual({});
-      expect(getUserAgentFlowsHandler).toHaveBeenLastCalledWith({
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        excludeTypes: ['chat'],
-        type: 'software_development',
-      });
-    });
+    it('polls every 10 seconds', async () => {
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(1);
 
-    it('refetches data when switching from free text search to other filters', async () => {
-      // Apply free text search first (this should not trigger additional server calls)
-      const searchFilters = [{ type: FILTERED_SEARCH_TERM, value: { data: 'test' } }];
-      findIndexComponent().vm.$emit('filter', searchFilters);
+      jest.advanceTimersByTime(5000);
       await waitForPromises();
 
-      // Reset the mock to count only the calls from the filter switch
-      getUserAgentFlowsHandler.mockClear();
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(1);
 
-      // Switch to flow-name filter
-      const nonSearchFilters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
-      findIndexComponent().vm.$emit('filter', nonSearchFilters);
+      jest.advanceTimersByTime(10000);
       await waitForPromises();
 
-      // Verify that server calls were made and the correct parameters were used
-      expect(getUserAgentFlowsHandler).toHaveBeenLastCalledWith({
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'UPDATED_ASC',
-        excludeTypes: ['chat'],
-        type: 'convert_to_gitlab_ci',
-      });
-    });
-  });
-
-  describe('sorting', () => {
-    beforeEach(async () => {
-      await createWrapper();
-    });
-
-    it('handles sort correctly', async () => {
-      findIndexComponent().vm.$emit('sort', 'CREATED_ASC');
-      await waitForPromises();
-
-      expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
-        before: null,
-        first: 20,
-        last: null,
-        sort: 'CREATED_ASC',
-        excludeTypes: ['chat'],
-      });
-    });
-
-    it('does not refetch when sort value is the same', async () => {
-      const initialCallCount = getUserAgentFlowsHandler.mock.calls.length;
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(2);
 
-      findIndexComponent().vm.$emit('sort', 'UPDATED_ASC');
+      jest.advanceTimersByTime(10000);
       await waitForPromises();
 
-      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(initialCallCount);
+      expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(3);
     });
   });
 });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
index 358a6c44344cfa..095eee32f8e468 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
@@ -1,5 +1,6 @@
 import { shallowMount } from '@vue/test-utils';
-import { GlExperimentBadge } from '@gitlab/ui';
+import { GlAlert, GlExperimentBadge } from '@gitlab/ui';
+import { nextTick } from 'vue';
 import PageHeading from '~/vue_shared/components/page_heading.vue';
 
 import AgentFlowList from 'ee/ai/duo_agents_platform/components/common/agent_flow_list.vue';
@@ -17,6 +18,8 @@ describe('AgentsPlatformIndex', () => {
   const mockRefetch = jest.fn().mockResolvedValue({ data: { workflows: [] } });
 
   const defaultProps = {
+    initialSort: 'UPDATED_ASC',
+    hasInitialWorkflows: true,
     isLoadingWorkflows: false,
     workflows: mockAgentFlowsResponse.data.project.duoWorkflowWorkflows.edges.map(
       (edge) => edge.node,
@@ -46,6 +49,11 @@ describe('AgentsPlatformIndex', () => {
   const findPageHeading = () => wrapper.findComponent(PageHeading);
   const findExperimentBadge = () => wrapper.findComponent(GlExperimentBadge);
   const findFilteredSearchBar = () => wrapper.findComponent(FilteredSearchBar);
+  const findAlert = () => wrapper.findComponent(GlAlert);
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
 
   describe('when not in side panel view', () => {
     beforeEach(() => {
@@ -73,6 +81,11 @@ describe('AgentsPlatformIndex', () => {
     it('does not render the page heading', () => {
       expect(findPageHeading().exists()).toBe(false);
     });
+
+    it('applies margin top class to page heading when it exists', () => {
+      // In side panel view, page heading doesn't exist, but we test the computed property
+      expect(wrapper.vm.headerClass).toBe('gl-mt-0');
+    });
   });
 
   describe('when loading the queries', () => {
@@ -101,11 +114,20 @@ describe('AgentsPlatformIndex', () => {
     it('does not render the loading icon', () => {
       expect(findLoadingIcon().exists()).toBe(false);
     });
+
+    it('passes correct props to AgentFlowList', () => {
+      expect(findWorkflowsList().props()).toMatchObject({
+        showProjectInfo: false,
+        showEmptyState: false,
+        workflows: expect.any(Array),
+        workflowsPageInfo: expect.any(Object),
+      });
+    });
   });
 
   describe('filtering and sorting', () => {
     beforeEach(async () => {
-      await createWrapper({ props: { hasInitialWorkflows: true } });
+      await createWrapper();
     });
 
     it('renders the filtered search bar with correct props', () => {
@@ -115,6 +137,7 @@ describe('AgentsPlatformIndex', () => {
         searchInputPlaceholder: 'Search for a session',
         syncFilterAndSort: true,
         termsAsTokens: true,
+        initialSortBy: 'UPDATED_ASC',
       });
     });
 
@@ -156,47 +179,90 @@ describe('AgentsPlatformIndex', () => {
       ]);
     });
 
+    describe('when hasInitialWorkflows is false', () => {
+      beforeEach(async () => {
+        await createWrapper({ props: { hasInitialWorkflows: false } });
+      });
+
+      it('does not render the filtered search bar', () => {
+        expect(findFilteredSearchBar().exists()).toBe(false);
+      });
+    });
+
     describe('when sorting', () => {
-      it('emits sort event when onSort is triggered', () => {
+      it('calls workflowQuery.refetch with sort parameter when onSort is triggered', () => {
         findFilteredSearchBar().vm.$emit('onSort', 'UPDATED_DESC');
 
-        expect(wrapper.emitted('sort')).toHaveLength(1);
-        expect(wrapper.emitted('sort')[0]).toEqual(['UPDATED_DESC']);
+        expect(mockRefetch).toHaveBeenCalledWith({
+          projectPath: 'hello!',
+          sort: 'UPDATED_DESC',
+        });
       });
     });
 
     describe('when filtering', () => {
-      const searchTestCases = [
-        {
-          name: 'with flow-name token',
-          filters: [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }],
-        },
-        {
-          name: 'with free text search',
-          filters: [{ type: 'filtered-search-term', value: { data: 'software dev' } }],
-        },
-        {
-          name: 'with combined token and free text search',
-          filters: [
-            { type: 'flow-name', value: { data: 'software_development' } },
-            { type: 'filtered-search-term', value: { data: 'dev' } },
-          ],
-        },
-        {
-          name: 'when filters are cleared',
-          filters: [],
-        },
-      ];
+      describe('with valid flow-name token', () => {
+        it('calls workflowQuery.refetch with filter parameters', () => {
+          const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
+
+          findFilteredSearchBar().vm.$emit('onFilter', filters);
+
+          expect(mockRefetch).toHaveBeenCalledWith({
+            projectPath: 'hello!',
+            type: 'convert_to_gitlab_ci',
+          });
+        });
+
+        it('hides alert when valid filters are applied', () => {
+          const filters = [{ type: 'flow-name', value: { data: 'software_development' } }];
 
-      searchTestCases.forEach(({ name, filters }) => {
-        it(`emits filter event ${name}`, () => {
           findFilteredSearchBar().vm.$emit('onFilter', filters);
 
-          expect(wrapper.emitted('filter')).toHaveLength(1);
-          expect(wrapper.emitted('filter')[0]).toEqual([filters]);
+          expect(findAlert().exists()).toBe(false);
+        });
+      });
+
+      describe('with unsupported free text search', () => {
+        it('shows alert and does not call refetch', async () => {
+          const filters = [{ type: 'filtered-search-term', value: { data: 'software dev' } }];
+
+          findFilteredSearchBar().vm.$emit('onFilter', filters);
+          await nextTick();
+
+          expect(findAlert().exists()).toBe(true);
+          expect(findAlert().props('variant')).toBe('warning');
+          expect(findAlert().text()).toContain('Raw text search is not currently supported');
+          expect(mockRefetch).not.toHaveBeenCalled();
+        });
+      });
+
+      describe('when filters are cleared', () => {
+        it('calls workflowQuery.refetch with no additional filters', () => {
+          findFilteredSearchBar().vm.$emit('onFilter', []);
+
+          expect(mockRefetch).toHaveBeenCalledWith({
+            projectPath: 'hello!',
+          });
         });
       });
     });
+
+    describe('alert dismissal', () => {
+      beforeEach(() => {
+        // Trigger alert by using unsupported search
+        const filters = [{ type: 'filtered-search-term', value: { data: 'test' } }];
+        findFilteredSearchBar().vm.$emit('onFilter', filters);
+      });
+
+      it('hides alert when dismissed', async () => {
+        expect(findAlert().exists()).toBe(true);
+
+        findAlert().vm.$emit('dismiss');
+        await nextTick();
+
+        expect(findAlert().exists()).toBe(false);
+      });
+    });
   });
 
   describe('pagination', () => {
@@ -210,10 +276,10 @@ describe('AgentsPlatformIndex', () => {
 
         expect(mockRefetch).toHaveBeenCalledWith({
           projectPath: 'hello!',
-          after: 'asdf',
-          last: null,
           before: null,
+          after: 'asdf',
           first: 20,
+          last: null,
         });
       });
     });
@@ -225,9 +291,9 @@ describe('AgentsPlatformIndex', () => {
         expect(mockRefetch).toHaveBeenCalledWith({
           projectPath: 'hello!',
           after: null,
-          last: 20,
           before: 'asdf',
           first: null,
+          last: 20,
         });
       });
     });
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index f091bf182467c7..ca464cca6de018 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -25021,9 +25021,6 @@ msgstr ""
 msgid "DuoAgentsPlatform|Unknown"
 msgstr ""
 
-msgid "DuoAgentsPlatform|Updated date"
-msgstr ""
-
 msgid "DuoAgentsPlatform|Write file"
 msgstr ""
 
-- 
GitLab


From b1b7e023fd3a3381fe19af57797f476ff6534be3 Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Wed, 8 Oct 2025 14:38:59 -0500
Subject: [PATCH 5/6] Remove header styles that were doing nothing

Also updated GraphQL query type
Added Status sort
---
 .../graphql/queries/get_agent_flows.query.graphql        | 2 +-
 .../graphql/queries/get_user_agent_flow.query.graphql    | 2 +-
 .../pages/index/duo_agents_platform_index.vue            | 5 +----
 .../pages/index/duo_agents_platform_index_spec.js        | 9 ---------
 4 files changed, 3 insertions(+), 15 deletions(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
index d5b910bc382545..7c1e9338c11445 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_agent_flows.query.graphql
@@ -6,7 +6,7 @@ query getAgentFlows(
   $before: String
   $first: Int
   $last: Int
-  $sort: Sort
+  $sort: DuoWorkflowsWorkflowSort
   $type: String
 ) {
   project(fullPath: $projectPath) {
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
index c0782fa8725705..29887605e22699 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/graphql/queries/get_user_agent_flow.query.graphql
@@ -6,7 +6,7 @@ query getUserAgentFlows(
   $first: Int
   $last: Int
   $excludeTypes: [String!]
-  $sort: Sort
+  $sort: DuoWorkflowsWorkflowSort
   $type: String
 ) {
   duoWorkflowWorkflows(
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
index b8591f080b43f8..f18bd0c376997a 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
@@ -59,9 +59,6 @@ export default {
     };
   },
   computed: {
-    headerClass() {
-      return this.isSidePanelView ? 'gl-mt-0' : '';
-    },
     showEmptyState() {
       return !this.hasInitialWorkflows;
     },
@@ -165,7 +162,7 @@ export default {
 </script>
 <template>
   <div class="gl-min-h-full gl-flex-wrap gl-justify-center">
-    <page-heading v-if="!isSidePanelView" :class="headerClass">
+    <page-heading v-if="!isSidePanelView">
       <template #heading>
         <div class="gl-flex">
           <span>{{ s__('DuoAgentsPlatform|Agent sessions') }}</span>
diff --git a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
index 095eee32f8e468..4b4b25587e6779 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
@@ -67,10 +67,6 @@ describe('AgentsPlatformIndex', () => {
       expect(findExperimentBadge().exists()).toBe(true);
       expect(findExperimentBadge().props('type')).toBe('beta');
     });
-
-    it('applies no margin top class to page heading', () => {
-      expect(findPageHeading().classes()).not.toContain('gl-mt-0');
-    });
   });
 
   describe('when in side panel view', () => {
@@ -81,11 +77,6 @@ describe('AgentsPlatformIndex', () => {
     it('does not render the page heading', () => {
       expect(findPageHeading().exists()).toBe(false);
     });
-
-    it('applies margin top class to page heading when it exists', () => {
-      // In side panel view, page heading doesn't exist, but we test the computed property
-      expect(wrapper.vm.headerClass).toBe('gl-mt-0');
-    });
   });
 
   describe('when loading the queries', () => {
-- 
GitLab


From 489718ecc2108ea17b27bf47d7c98ec6d9e6be58 Mon Sep 17 00:00:00 2001
From: Lindsey Shelton <lshelton@gitlab.com>
Date: Fri, 10 Oct 2025 10:31:32 -0500
Subject: [PATCH 6/6] Update how we handle queries and fetching

Move apollo work to parent components
---
 .../ai/duo_agents_platform/constants.js       |  7 ++
 .../project/project_agents_platform_index.vue | 32 +++++++--
 .../user/user_agents_platform_index.vue       | 32 +++++++--
 .../pages/index/duo_agents_platform_index.vue | 21 ++----
 .../project_agents_platform_index_spec.js     |  5 +-
 .../user/user_agents_platform_index_spec.js   |  9 ++-
 .../index/duo_agents_platform_index_spec.js   | 68 ++++++++-----------
 7 files changed, 103 insertions(+), 71 deletions(-)

diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
index 80a7550fabe5a0..d84e0157d0d960 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/constants.js
@@ -47,3 +47,10 @@ export const AGENT_PLATFORM_STATUS_ICON = {
     color: 'red',
   },
 };
+
+export const DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES = {
+  first: 20,
+  before: null,
+  after: null,
+  last: null,
+};
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
index 8bd0dc3f4cdb0d..8898fad1af551c 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/project/project_agents_platform_index.vue
@@ -1,8 +1,10 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
+import { fetchPolicies } from '~/lib/graphql';
 import getProjectAgentFlows from '../../graphql/queries/get_agent_flows.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
+import { DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
@@ -13,18 +15,20 @@ export default {
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
       hasInitialWorkflows: false,
+      paginationVariables: { ...DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES },
+      filterVariables: {},
     };
   },
   apollo: {
     workflows: {
       query: getProjectAgentFlows,
+      fetchPolicy: fetchPolicies.CACHE_AND_NETWORK,
       variables() {
         return {
           projectPath: this.projectPath,
-          first: 20,
-          before: null,
-          last: null,
+          ...this.paginationVariables,
           sort: this.currentSort,
+          ...this.filterVariables,
         };
       },
       update(data) {
@@ -51,6 +55,24 @@ export default {
       return this.$apollo.queries.workflows.loading;
     },
   },
+  methods: {
+    handleSort(sortBy) {
+      this.currentSort = sortBy;
+
+      this.resetPagination();
+    },
+    handleFilters(filters) {
+      this.filterVariables = filters;
+
+      this.resetPagination();
+    },
+    handlePagination(paginationVars) {
+      this.paginationVariables = paginationVars;
+    },
+    resetPagination() {
+      this.handlePagination(DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES);
+    },
+  },
 };
 </script>
 <template>
@@ -60,6 +82,8 @@ export default {
     :is-loading-workflows="isLoadingWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
-    :workflow-query="$apollo.queries.workflows"
+    @update-sort="handleSort"
+    @update-pagination="handlePagination"
+    @update-filters="handleFilters"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
index 820c931ceb8984..a971ac35fb2ed6 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/namespace/user/user_agents_platform_index.vue
@@ -1,8 +1,10 @@
 <script>
 import { s__ } from '~/locale';
 import { createAlert } from '~/alert';
+import { fetchPolicies } from '~/lib/graphql';
 import getUserAgentFlows from '../../graphql/queries/get_user_agent_flow.query.graphql';
 import DuoAgentsPlatformIndex from '../../pages/index/duo_agents_platform_index.vue';
+import { DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES } from '../../constants';
 
 export default {
   components: { DuoAgentsPlatformIndex },
@@ -12,19 +14,21 @@ export default {
       workflowsPageInfo: {},
       currentSort: 'UPDATED_ASC',
       hasInitialWorkflows: false,
+      paginationVariables: { ...DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES },
+      filterVariables: {},
     };
   },
   apollo: {
     workflows: {
       query: getUserAgentFlows,
+      fetchPolicy: fetchPolicies.CACHE_AND_NETWORK,
       pollInterval: 10000,
       variables() {
         return {
-          first: 20,
-          before: null,
-          last: null,
+          ...this.paginationVariables,
           excludeTypes: ['chat'],
           sort: this.currentSort,
+          ...this.filterVariables,
         };
       },
       update(data) {
@@ -51,6 +55,24 @@ export default {
       return this.$apollo.queries.workflows.loading;
     },
   },
+  methods: {
+    handleSort(sortBy) {
+      this.currentSort = sortBy;
+
+      this.resetPagination();
+    },
+    handleFilters(filters) {
+      this.filterVariables = filters;
+
+      this.resetPagination();
+    },
+    handlePagination(paginationVars) {
+      this.paginationVariables = paginationVars;
+    },
+    resetPagination() {
+      this.handlePagination(DEFAULT_AGENT_PLATFORM_PAGINATION_VARIABLES);
+    },
+  },
 };
 </script>
 <template>
@@ -60,7 +82,9 @@ export default {
     :is-loading-workflows="isLoadingWorkflows"
     :workflows="workflows"
     :workflows-page-info="workflowsPageInfo"
-    :workflow-query="$apollo.queries.workflows"
     class="gl-min-w-full"
+    @update-sort="handleSort"
+    @update-pagination="handlePagination"
+    @update-filters="handleFilters"
   />
 </template>
diff --git a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
index f18bd0c376997a..4d3dc570c7aeab 100644
--- a/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
+++ b/ee/app/assets/javascripts/ai/duo_agents_platform/pages/index/duo_agents_platform_index.vue
@@ -39,10 +39,6 @@ export default {
       required: true,
       type: Boolean,
     },
-    workflowQuery: {
-      required: true,
-      type: Object,
-    },
     workflows: {
       required: true,
       type: Array,
@@ -76,8 +72,7 @@ export default {
   },
   methods: {
     handleNextPage() {
-      this.workflowQuery.refetch({
-        ...this.workflowQuery.variables,
+      this.$emit('update-pagination', {
         before: null,
         after: this.workflowsPageInfo.endCursor,
         first: 20,
@@ -85,8 +80,7 @@ export default {
       });
     },
     handlePrevPage() {
-      this.workflowQuery.refetch({
-        ...this.workflowQuery.variables,
+      this.$emit('update-pagination', {
         after: null,
         before: this.workflowsPageInfo.startCursor,
         first: null,
@@ -94,10 +88,7 @@ export default {
       });
     },
     handleSort(sortBy) {
-      this.workflowQuery.refetch({
-        ...this.workflowQuery.variables,
-        sort: sortBy,
-      });
+      this.$emit('update-sort', sortBy);
     },
     handleFilter(filters) {
       if (this.hasUnsupportedTextSearch(filters)) {
@@ -115,11 +106,7 @@ export default {
       return filters.some((filter) => filter.type === FILTERED_SEARCH_TERM && filter.value?.data);
     },
     refetchWithFilters(processedFilters) {
-      this.workflowQuery.refetch({
-        ...this.workflowQuery.variables,
-        type: undefined, // Clear previous filter values when no filters are applied
-        ...processedFilters,
-      });
+      this.$emit('update-filters', processedFilters);
     },
     dismissAlert() {
       this.showAlert = false;
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
index cd85e28236a674..6c1a5f006d820d 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/project/project_agents_platform_index_spec.js
@@ -41,12 +41,10 @@ describe('ProjectAgentsPlatformIndex', () => {
 
     expect(findIndexComponent().props()).toMatchObject({
       initialSort: 'UPDATED_ASC',
+      hasInitialWorkflows: expect.any(Boolean),
       isLoadingWorkflows: expect.any(Boolean),
       workflows: expect.any(Array),
       workflowsPageInfo: expect.any(Object),
-      workflowQuery: expect.objectContaining({
-        refetch: expect.any(Function),
-      }),
     });
   });
 
@@ -72,6 +70,7 @@ describe('ProjectAgentsPlatformIndex', () => {
           expect(getAgentFlowsHandler).toHaveBeenCalledTimes(1);
           expect(getAgentFlowsHandler).toHaveBeenCalledWith({
             projectPath,
+            after: null,
             before: null,
             first: 20,
             last: null,
diff --git a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
index 615af00b6bc815..22ac3b493da867 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/namespace/user/user_agents_platform_index_spec.js
@@ -58,12 +58,10 @@ describe('UserAgentsPlatformIndex', () => {
 
     expect(findIndexComponent().props()).toMatchObject({
       initialSort: 'UPDATED_ASC',
+      hasInitialWorkflows: expect.any(Boolean),
       isLoadingWorkflows: expect.any(Boolean),
       workflows: expect.any(Array),
       workflowsPageInfo: expect.any(Object),
-      workflowQuery: expect.objectContaining({
-        refetch: expect.any(Function),
-      }),
     });
   });
 
@@ -88,10 +86,11 @@ describe('UserAgentsPlatformIndex', () => {
         it('fetches workflows data with correct variables', () => {
           expect(getUserAgentFlowsHandler).toHaveBeenCalledTimes(1);
           expect(getUserAgentFlowsHandler).toHaveBeenCalledWith({
-            first: 20,
+            sort: 'UPDATED_ASC',
+            after: null,
             before: null,
+            first: 20,
             last: null,
-            sort: 'UPDATED_ASC',
             excludeTypes: ['chat'],
           });
         });
diff --git a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
index 4b4b25587e6779..a62f593caf35a1 100644
--- a/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
+++ b/ee/spec/frontend/ai/duo_agents_platform/pages/index/duo_agents_platform_index_spec.js
@@ -15,7 +15,6 @@ jest.mock('~/alert');
 
 describe('AgentsPlatformIndex', () => {
   let wrapper;
-  const mockRefetch = jest.fn().mockResolvedValue({ data: { workflows: [] } });
 
   const defaultProps = {
     initialSort: 'UPDATED_ASC',
@@ -25,11 +24,6 @@ describe('AgentsPlatformIndex', () => {
       (edge) => edge.node,
     ),
     workflowsPageInfo: { startCursor: 'asdf', endCursor: 'asdf' },
-    workflowQuery: {
-      loading: false,
-      refetch: mockRefetch,
-      variables: { projectPath: 'hello!' },
-    },
   };
 
   const createWrapper = ({ props = {}, provide = {} } = {}) => {
@@ -181,27 +175,21 @@ describe('AgentsPlatformIndex', () => {
     });
 
     describe('when sorting', () => {
-      it('calls workflowQuery.refetch with sort parameter when onSort is triggered', () => {
+      it('emits update-sort event when onSort is triggered', () => {
         findFilteredSearchBar().vm.$emit('onSort', 'UPDATED_DESC');
 
-        expect(mockRefetch).toHaveBeenCalledWith({
-          projectPath: 'hello!',
-          sort: 'UPDATED_DESC',
-        });
+        expect(wrapper.emitted('update-sort')).toEqual([['UPDATED_DESC']]);
       });
     });
 
     describe('when filtering', () => {
       describe('with valid flow-name token', () => {
-        it('calls workflowQuery.refetch with filter parameters', () => {
+        it('emits update-filters event with processed filter parameters', () => {
           const filters = [{ type: 'flow-name', value: { data: 'convert_to_gitlab_ci' } }];
 
           findFilteredSearchBar().vm.$emit('onFilter', filters);
 
-          expect(mockRefetch).toHaveBeenCalledWith({
-            projectPath: 'hello!',
-            type: 'convert_to_gitlab_ci',
-          });
+          expect(wrapper.emitted('update-filters')).toEqual([[{ type: 'convert_to_gitlab_ci' }]]);
         });
 
         it('hides alert when valid filters are applied', () => {
@@ -214,7 +202,7 @@ describe('AgentsPlatformIndex', () => {
       });
 
       describe('with unsupported free text search', () => {
-        it('shows alert and does not call refetch', async () => {
+        it('shows alert and does not emit update-filters', async () => {
           const filters = [{ type: 'filtered-search-term', value: { data: 'software dev' } }];
 
           findFilteredSearchBar().vm.$emit('onFilter', filters);
@@ -223,17 +211,15 @@ describe('AgentsPlatformIndex', () => {
           expect(findAlert().exists()).toBe(true);
           expect(findAlert().props('variant')).toBe('warning');
           expect(findAlert().text()).toContain('Raw text search is not currently supported');
-          expect(mockRefetch).not.toHaveBeenCalled();
+          expect(wrapper.emitted('update-filters')).toBeUndefined();
         });
       });
 
       describe('when filters are cleared', () => {
-        it('calls workflowQuery.refetch with no additional filters', () => {
+        it('emits update-filters event with empty filters', () => {
           findFilteredSearchBar().vm.$emit('onFilter', []);
 
-          expect(mockRefetch).toHaveBeenCalledWith({
-            projectPath: 'hello!',
-          });
+          expect(wrapper.emitted('update-filters')).toEqual([[{}]]);
         });
       });
     });
@@ -262,30 +248,36 @@ describe('AgentsPlatformIndex', () => {
     });
 
     describe('when next page is requested', () => {
-      it('calls refetch with correct parameters', () => {
+      it('emits update-pagination event with correct parameters', () => {
         findWorkflowsList().vm.$emit('next-page');
 
-        expect(mockRefetch).toHaveBeenCalledWith({
-          projectPath: 'hello!',
-          before: null,
-          after: 'asdf',
-          first: 20,
-          last: null,
-        });
+        expect(wrapper.emitted('update-pagination')).toEqual([
+          [
+            {
+              before: null,
+              after: 'asdf',
+              first: 20,
+              last: null,
+            },
+          ],
+        ]);
       });
     });
 
     describe('when previous page is requested', () => {
-      it('calls refetch with correct parameters', () => {
+      it('emits update-pagination event with correct parameters', () => {
         findWorkflowsList().vm.$emit('prev-page');
 
-        expect(mockRefetch).toHaveBeenCalledWith({
-          projectPath: 'hello!',
-          after: null,
-          before: 'asdf',
-          first: null,
-          last: 20,
-        });
+        expect(wrapper.emitted('update-pagination')).toEqual([
+          [
+            {
+              after: null,
+              before: 'asdf',
+              first: null,
+              last: 20,
+            },
+          ],
+        ]);
       });
     });
   });
-- 
GitLab