diff --git a/locales/en/plugin__gitops-plugin.json b/locales/en/plugin__gitops-plugin.json
index 32e2b6d6..ea77897e 100644
--- a/locales/en/plugin__gitops-plugin.json
+++ b/locales/en/plugin__gitops-plugin.json
@@ -101,10 +101,14 @@
   "App Project": "AppProject",
   "Argo CD project that this ApplicationSet belongs to.": "Argo CD project that this ApplicationSet belongs to.",
   "Git repository URL where the ApplicationSet configuration is stored.": "Git repository URL where the ApplicationSet configuration is stored.",
+  "Progressive Sync Step {{x}}": "Progressive Sync Step {{x}}",
   "Applications": "Applications",
+  "Show all match expressions": "Show all match expressions",
   "Edit ApplicationSet": "Edit ApplicationSet",
   "Delete ApplicationSet": "Delete ApplicationSet",
   "View Graph": "View Graph",
+  "Match Expressions": "Match Expressions",
+  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "AppSet ownerReference Tree View": "AppSet ownerReference Tree View",
   "Progressive Sync Flow View": "Progressive Sync Flow View",
   "Expand or collapse all progressive sync step groups": "Expand or collapse all progressive sync step groups",
@@ -257,6 +261,8 @@
   "Created At": "Created At",
   "No pods": "No pods",
   "There are no pods associated with the rollout.": "There are no pods associated with the rollout.",
+  "Close": "Close",
+  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Edit Pod": "Edit Pod",
   "Edit Rollout": "Edit Rollout",
   "Promote": "Promote",
@@ -271,9 +277,7 @@
   "ready": "ready",
   "0 Pods": "0 Pods",
   "Scaling down in:": "Scaling down in:",
-  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Rollout Revisions": "Rollout Revisions",
-  "Close": "Close",
   "Stable": "Stable",
   "Active": "Active",
   "Preview": "Preview",
@@ -331,7 +335,6 @@
   "ApplicationSets": "ApplicationSets",
   "Create ApplicationSet": "Create ApplicationSet",
   "No labels": "No labels",
-  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "Namespace defines the space within which each name must be unique.": "Namespace defines the space within which each name must be unique.",
   "Map of string keys and values that can be used to organize and categorize (scope and select) objects.": "Map of string keys and values that can be used to organize and categorize (scope and select) objects.",
   "Edit": "Edit",
diff --git a/locales/ja/plugin__gitops-plugin.json b/locales/ja/plugin__gitops-plugin.json
index c992bea3..52e937fa 100644
--- a/locales/ja/plugin__gitops-plugin.json
+++ b/locales/ja/plugin__gitops-plugin.json
@@ -101,10 +101,14 @@
   "App Project": "AppProject",
   "Argo CD project that this ApplicationSet belongs to.": "Argo CD project that this ApplicationSet belongs to.",
   "Git repository URL where the ApplicationSet configuration is stored.": "Git repository URL where the ApplicationSet configuration is stored.",
+  "Progressive Sync Step {{x}}": "Progressive Sync Step {{x}}",
   "Applications": "Applications",
+  "Show all match expressions": "Show all match expressions",
   "Edit ApplicationSet": "Edit ApplicationSet",
   "Delete ApplicationSet": "Delete ApplicationSet",
   "View Graph": "View Graph",
+  "Match Expressions": "Match Expressions",
+  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "AppSet ownerReference Tree View": "AppSet ownerReference Tree View",
   "Progressive Sync Flow View": "Progressive Sync Flow View",
   "Expand or collapse all progressive sync step groups": "Expand or collapse all progressive sync step groups",
@@ -257,6 +261,8 @@
   "Created At": "Created At",
   "No pods": "No pods",
   "There are no pods associated with the rollout.": "There are no pods associated with the rollout.",
+  "Close": "Close",
+  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Edit Pod": "Edit Pod",
   "Edit Rollout": "Edit Rollout",
   "Promote": "Promote",
@@ -271,9 +277,7 @@
   "ready": "ready",
   "0 Pods": "0 Pods",
   "Scaling down in:": "Scaling down in:",
-  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Rollout Revisions": "Rollout Revisions",
-  "Close": "Close",
   "Stable": "Stable",
   "Active": "Active",
   "Preview": "Preview",
