@orchestrator-ui/orchestrator-ui-components 3.0.3 → 3.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@orchestrator-ui/orchestrator-ui-components",
-    "version": "3.0.3",
+    "version": "3.1.0",
     "license": "Apache-2.0",
     "description": "Library of UI Components used to display the workflow orchestrator frontend",
     "author": {
@@ -31,9 +31,7 @@
         "build": "npm run generate-version && tsup src/index.ts",
         "tsc": "tsc --noEmit",
         "lint": "eslint \"src/**/*.ts*\"",
-        "dev": "npm run build -- --watch",
-        "storybook": "storybook dev -p 6006",
-        "build-storybook": "storybook build"
+        "dev": "npm run build -- --watch"
     },
     "dependencies": {
         "@elastic/eui": "^97.0.0",
@@ -66,13 +64,6 @@
         "@orchestrator-ui/eslint-config-custom": "*",
         "@orchestrator-ui/jest-config": "*",
         "@reduxjs/toolkit": "^2.0.1",
-        "@storybook/addon-essentials": "^8.1.10",
-        "@storybook/addon-interactions": "^8.1.10",
-        "@storybook/addon-links": "^8.1.10",
-        "@storybook/addon-onboarding": "^8.1.10",
-        "@storybook/blocks": "^8.1.10",
-        "@storybook/nextjs": "^8.1.10",
-        "@storybook/react": "^8.3.6",
         "@testing-library/jest-dom": "^6.6.2",
         "@testing-library/react": "^16.0.1",
         "@testing-library/user-event": "^14.5.2",
@@ -84,7 +75,6 @@
         "jest": "^29.7.0",
         "jest-environment-jsdom": "^29.7.0",
         "jest-watch-typeahead": "^2.2.2",
-        "storybook": "^8.1.10",
         "tsup": "^8.0.1",
         "typescript": "^5.5.2",
         "uniforms-bridge-simple-schema-2": "^3.8.1"

package/src/components/WfoBadges/WfoWebsocketStatusBadge/WfoWebsocketStatusBadge.tsx

@@ -1,20 +1,26 @@
-import React, { useCallback, useEffect } from 'react';
+import React, { FC, useCallback, useEffect } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { useTranslations } from 'next-intl';
 
 import { EuiToolTip } from '@elastic/eui';
 
+import { WfoHeaderBadge } from '@/components';
 import { useWithOrchestratorTheme } from '@/hooks';
 import { useOrchestratorTheme } from '@/hooks/useOrchestratorTheme';
 import { WfoBoltFill, WfoBoltSlashFill } from '@/icons';
 import { orchestratorApi } from '@/rtk';
 import { useStreamMessagesQuery } from '@/rtk/endpoints/streamMessages';
 
-import { WfoHeaderBadge } from '../WfoHeaderBadge';
 import { getStyles } from './styles';
 
-export const WfoWebsocketStatusBadge = () => {
+interface WfoWebsocketStatusBadgeProps {
+    hideWhenConnected?: boolean;
+}
+
+export const WfoWebsocketStatusBadge: FC<WfoWebsocketStatusBadgeProps> = ({
+    hideWhenConnected = false,
+}) => {
     const dispatch = useDispatch();
     const { connectedStyle, disconnectedStyle } =
         useWithOrchestratorTheme(getStyles);
@@ -23,6 +29,8 @@ export const WfoWebsocketStatusBadge = () => {
     const { theme } = useOrchestratorTheme();
     const { data: websocketConnected } = useStreamMessagesQuery();
 
+    const showBadge = !(websocketConnected && hideWhenConnected);
+
     const reconnect = useCallback(() => {
         dispatch(orchestratorApi.util.resetApiState());
     }, [dispatch]);
@@ -56,7 +64,7 @@ export const WfoWebsocketStatusBadge = () => {
         };
     }, [reconnect, websocketConnected]);
 
-    return (
+    return showBadge ? (
         <EuiToolTip
             position="bottom"
             content={
@@ -85,5 +93,7 @@ export const WfoWebsocketStatusBadge = () => {
                 iconOnClickAriaLabel={undefined}
             />
         </EuiToolTip>
+    ) : (
+        <></>
     );
 };

package/src/components/WfoForms/formFields/utils.ts

@@ -1,9 +1,8 @@
-import { isDate } from 'moment';
+import { isDate } from 'moment/moment';
 
+import { PortMode, ProductTag } from '@/components';
 import { ProductBlockInstance, SubscriptionDetail } from '@/types';
 
-import { PortMode, ProductTag } from './deprecated/types';
-
 // NOTE: There might potentially (?) be more productBlockInstances with portMod but we get the last one here
 export const getPortMode = (
     productBlockInstances: ProductBlockInstance[],

package/src/components/WfoInlineNoteEdit/WfoInlineNoteEdit.tsx

@@ -5,50 +5,37 @@ import { EuiInlineEditText } from '@elastic/eui';
 
 import { WfoToolTip } from '@/components';
 import { useOrchestratorTheme } from '@/hooks';
-import { useStartProcessMutation } from '@/rtk/endpoints/forms';
-import type { Subscription } from '@/types';
+import { INVISIBLE_CHARACTER } from '@/utils';
 
 interface WfoInlineNoteEditProps {
-    value: Subscription['note'];
-    subscriptionId?: Subscription['subscriptionId'];
+    value: string;
     onlyShowOnHover?: boolean;
+    triggerNoteModifyWorkflow?: (note: string) => void;
 }
 
 export const WfoInlineNoteEdit: FC<WfoInlineNoteEditProps> = ({
     value,
-    subscriptionId,
     onlyShowOnHover = false,
+    triggerNoteModifyWorkflow = () => {},
 }) => {
     const { theme } = useOrchestratorTheme();
-    const [note, setNote] = useState<string>(value ?? '');
+    const [note, setNote] = useState<string>(value);
     const [isTooltipVisible, setIsTooltipVisible] = useState<boolean>(true);
 
-    const [startProcess] = useStartProcessMutation();
-    const triggerNoteModifyWorkflow = () => {
-        const noteModifyPayload = [
-            { subscription_id: subscriptionId },
-            { note },
-        ];
-        startProcess({
-            workflowName: 'modify_note',
-            userInputs: noteModifyPayload,
-        });
-    };
-
     const handleSave = () => {
-        triggerNoteModifyWorkflow();
+        triggerNoteModifyWorkflow(note);
         setIsTooltipVisible(true);
     };
 
     const handleCancel = () => {
-        setNote(value ?? '');
+        setNote(value);
         setIsTooltipVisible(true);
     };
 
     // This useEffect makes sure the note is updated when a new value property is passed in
     // for example by a parent component that is update through a websocket event
     useEffect(() => {
-        setNote(value ?? '');
+        setNote(value);
     }, [value]);
 
     return (
@@ -63,72 +50,79 @@ export const WfoInlineNoteEdit: FC<WfoInlineNoteEditProps> = ({
             }}
         >
             <WfoToolTip
-                css={{ visibility: isTooltipVisible ? 'visible' : 'hidden' }}
+                css={{
+                    visibility:
+                        isTooltipVisible && note !== INVISIBLE_CHARACTER
+                            ? 'visible'
+                            : 'hidden',
+                }}
                 tooltipContent={note}
             >
-                <EuiInlineEditText
-                    inputAriaLabel="Edit note"
-                    value={note}
-                    onChange={(e: ChangeEvent<HTMLInputElement>) => {
-                        setNote(e.target.value);
-                    }}
-                    onCancel={handleCancel}
-                    onSave={handleSave}
-                    size={'s'}
-                    css={{
-                        width: theme.base * 16,
-                        '.euiFlexItem:nth-of-type(2)': {
-                            justifyContent: 'center',
-                        },
-                        '.euiButtonEmpty__content': {
-                            justifyContent: 'left',
-                        },
-                    }}
-                    readModeProps={{
-                        onClick: () => setIsTooltipVisible(false),
-                        title: '',
-                        css: {
-                            minWidth: '100%',
-                            '.euiIcon': {
-                                visibility: onlyShowOnHover
-                                    ? 'hidden'
-                                    : 'visible',
+                <span>
+                    <EuiInlineEditText
+                        inputAriaLabel="Edit note"
+                        value={note}
+                        onChange={(e: ChangeEvent<HTMLInputElement>) => {
+                            setNote(e.target.value);
+                        }}
+                        onCancel={handleCancel}
+                        onSave={handleSave}
+                        size={'s'}
+                        css={{
+                            width: theme.base * 16,
+                            '.euiFlexItem:nth-of-type(2)': {
+                                justifyContent: 'center',
                             },
-                        },
-                    }}
-                    editModeProps={{
-                        saveButtonProps: {
-                            color: 'primary',
-                            size: 'xs',
-                        },
-                        cancelButtonProps: {
-                            color: 'danger',
-                            size: 'xs',
-                        },
-                        inputProps: {
-                            css: {
+                            '.euiButtonEmpty__content': {
                                 justifyContent: 'left',
-                                height: '32px',
-                                paddingLeft: '4px',
-                                margin: '0',
-                                width: '98%',
                             },
-                        },
-                        formRowProps: {
+                        }}
+                        readModeProps={{
+                            onClick: () => setIsTooltipVisible(false),
+                            title: '',
                             css: {
-                                padding: 0,
-                                margin: 0,
-                                height: '32px',
-                                '.euiFormRow__fieldWrapper': {
-                                    minHeight: '32px',
+                                minWidth: '100%',
+                                '.euiIcon': {
+                                    visibility: onlyShowOnHover
+                                        ? 'hidden'
+                                        : 'visible',
+                                },
+                            },
+                        }}
+                        editModeProps={{
+                            saveButtonProps: {
+                                color: 'primary',
+                                size: 'xs',
+                            },
+                            cancelButtonProps: {
+                                color: 'danger',
+                                size: 'xs',
+                            },
+                            inputProps: {
+                                css: {
+                                    justifyContent: 'left',
                                     height: '32px',
+                                    paddingLeft: '4px',
+                                    margin: '0',
+                                    width: '98%',
+                                },
+                            },
+                            formRowProps: {
+                                css: {
                                     padding: 0,
                                     margin: 0,
+                                    height: '32px',
+                                    '.euiFormRow__fieldWrapper': {
+                                        minHeight: '32px',
+                                        height: '32px',
+                                        padding: 0,
+                                        margin: 0,
+                                    },
                                 },
                             },
-                        },
-                    }}
-                />
+                        }}
+                    />
+                </span>
             </WfoToolTip>
         </div>
     );

package/src/components/WfoInlineNoteEdit/WfoSubscriptionDetailNoteEdit.tsx

@@ -0,0 +1,55 @@
+import type { FC } from 'react';
+import React from 'react';
+
+import { WfoInlineNoteEdit } from '@/components';
+import { useGetSubscriptionDetailQuery } from '@/rtk';
+import { useStartProcessMutation } from '@/rtk/endpoints/forms';
+import { useUpdateSubscriptionDetailNoteOptimisticMutation } from '@/rtk/endpoints/subscriptionListMutation';
+import { SubscriptionDetail } from '@/types';
+import { INVISIBLE_CHARACTER } from '@/utils';
+
+interface WfoSubscriptionDetailNoteEditProps {
+    subscriptionId: SubscriptionDetail['subscriptionId'];
+    onlyShowOnHover?: boolean;
+}
+
+export const WfoSubscriptionDetailNoteEdit: FC<
+    WfoSubscriptionDetailNoteEditProps
+> = ({ subscriptionId, onlyShowOnHover = false }) => {
+    const { data, endpointName } = useGetSubscriptionDetailQuery({
+        subscriptionId,
+    });
+
+    const selectedItem = data?.subscription ?? { note: '' };
+    const [startProcess] = useStartProcessMutation();
+    const [updateSub] = useUpdateSubscriptionDetailNoteOptimisticMutation();
+
+    const triggerNoteModifyWorkflow = (note: string) => {
+        const noteModifyPayload = [
+            { subscription_id: subscriptionId },
+            { note: note === INVISIBLE_CHARACTER ? '' : note },
+        ];
+        startProcess({
+            workflowName: 'modify_note',
+            userInputs: noteModifyPayload,
+        });
+
+        updateSub({
+            queryName: endpointName ?? '',
+            subscriptionId: subscriptionId,
+            note: note,
+        });
+    };
+
+    return (
+        <WfoInlineNoteEdit
+            value={
+                selectedItem?.note?.trim()
+                    ? selectedItem.note
+                    : INVISIBLE_CHARACTER
+            }
+            onlyShowOnHover={onlyShowOnHover}
+            triggerNoteModifyWorkflow={triggerNoteModifyWorkflow}
+        />
+    );
+};

package/src/components/WfoInlineNoteEdit/WfoSubscriptionNoteEdit.tsx

@@ -0,0 +1,64 @@
+import type { FC } from 'react';
+import React from 'react';
+
+import { WfoInlineNoteEdit } from '@/components';
+import { ApiResult, SubscriptionListResponse, UseQuery } from '@/rtk';
+import { useStartProcessMutation } from '@/rtk/endpoints/forms';
+import { useUpdateSubscriptionNoteOptimisticMutation } from '@/rtk/endpoints/subscriptionListMutation';
+import { Subscription } from '@/types';
+import { INVISIBLE_CHARACTER } from '@/utils';
+
+interface WfoSubscriptionNoteEditProps {
+    subscriptionId: Subscription['subscriptionId'];
+    onlyShowOnHover?: boolean;
+    queryVariables: Record<string, unknown>;
+    useQuery: UseQuery<SubscriptionListResponse, Subscription>;
+}
+
+export const WfoSubscriptionNoteEdit: FC<WfoSubscriptionNoteEditProps> = ({
+    subscriptionId,
+    onlyShowOnHover = false,
+    queryVariables,
+    useQuery,
+}) => {
+    const { selectedItem } = useQuery(queryVariables, {
+        selectFromResult: (result: ApiResult<SubscriptionListResponse>) => ({
+            selectedItem: result?.data?.subscriptions?.find(
+                (sub) => sub.subscriptionId === subscriptionId,
+            ),
+        }),
+    });
+    const endpointName = useQuery().endpointName;
+    const [startProcess] = useStartProcessMutation();
+    const [updateSub] = useUpdateSubscriptionNoteOptimisticMutation();
+
+    const triggerNoteModifyWorkflow = (note: string) => {
+        const noteModifyPayload = [
+            { subscription_id: subscriptionId },
+            { note: note === INVISIBLE_CHARACTER ? '' : note },
+        ];
+        startProcess({
+            workflowName: 'modify_note',
+            userInputs: noteModifyPayload,
+        });
+
+        updateSub({
+            queryName: endpointName ?? '',
+            subscriptionId: subscriptionId,
+            graphQlQueryVariables: queryVariables,
+            note: note,
+        });
+    };
+
+    return (
+        <WfoInlineNoteEdit
+            value={
+                selectedItem?.note?.trim()
+                    ? selectedItem.note
+                    : INVISIBLE_CHARACTER
+            }
+            onlyShowOnHover={onlyShowOnHover}
+            triggerNoteModifyWorkflow={triggerNoteModifyWorkflow}
+        />
+    );
+};

package/src/components/WfoInlineNoteEdit/index.ts

@@ -1 +1,3 @@
 export * from './WfoInlineNoteEdit';
+export * from './WfoSubscriptionNoteEdit';
+export * from './WfoSubscriptionDetailNoteEdit';

package/src/components/WfoPageTemplate/WfoPageHeader/WfoPageHeader.tsx

@@ -17,6 +17,7 @@ import {
     WfoEngineStatusBadge,
     WfoEnvironmentBadge,
     WfoFailedTasksBadge,
+    WfoWebsocketStatusBadge,
 } from '@/components';
 import { WfoAppLogo } from '@/components/WfoPageTemplate/WfoPageHeader/WfoAppLogo';
 import { getWfoPageHeaderStyles } from '@/components/WfoPageTemplate/WfoPageHeader/styles';
@@ -70,6 +71,7 @@ export const WfoPageHeader: FC<WfoPageHeaderProps> = ({
             <EuiHeaderSection>
                 <EuiHeaderSectionItem>
                     <EuiBadgeGroup css={{ marginRight: multiplyByBaseUnit(1) }}>
+                        <WfoWebsocketStatusBadge hideWhenConnected={true} />
                         <WfoEngineStatusBadge />
                         <WfoFailedTasksBadge />
                     </EuiBadgeGroup>

package/src/components/WfoPageTemplate/WfoPageTemplate/WfoPageTemplate.tsx

@@ -1,13 +1,11 @@
 import React, { FC, ReactElement, ReactNode, useState } from 'react';
 
-import { EuiPageTemplate } from '@elastic/eui';
 import type { EuiThemeColorMode } from '@elastic/eui';
+import { EuiPageTemplate } from '@elastic/eui';
 import { EuiSideNavItemType } from '@elastic/eui/src/components/side_nav/side_nav_types';
 
-import { useOrchestratorTheme } from '../../../hooks/useOrchestratorTheme';
-import { WfoBreadcrumbs } from '../WfoBreadcrumbs';
-import { WfoPageHeader } from '../WfoPageHeader';
-import { WfoSidebar } from '../WfoSidebar';
+import { WfoBreadcrumbs, WfoPageHeader, WfoSidebar } from '@/components';
+import { useOrchestratorTheme } from '@/hooks';
 
 export interface WfoPageTemplateProps {
     getAppLogo: (navigationHeight: number) => ReactElement;
@@ -35,7 +33,6 @@ export const WfoPageTemplate: FC<WfoPageTemplateProps> = ({
                 navigationHeight={navigationHeight}
                 onThemeSwitch={onThemeSwitch}
             />
-
             {/* Sidebar and content area */}
             <EuiPageTemplate
                 panelled={false}
@@ -48,6 +45,8 @@ export const WfoPageTemplate: FC<WfoPageTemplateProps> = ({
                     <EuiPageTemplate.Sidebar
                         css={{
                             backgroundColor: theme.colors.body,
+                            overflowY: 'auto',
+                            maxHeight: `calc(100vh - ${navigationHeight}px)`,
                         }}
                     >
                         <WfoSidebar overrideMenuItems={overrideMenuItems} />
@@ -56,6 +55,8 @@ export const WfoPageTemplate: FC<WfoPageTemplateProps> = ({
                 <EuiPageTemplate.Section
                     css={{
                         backgroundColor: theme.colors.emptyShade,
+                        overflowY: 'auto',
+                        maxHeight: `calc(100vh - ${navigationHeight}px)`,
                     }}
                 >
                     <WfoBreadcrumbs

package/src/components/WfoSubscription/WfoSubscriptionGeneralSections/WfoSubscriptionDetailSection.tsx

@@ -6,7 +6,7 @@ import {
     SubscriptionKeyValueBlock,
     WfoCustomerDescriptionsField,
     WfoInSyncField,
-    WfoInlineNoteEdit,
+    WfoSubscriptionDetailNoteEdit,
     WfoSubscriptionStatusBadge,
 } from '@/components';
 import { SubscriptionDetail } from '@/types';
@@ -35,7 +35,6 @@ export const WfoSubscriptionDetailSection = ({
         status,
         customer,
         customerDescriptions,
-        note,
     } = subscriptionDetail;
 
     const subscriptionDetailBlockData = [
@@ -102,9 +101,9 @@ export const WfoSubscriptionDetailSection = ({
         {
             key: t('note'),
             value: (
-                <WfoInlineNoteEdit
+                <WfoSubscriptionDetailNoteEdit
                     subscriptionId={subscriptionId}
-                    value={note}
+                    onlyShowOnHover={true}
                 />
             ),
         },

package/src/components/WfoSubscriptionsList/WfoSubscriptionsList.tsx

@@ -10,24 +10,26 @@ import {
     Pagination,
     WfoDateTime,
     WfoInlineJson,
-    WfoInlineNoteEdit,
     WfoInsyncIcon,
     WfoJsonCodeBlock,
     WfoSubscriptionStatusBadge,
     getPageIndexChangeHandler,
     getPageSizeChangeHandler,
 } from '@/components';
+import { WfoSubscriptionNoteEdit } from '@/components/WfoInlineNoteEdit/WfoSubscriptionNoteEdit';
 import { WfoAdvancedTable } from '@/components/WfoTable/WfoAdvancedTable';
 import { WfoAdvancedTableColumnConfig } from '@/components/WfoTable/WfoAdvancedTable/types';
 import { ColumnType } from '@/components/WfoTable/WfoTable';
 import { mapSortableAndFilterableValuesToTableColumnConfig } from '@/components/WfoTable/WfoTable/utils';
 import { DataDisplayParams, useShowToastMessage } from '@/hooks';
+import { UseQuery } from '@/rtk';
 import {
+    SubscriptionListResponse,
     useGetSubscriptionListQuery,
     useLazyGetSubscriptionListQuery,
 } from '@/rtk/endpoints/subscriptionList';
 import { mapRtkErrorToWfoError } from '@/rtk/utils';
-import { GraphqlQueryVariables, SortOrder } from '@/types';
+import { GraphqlQueryVariables, SortOrder, Subscription } from '@/types';
 import {
     getQueryVariablesForExport,
     getTypedFieldFromObject,
@@ -150,13 +152,21 @@ export const WfoSubscriptionsList: FC<WfoSubscriptionsListProps> = ({
             note: {
                 columnType: ColumnType.DATA,
                 label: t('note'),
-                renderData: (cellValue, row) => (
-                    <WfoInlineNoteEdit
-                        subscriptionId={row.subscriptionId}
-                        value={cellValue}
-                        onlyShowOnHover={true}
-                    />
-                ),
+                renderData: (cellValue, row) => {
+                    return (
+                        <WfoSubscriptionNoteEdit
+                            queryVariables={graphqlQueryVariables}
+                            subscriptionId={row.subscriptionId}
+                            onlyShowOnHover={true}
+                            useQuery={
+                                useGetSubscriptionListQuery as UseQuery<
+                                    SubscriptionListResponse,
+                                    Subscription
+                                >
+                            }
+                        />
+                    );
+                },
             },
             metadata: {
                 columnType: ColumnType.DATA,

package/src/configuration/version.ts

@@ -1 +1 @@
-export const ORCHESTRATOR_UI_LIBRARY_VERSION = '3.0.3';
+export const ORCHESTRATOR_UI_LIBRARY_VERSION = '3.1.0';

package/src/messages/en-GB.json

@@ -20,6 +20,7 @@
         "lightMode": "Light mode",
         "websocketConnected": "This page receives live updates from the server",
         "websocketDisconnected": "The connection to the server is lost, click the icon or refresh the page",
+        "websocketDisconnectedShort": "WebSocket disconnected, click the icon to reconnect",
         "resetToDefault": "Reset to default",
         "savePreferences": "Save preferences",
         "numberOfRows": "Number of rows",

package/src/messages/nl-NL.json

@@ -20,6 +20,7 @@
         "lightMode": "Light mode",
         "websocketConnected": "De pagina ontvangt live updates van de server",
         "websocketDisconnected": "De websocket verbinding is verbroken, klik op het icoon of ververs de pagina.",
+        "websocketDisconnectedShort": "WebSocket verbroken, klik op het icoon om opnieuw te verbinden.",
         "resetToDefault": "Reset naar standaard",
         "savePreferences": "Voorkeuren opslaan",
         "numberOfRows": "Aantal rijen",

package/src/rtk/api.ts

@@ -3,10 +3,12 @@ import { GraphQLErrorExtensions } from 'graphql/error/GraphQLError';
 import { getSession, signOut } from 'next-auth/react';
 
 import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+import { ErrorResponse } from '@rtk-query/graphql-request-base-query/dist/GraphqlBaseQueryTypes';
 
+import { SubscriptionListItem } from '@/components';
 import type { WfoSession } from '@/hooks';
 import { wfoGraphqlRequestBaseQuery } from '@/rtk/wfoGraphqlRequestBaseQuery';
-import { CacheTagType } from '@/types';
+import { CacheTagType, GraphqlQueryVariables } from '@/types';
 
 import type { RootState } from './store';
 
@@ -28,6 +30,34 @@ export enum HttpStatus {
     MultipleChoices = 300,
 }
 
+export interface ApiResult<T> {
+    data?: T;
+    error?: ErrorResponse;
+    isLoading: boolean;
+    isFetching: boolean;
+    isError: boolean;
+    refetch?: () => void;
+    selectFromResult?: (result: T) => T;
+    endpointName?: string;
+}
+
+interface UseQueryOptions<T, U> {
+    selectFromResult?: (
+        result: ApiResult<T>,
+    ) => Partial<ApiResult<T>> & { selectedItem?: U };
+    subscriptionId?: string;
+}
+
+interface UseQueryReturn<T, U> extends ApiResult<T> {
+    selectedItem?: U;
+    endpointName?: string;
+}
+
+export type UseQuery<T, U> = (
+    queryVariables?: GraphqlQueryVariables<SubscriptionListItem>,
+    options?: UseQueryOptions<T, U>,
+) => UseQueryReturn<T, U>;
+
 type ExtraOptions = {
     baseQueryType?: BaseQueryTypes;
     apiName?: string;

package/src/rtk/endpoints/streamMessages.ts

@@ -50,7 +50,7 @@ const streamMessagesApi = orchestratorApi.injectEndpoints({
     endpoints: (build) => ({
         streamMessages: build.query<boolean, void>({
             queryFn: () => {
-                return { data: false };
+                return { data: true };
             },
             async onCacheEntryAdded(
                 _,