fix: fix the alignment of breadcrumb and funnel actions

Author: ahmadshaheer

frontend/src/api/features/getFeatureFlags.ts

@@ -0,0 +1,10 @@
+import axios from 'api';
+import { ApiResponse } from 'types/api';
+import { FeatureFlagProps } from 'types/api/features/getFeaturesFlags';
+
+const getFeaturesFlags = (): Promise<FeatureFlagProps[]> =>
+	axios
+		.get<ApiResponse<FeatureFlagProps[]>>(`/featureFlags`)
+		.then((response) => response.data.data);
+
+export default getFeaturesFlags;

frontend/src/hooks/useGetFeatureFlag.tsx

@@ -1,29 +1,18 @@
-import list from 'api/v1/features/list';
+import getFeaturesFlags from 'api/features/getFeatureFlags';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import { useQuery, UseQueryResult } from 'react-query';
-import { SuccessResponseV2 } from 'types/api';
-import APIError from 'types/api/error';
 import { FeatureFlagProps } from 'types/api/features/getFeaturesFlags';
 
-export interface Props {
-	onSuccessHandler: (routes: FeatureFlagProps[]) => void;
-	isLoggedIn: boolean;
-}
-type UseGetFeatureFlag = UseQueryResult<
-	SuccessResponseV2<FeatureFlagProps[]>,
-	APIError
->;
-
-export const useGetFeatureFlag = (
+const useGetFeatureFlag = (
 	onSuccessHandler: (routes: FeatureFlagProps[]) => void,
 	isLoggedIn: boolean,
-): UseGetFeatureFlag =>
-	useQuery<SuccessResponseV2<FeatureFlagProps[]>, APIError>({
+): UseQueryResult<FeatureFlagProps[], unknown> =>
+	useQuery<FeatureFlagProps[]>({
+		queryFn: getFeaturesFlags,
 		queryKey: [REACT_QUERY_KEY.GET_FEATURES_FLAGS],
-		queryFn: () => list(),
-		onSuccess: (data) => {
-			onSuccessHandler(data.data);
-		},
+		onSuccess: onSuccessHandler,
 		retryOnMount: false,
 		enabled: !!isLoggedIn,
 	});
+
+export default useGetFeatureFlag;

frontend/src/pages/TracesFunnelDetails/components/FunnelConfiguration/FunnelConfiguration.styles.scss

@@ -13,7 +13,8 @@
 
 	&__header {
 		display: flex;
-		justify-content: flex-start;
+		align-items: center;
+		justify-content: space-between;
 		padding: 14px 16px;
 		border-bottom: 1px solid var(--bg-slate-400);
 		&-right {

frontend/src/providers/App/App.tsx

@@ -5,7 +5,7 @@ import getUserVersion from 'api/v1/version/getVersion';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import dayjs from 'dayjs';
 import useActiveLicenseV3 from 'hooks/useActiveLicenseV3/useActiveLicenseV3';
-import { useGetFeatureFlag } from 'hooks/useGetFeatureFlag';
+import useGetFeatureFlag from 'hooks/useGetFeatureFlag';
 import { useGlobalEventListener } from 'hooks/useGlobalEventListener';
 import useGetUser from 'hooks/user/useGetUser';
 import {