@@ -331,7 +335,6 @@
   "ApplicationSets": "ApplicationSets",
   "Create ApplicationSet": "Create ApplicationSet",
   "No labels": "No labels",
-  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "Namespace defines the space within which each name must be unique.": "Namespace defines the space within which each name must be unique.",
   "Map of string keys and values that can be used to organize and categorize (scope and select) objects.": "Map of string keys and values that can be used to organize and categorize (scope and select) objects.",
   "Edit": "Edit",
diff --git a/locales/ko/plugin__gitops-plugin.json b/locales/ko/plugin__gitops-plugin.json
index 7ad78fc0..72ff9128 100644
--- a/locales/ko/plugin__gitops-plugin.json
+++ b/locales/ko/plugin__gitops-plugin.json
@@ -101,10 +101,14 @@
   "App Project": "App Project",
   "Argo CD project that this ApplicationSet belongs to.": "Argo CD project that this ApplicationSet belongs to.",
   "Git repository URL where the ApplicationSet configuration is stored.": "Git repository URL where the ApplicationSet configuration is stored.",
+  "Progressive Sync Step {{x}}": "Progressive Sync Step {{x}}",
   "Applications": "Applications",
+  "Show all match expressions": "Show all match expressions",
   "Edit ApplicationSet": "Edit ApplicationSet",
   "Delete ApplicationSet": "Delete ApplicationSet",
   "View Graph": "View Graph",
+  "Match Expressions": "Match Expressions",
+  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "AppSet ownerReference Tree View": "AppSet ownerReference Tree View",
   "Progressive Sync Flow View": "Progressive Sync Flow View",
   "Expand or collapse all progressive sync step groups": "Expand or collapse all progressive sync step groups",
@@ -257,6 +261,8 @@
   "Created At": "Created At",
   "No pods": "No pods",
   "There are no pods associated with the rollout.": "There are no pods associated with the rollout.",
+  "Close": "Close",
+  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Edit Pod": "Edit Pod",
   "Edit Rollout": "Edit Rollout",
   "Promote": "Promote",
@@ -271,9 +277,7 @@
   "ready": "ready",
   "0 Pods": "0 Pods",
   "Scaling down in:": "Scaling down in:",
-  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Rollout Revisions": "Rollout Revisions",
-  "Close": "Close",
   "Stable": "Stable",
   "Active": "Active",
   "Preview": "Preview",
@@ -331,7 +335,6 @@
   "ApplicationSets": "ApplicationSets",
   "Create ApplicationSet": "Create ApplicationSet",
   "No labels": "No labels",
-  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "Namespace defines the space within which each name must be unique.": "Namespace defines the space within which each name must be unique.",
   "Map of string keys and values that can be used to organize and categorize (scope and select) objects.": "Map of string keys and values that can be used to organize and categorize (scope and select) objects.",
   "Edit": "Edit",
diff --git a/locales/zh/plugin__gitops-plugin.json b/locales/zh/plugin__gitops-plugin.json
index f977c30c..cb6943ef 100644
--- a/locales/zh/plugin__gitops-plugin.json
+++ b/locales/zh/plugin__gitops-plugin.json
@@ -101,10 +101,14 @@
   "App Project": "App Project",
   "Argo CD project that this ApplicationSet belongs to.": "Argo CD project that this ApplicationSet belongs to.",
   "Git repository URL where the ApplicationSet configuration is stored.": "Git repository URL where the ApplicationSet configuration is stored.",
+  "Progressive Sync Step {{x}}": "Progressive Sync Step {{x}}",
   "Applications": "Applications",
+  "Show all match expressions": "Show all match expressions",
   "Edit ApplicationSet": "Edit ApplicationSet",
   "Delete ApplicationSet": "Delete ApplicationSet",
   "View Graph": "View Graph",
+  "Match Expressions": "Match Expressions",
+  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "AppSet ownerReference Tree View": "AppSet ownerReference Tree View",
   "Progressive Sync Flow View": "Progressive Sync Flow View",
   "Expand or collapse all progressive sync step groups": "Expand or collapse all progressive sync step groups",
@@ -257,6 +261,8 @@
   "Created At": "Created At",
   "No pods": "No pods",
   "There are no pods associated with the rollout.": "There are no pods associated with the rollout.",
+  "Close": "Close",
+  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Edit Pod": "Edit Pod",
   "Edit Rollout": "Edit Rollout",
   "Promote": "Promote",
@@ -271,9 +277,7 @@
   "ready": "ready",
   "0 Pods": "0 Pods",
   "Scaling down in:": "Scaling down in:",
-  "{{x}} failed with an error.": "{{x}} failed with an error.",
   "Rollout Revisions": "Rollout Revisions",
-  "Close": "Close",
   "Stable": "Stable",
   "Active": "Active",
   "Preview": "Preview",
@@ -331,7 +335,6 @@
   "ApplicationSets": "ApplicationSets",
   "Create ApplicationSet": "Create ApplicationSet",
   "No labels": "No labels",
-  "Name must be unique within a namespace.": "Name must be unique within a namespace.",
   "Namespace defines the space within which each name must be unique.": "Namespace defines the space within which each name must be unique.",
   "Map of string keys and values that can be used to organize and categorize (scope and select) objects.": "Map of string keys and values that can be used to organize and categorize (scope and select) objects.",
   "Edit": "Edit",
diff --git a/package.json b/package.json
index 0822eb3d..43c486a6 100644
--- a/package.json
+++ b/package.json
@@ -129,7 +129,8 @@
     "react-redux": "7.2.9",
     "react-router-dom-v5-compat": "^6.30.0",
     "react-router-hash-link": "2.4.3",
-    "redux": "4.0.1"
+    "redux": "4.0.1",
+    "yaml": "^2.9.0"
   },
   "//TODO": [
     "For @patternfly/react-icons: find another solution for icons from older react-icons version and remove this dependency."
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 01d14afc..04e1876a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -58,6 +58,9 @@ importers:
       rxjs:
         specifier: ^7.8.1
         version: 7.8.2
+      yaml:
+        specifier: ^2.9.0
+        version: 2.9.0
     devDependencies:
       '@dagrejs/dagre':
         specifier: ^1.1.8
@@ -5818,6 +5821,11 @@ packages:
   yallist@4.0.0:
     resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==}
 
+  yaml@2.9.0:
+    resolution: {integrity: sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==}
+    engines: {node: '>= 14.6'}
+    hasBin: true
+
   yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
     engines: {node: '>=12'}
@@ -12533,6 +12541,8 @@ snapshots:
 
   yallist@4.0.0: {}
 
+  yaml@2.9.0: {}
+
   yargs-parser@21.1.1: {}
 
   yargs@17.7.3:
diff --git a/src/gitops/components/application/graph/ApplicationGraphView.scss b/src/gitops/components/application/graph/ApplicationGraphView.scss
index 9b49c75d..73c400e4 100644
--- a/src/gitops/components/application/graph/ApplicationGraphView.scss
+++ b/src/gitops/components/application/graph/ApplicationGraphView.scss
@@ -169,6 +169,8 @@
     
     .pf-topology__node__label__background {
       fill: var(--pf-t--global--background--color--floating--default);
+      stroke: var(--pf-t--global--border--color--default);
+      stroke-width: 1;
     }
 
     .pf-topology__node__action-icon:hover svg{
diff --git a/src/gitops/components/application/graph/graph-utils.tsx b/src/gitops/components/application/graph/graph-utils.tsx
index 36b60d30..c822918a 100644
--- a/src/gitops/components/application/graph/graph-utils.tsx
+++ b/src/gitops/components/application/graph/graph-utils.tsx
@@ -48,6 +48,10 @@ const createApplicationNode = (
     height: APP_NODE_HEIGHT,
     data: {
       name: application?.metadata?.name,
+      namespace: application?.metadata?.namespace,
+      kind: application?.kind,
+      version: ApplicationModel.apiVersion || 'v1alpha1',
+      group: ApplicationModel.apiGroup || 'argoproj.io',
       badge: 'A',
       badgeColor: RESOURCE_COLORS.get(
         RESOURCE_BADGE_COLORS.get('.co-m-resource-' + application?.kind.toLowerCase()),
diff --git a/src/gitops/components/appset/AppSetMatchExpressionsTab.tsx b/src/gitops/components/appset/AppSetMatchExpressionsTab.tsx
new file mode 100644
index 00000000..d0cfd770
--- /dev/null
+++ b/src/gitops/components/appset/AppSetMatchExpressionsTab.tsx
@@ -0,0 +1,58 @@
+import * as React from 'react';
+import { RouteComponentProps } from 'react-router';
+import * as YamlFormatter from 'yaml';
+
+import { SidebarSectionHeading } from '@gitops/topology/sidebar/DeploymentSideBarDetails';
+import { Card, CardBody, Flex, FlexItem, PageSection } from '@patternfly/react-core';
+
+import { ApplicationSetKind } from '../../models/ApplicationSetModel';
+import { useGitOpsTranslation } from '../../utils/hooks/useGitOpsTranslation';
+
+import './AppSetDetailsTab.scss';
+
+type AppSetMatchExpressionsTabProps = RouteComponentProps<{ ns: string; name: string }> & {
+  obj?: ApplicationSetKind;
+  customData?: object;
+};
+
+const AppSetMatchExpressionsTab: React.FC<AppSetMatchExpressionsTabProps> = ({
+  obj,
+  customData,
+}) => {
+  const { t } = useGitOpsTranslation();
+  const index = customData.step !== undefined ? parseInt(customData?.step) - 1 : -1;
+  if (index >= 0) {
+    const yaml = obj?.spec?.strategy?.rollingSync?.steps[index] || {};
+    return (
+      <>
+        <PageSection>
+          <Flex
+            justifyContent={{ default: 'justifyContentSpaceEvenly' }}
+            direction={{ default: 'column', lg: 'row' }}
+          >
+            <Flex flex={{ default: 'flex_2' }}>
+              <FlexItem fullWidth={{ default: 'fullWidth' }}>
+                <div>
+                  <div>
+                    <SidebarSectionHeading
+                      text={t('Progressive Sync Step {{x}}', { x: customData?.step })}
+                    />
+                  </div>
+                </div>
+                <Card>
+                  <CardBody>
+                    <pre>{YamlFormatter.stringify(yaml, null, 2)}</pre>
+                  </CardBody>
+                </Card>
+              </FlexItem>
+            </Flex>
+          </Flex>
+        </PageSection>
+      </>
+    );
+  } else {
+    return <div></div>;
+  }
+};
+
+export default AppSetMatchExpressionsTab;
diff --git a/src/gitops/components/appset/graph/ApplicationSetGraphView.tsx b/src/gitops/components/appset/graph/ApplicationSetGraphView.tsx
index f1cb7822..06a71716 100644
--- a/src/gitops/components/appset/graph/ApplicationSetGraphView.tsx
+++ b/src/gitops/components/appset/graph/ApplicationSetGraphView.tsx
@@ -8,7 +8,9 @@ import { HealthStatus } from '@gitops/utils/constants';
 import { ArgoServer, getArgoServer } from '@gitops/utils/gitops';
 import { t } from '@gitops/utils/hooks/useGitOpsTranslation';
 import {
+  HorizontalNav,
   K8sModel,
+  ResourceLink,
   useAnnotationsModal,
   useDeleteModal,
   useK8sModel,
@@ -16,6 +18,18 @@ import {
   useLabelsModal,
   useUserSettings,
 } from '@openshift-console/dynamic-plugin-sdk';
+import {
+  DescriptionList,
+  DescriptionListDescription,
+  DescriptionListGroup,
+  DescriptionListTermHelpText,
+  DescriptionListTermHelpTextButton,
+  Flex,
+  FlexItem,
+  PageSection,
+  Popover,
+  Title,
+} from '@patternfly/react-core';
 import {
   EllipsisHIcon,
   ObjectGroupIcon,
@@ -53,6 +67,7 @@ import {
   SpacerNode,
   TaskEdge,
   TopologyControlBar,
+  TopologySideBar,
   TopologyView,
   Visualization,
   VisualizationProvider,
@@ -64,6 +79,7 @@ import {
 
 import { GraphResourceMenuItem } from '../../application/graph/hooks/GraphResourceMenuItems';
 import { ResourceNode } from '../../application/graph/nodes/ResourceNode';
+import AppSetMatchExpressionsTab from '../AppSetMatchExpressionsTab';
 
 import { ApplicationSetNode } from './nodes/ApplicationSetNode';
 import { StepGroupComponent } from './nodes/StepGroupComponent';
@@ -143,6 +159,7 @@ interface AppSetContextMenuItemProps {
   launchAnnotationsModal: () => void;
   launchDeleteModal: () => void;
   navigate: NavigateFunction;
+  setShowMatchExpressions: (show: boolean) => void;
 }
 
 const getArgoHref = (argoServer: ArgoServer, namespace: string, name: string): string => {
@@ -161,6 +178,7 @@ const AppSetContextMenuItem: React.FC<AppSetContextMenuItemProps> = ({
   launchAnnotationsModal,
   launchDeleteModal,
   navigate,
+  setShowMatchExpressions,
 }) => {
   if (label === '-') {
     return <ContextMenuSeparator component="li" key={`separator:${index}`} />;
@@ -195,6 +213,9 @@ const AppSetContextMenuItem: React.FC<AppSetContextMenuItemProps> = ({
         }
         break;
       }
+      case t('Show all match expressions'):
+        setShowMatchExpressions(true);
+        break;
       case t('Edit labels'):
         launchLabelsModal();
         break;
@@ -231,6 +252,7 @@ interface ContextMenuFactoryParams {
   launchAnnotationsModal: () => void;
   launchDeleteModal: () => void;
   navigate: NavigateFunction;
+  setShowMatchExpressions: (show: boolean) => void;
 }
 
 const createContextMenuItems = (
@@ -282,7 +304,9 @@ const createAppSetComponentFactory =
       case 'group':
         return TransparentGroup;
       case 'step-group':
-        return withSelection()(StepGroupComponent);
+        return withContextMenu((graphElement) =>
+          createContextMenuItems(graphElement, paramsRef, t('Show all match expressions')),
+        )(withSelection()(StepGroupComponent));
       case 'filler-node':
         return DefaultNode;
       case 'task-edge':
@@ -324,6 +348,105 @@ export const TreeViewLayout = {
   PROGRESSIVE_SYNC_FLOW_LAYOUT: 'progressive-sync-flow-layout',
 };
 
+type TopologySideBarParams = {
+  show: boolean;
+  onClose: () => void;
+  selectedIds: string[];
+  controller: Visualization;
+  applicationSet: ApplicationSetKind;
+};
+
+const PAGES = [
+  {
+    href: '',
+    name: t('Match Expressions'),
+    component: AppSetMatchExpressionsTab,
+  },
+];
+
+const getTopologySideBar = ({
+  show,
+  onClose,
+  selectedIds,
+  controller,
+  applicationSet,
+}: TopologySideBarParams): React.ReactElement => {
+  const selectedNode =
+    selectedIds.length > 0
+      ? (controller.getNodeById(selectedIds[0]) as TopologyNode | undefined)
+      : undefined;
+
+  const isStepGroup = selectedNode?.getId().endsWith('-step-group');
+
+  const renderSidebarContent = () => {
+    if (selectedNode === undefined) return <div></div>;
+    if (isStepGroup) {
+      return (
+        <div>
+          <HorizontalNav
+            pages={PAGES}
+            resource={applicationSet}
+            customData={{ step: selectedNode?.getData().step }}
+          />
+        </div>
+      );
+    }
+    return (
+      <div>
+        <PageSection>
+          <Title headingLevel="h2" className="co-section-heading">
+            {selectedNode?.getLabel() ?? selectedIds[0]}
+          </Title>
+          <Flex
+            justifyContent={{ default: 'justifyContentSpaceEvenly' }}
+            direction={{ default: 'column', lg: 'row' }}
+          >
+            <Flex flex={{ default: 'flex_2' }}>
+              <FlexItem fullWidth={{ default: 'fullWidth' }}>
+                <DescriptionList className="pf-c-description-list">
+                  <DescriptionListGroup className="pf-c-description-list__group">
+                    <DescriptionListTermHelpText className="pf-c-description-list__term">
+                      <Popover
+                        headerContent={<div>{t('Name')}</div>}
+                        bodyContent={<div>{t('Name must be unique within a namespace.')}</div>}
+                      >
+                        <DescriptionListTermHelpTextButton>
+                          {t('Name')}
+                        </DescriptionListTermHelpTextButton>
+                      </Popover>
+                    </DescriptionListTermHelpText>
+                    <DescriptionListDescription>
+                      <Flex alignItems={{ default: 'alignItemsCenter' }}>
+                        <ResourceLink
+                          groupVersionKind={{
+                            kind: selectedNode?.getData().kind,
+                            version: selectedNode?.getData().version,
+                            group: selectedNode?.getData().group,
+                          }}
+                          name={selectedNode?.getData().name}
+                          namespace={selectedNode?.getData().namespace}
+                          inline={true}
+                          linkTo={selectedNode?.getData().kind !== applicationSet.kind}
+                        />
+                      </Flex>
+                    </DescriptionListDescription>
+                  </DescriptionListGroup>
+                </DescriptionList>
+              </FlexItem>
+            </Flex>
+          </Flex>
+        </PageSection>
+      </div>
+    );
+  };
+
+  return (
+    <TopologySideBar className="topology-example-sidebar" show={show} onClose={onClose}>
+      <div style={{ marginTop: 27, marginLeft: 20, height: '800px' }}>{renderSidebarContent()}</div>
+    </TopologySideBar>
+  );
+};
+
 export const ApplicationSetGraphView: React.FC<{
   applicationSet: ApplicationSetKind;
   applications: ApplicationKind[];
@@ -352,6 +475,7 @@ export const ApplicationSetGraphView: React.FC<{
   // Track expanded step-groups - only expanded step-groups have their app nodes included in initialNodes
   const [expandedStepGroups, setExpandedStepGroups] = React.useState<Set<string>>(new Set());
   const [selectedIds, setSelectedIds] = React.useState<string[]>([]);
+  const [showMatchExpressions, setShowMatchExpressions] = React.useState(false);
   const [renderKey, setRenderKey] = React.useState(0);
   // Track if initial collapse is pending - hide graph until complete to avoid flicker
   const skipExpandGroupsEffectRef = React.useRef(false);
@@ -375,6 +499,7 @@ export const ApplicationSetGraphView: React.FC<{
     launchAnnotationsModal,
     launchDeleteModal,
     navigate,
+    setShowMatchExpressions,
   });
 
   React.useEffect(() => {
@@ -386,6 +511,7 @@ export const ApplicationSetGraphView: React.FC<{
       launchAnnotationsModal,
       launchDeleteModal,
       navigate,
+      setShowMatchExpressions,
     };
   }, [
     model,
@@ -395,6 +521,7 @@ export const ApplicationSetGraphView: React.FC<{
     launchAnnotationsModal,
     launchDeleteModal,
     navigate,
+    setShowMatchExpressions,
   ]);
 
   const initialNodes = getInitialNodes(
@@ -798,6 +925,13 @@ export const ApplicationSetGraphView: React.FC<{
     <TopologyView
       className="gitops-topology-view"
       // style={{ opacity: graphReady ? 1 : 1 }}
+      sideBar={getTopologySideBar({
+        show: showMatchExpressions,
+        onClose: () => setShowMatchExpressions(false),
+        selectedIds,
+        controller,
+        applicationSet,
+      })}
       controlBar={
         <TopologyControlBar
           controlButtons={createTopologyControlButtons({
diff --git a/src/gitops/components/appset/graph/graph-utils.tsx b/src/gitops/components/appset/graph/graph-utils.tsx
index 6e5b4446..294fc587 100644
--- a/src/gitops/components/appset/graph/graph-utils.tsx
+++ b/src/gitops/components/appset/graph/graph-utils.tsx
@@ -8,7 +8,11 @@ import {
   NODE_DIAMETER,
 } from '@gitops/components/graph/utils';
 import { ApplicationKind, ApplicationModel } from '@gitops/models/ApplicationModel';
-import { ApplicationSetKind, ApplicationStatusContent } from '@gitops/models/ApplicationSetModel';
+import {
+  ApplicationSetKind,
+  ApplicationSetModel,
+  ApplicationStatusContent,
+} from '@gitops/models/ApplicationSetModel';
 import { t } from '@gitops/utils/hooks/useGitOpsTranslation';
 import { resourcePathFromModel } from '@gitops/utils/utils';
 import { K8sModel } from '@openshift-console/dynamic-plugin-sdk';
@@ -54,6 +58,8 @@ const createApplicationSetNode = (
       name: applicationSet?.metadata?.name,
       kind: applicationSet?.kind,
       resourceNodeLayout: resourceNodeLayout,
+      version: ApplicationSetModel.apiVersion || 'v1alpha1',
+      group: ApplicationSetModel.apiGroup || 'argoproj.io',
       badge: 'AS',
       badgeColor: RESOURCE_COLORS.get(
         RESOURCE_BADGE_COLORS.get('.co-m-resource-' + applicationSet?.kind.toLowerCase()),
@@ -226,6 +232,13 @@ export const getInitialNodes = (
     const sortedSteps = Array.from(stepGroupAppsMap.keys()).sort();
     sortedSteps.forEach((step) => {
       const stepGroupApps = stepGroupAppsMap.get(step);
+      const stepMatchExpression =
+        applicationSet.spec?.strategy?.rollingSync?.steps?.[
+          parseInt(step) - 1
+        ]?.matchExpressions?.at(0);
+      const key = stepMatchExpression?.key || '';
+      const operator = stepMatchExpression?.operator || '';
+      const values = stepMatchExpression?.values?.[0] || '';
       if (stepGroupApps.length === 0 && hasApplicationStatus) {
         stepGroupAppsMap.set(step.toString(), [step + '-filler-node']);
         initialNodes.push({
@@ -269,7 +282,7 @@ export const getInitialNodes = (
         type: 'step-group',
         group: true,
         rank: 3,
-        label: 'Progressive Sync Step ' + step,
+        label: key + ' ' + operator + ' ' + values,
         children: [...stepGroupApps],
         data: {
           step: step,
diff --git a/src/gitops/components/appset/graph/nodes/StepGroupComponent.tsx b/src/gitops/components/appset/graph/nodes/StepGroupComponent.tsx
index b2f50730..40d69c1b 100644
--- a/src/gitops/components/appset/graph/nodes/StepGroupComponent.tsx
+++ b/src/gitops/components/appset/graph/nodes/StepGroupComponent.tsx
@@ -7,6 +7,7 @@ import {
 } from '@gitops/components/application/graph/icons/resource-colours';
 import { APP_NODE_HEIGHT } from '@gitops/components/graph/utils';
 import { successColor, warningColor } from '@gitops/utils/components/Icons/Icons';
+import { t } from '@gitops/utils/hooks/useGitOpsTranslation';
 import ApplicationIcon from '@images/resources/application.svg';
 import { Tooltip } from '@patternfly/react-core';
 import { HeartIcon, PauseIcon, SyncAltIcon, WarningTriangleIcon } from '@patternfly/react-icons';
@@ -22,6 +23,7 @@ import {
   RectAnchor,
   ShapeProps,
   useAnchor,
+  WithContextMenuProps,
   WithSelectionProps,
 } from '@patternfly/react-topology';
 import styles from '@patternfly/react-topology/dist/esm/css/topology-components';
@@ -265,58 +267,73 @@ const DummyShape: React.FunctionComponent<RectangleProps> = ({
 };
 
 // This is the collapsible group of applications that have the same step, determined by the matched expression defined in the ApplicationSet
-export const StepGroupComponent: React.FC<WithSelectionProps & { element: TopologyNode }> =
-  observer(({ element, onSelect, selected }) => {
-    useAnchor(RightAnchor, AnchorEnd.source, 'task-edge');
-    useAnchor(LeftAnchor, AnchorEnd.target, 'task-edge');
+export const StepGroupComponent: React.FC<
+  WithContextMenuProps & WithSelectionProps & { element: TopologyNode }
+> = observer(({ element, onContextMenu, contextMenuOpen, onSelect, selected }) => {
+  useAnchor(RightAnchor, AnchorEnd.source, 'task-edge');
+  useAnchor(LeftAnchor, AnchorEnd.target, 'task-edge');
 
-    const handleCollapseChange = React.useCallback((group: TopologyNode, collapsed: boolean) => {
-      const stepGroup = group
-        .getGraph()
-        .getChildren()
-        .find((c) => c.getId() === 'transparent-group-of-step-groups-' + group.getData()?.step);
-      if (stepGroup) {
-        stepGroup.getData().isCollapsed = collapsed;
-      }
-      // Update expanded step-groups state to trigger structural refresh
-      // Get callback from controller (not graph) since graph may be replaced during model updates
-      const graph = group.getGraph();
-      const controller = graph?.getController?.();
-      const updateExpanded = (controller as any)?.updateExpandedStepGroups;
-      if (updateExpanded) {
-        updateExpanded(group.getId(), !collapsed);
+  const handleCollapseChange = React.useCallback((group: TopologyNode, collapsed: boolean) => {
+    const stepGroup = group
+      .getGraph()
+      .getChildren()
+      .find((c) => c.getId() === 'transparent-group-of-step-groups-' + group.getData()?.step);
+    if (stepGroup) {
+      stepGroup.getData().isCollapsed = collapsed;
+    }
+    // Update expanded step-groups state to trigger structural refresh
+    // Get callback from controller (not graph) since graph may be replaced during model updates
+    const graph = group.getGraph();
+    const controller = graph?.getController?.();
+    const updateExpanded = (controller as any)?.updateExpandedStepGroups;
+    if (updateExpanded) {
+      updateExpanded(group.getId(), !collapsed);
+    }
+  }, []);
+
+  const handleContextMenu = React.useCallback(
+    (e: React.MouseEvent) => {
+      if (!selected) {
+        onSelect?.(e);
       }
-    }, []);
+      onContextMenu?.(e);
+    },
+    [onSelect, onContextMenu, selected],
+  );
 
-    return (
-      <DefaultGroup
-        element={element}
-        className={css('gitops-step-group', selected && 'pf-m-selected')}
-        borderRadius={5}
-        collapsible={true}
-        hulledOutline={true}
-        showLabelOnHover={false}
-        showLabel={true}
-        labelPosition={LabelPosition.top}
-        badgeLocation={BadgeLocation.inner}
-        badgeColor="var(--pf-t--global--background--color--floating--default)"
-        badgeBorderColor={RESOURCE_COLORS.get(
-          RESOURCE_BADGE_COLORS.get('.co-m-resource-application'),
-        )}
-        badgeTextColor="var(--pf-t--global--text--color--regular)"
-        badge={element.getData().step}
-        collapsedShadowOffset={0}
-        collapsedWidth={300}
-        collapsedHeight={50}
-        getCollapsedShape={() => DummyShape}
-        labelClassName={css('gitops-step-group-label', selected && 'pf-m-selected')}
-        onCollapseChange={handleCollapseChange}
-        onSelect={onSelect}
-        selected={selected}
-      >
-        <CollapsedGroup element={element} width={300} height={50} selected={selected} />
-      </DefaultGroup>
-    );
-  });
+  return (
+    <DefaultGroup
+      element={element}
+      className={css('gitops-step-group', selected && 'pf-m-selected')}
+      borderRadius={5}
+      collapsible={true}
+      hulledOutline={true}
+      showLabelOnHover={false}
+      showLabel={true}
+      truncateLength={20}
+      hideContextMenuKebab={false}
+      labelPosition={LabelPosition.top}
+      badgeLocation={BadgeLocation.inner}
+      badgeColor="var(--pf-t--global--background--color--floating--default)"
+      badgeBorderColor={RESOURCE_COLORS.get(
+        RESOURCE_BADGE_COLORS.get('.co-m-resource-application'),
+      )}
+      badgeTextColor="var(--pf-t--global--text--color--regular)"
+      badge={t('Step {{x}}', { x: element.getData().step })}
+      collapsedShadowOffset={0}
+      collapsedWidth={300}
+      collapsedHeight={50}
+      getCollapsedShape={() => DummyShape}
+      labelClassName={css('gitops-step-group-label', selected && 'pf-m-selected')}
+      onCollapseChange={handleCollapseChange}
+      onContextMenu={handleContextMenu}
+      contextMenuOpen={contextMenuOpen}
+      onSelect={onSelect}
+      selected={selected}
+    >
+      <CollapsedGroup element={element} width={300} height={50} selected={selected} />
+    </DefaultGroup>
+  );
+});
 
 export default StepGroupComponent;
