@availity/mui-spaces 1.0.31 → 1.1.1

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.1.1](https://github.com/Availity/element/compare/@availity/mui-spaces@1.1.0...@availity/mui-spaces@1.1.1) (2025-10-09)
+
+### Dependency Updates
+
+* `mui-favorites` updated to version `1.1.0`
+* `@availity/mock` updated to version `1.1.0`
+
+### Bug Fixes
+
+* **mui-spaces:** try to parse operationName ([8189c94](https://github.com/Availity/element/commit/8189c94dd6b8fef981266d121b3a2893639fa482))
+
+## [1.1.0](https://github.com/Availity/element/compare/@availity/mui-spaces@1.0.31...@availity/mui-spaces@1.1.0) (2025-09-25)
+
+
+### Features
+
+* **mui-spaces:** add operationName support ([f33f02b](https://github.com/Availity/element/commit/f33f02b2ef3cacee17a48a86849e2b4c96fac722))
+
 ## [1.0.31](https://github.com/Availity/element/compare/@availity/mui-spaces@1.0.30...@availity/mui-spaces@1.0.31) (2025-09-22)
 
 ## [1.0.30](https://github.com/Availity/element/compare/@availity/mui-spaces@1.0.29...@availity/mui-spaces@1.0.30) (2025-08-21)

package/dist/index.d.mts

@@ -85,6 +85,18 @@ type SpacesProps = {
     /** Override the default variables used in the thanos query. Default: { types: [PAYERSPACE] }.
      * If the spaces provider should contain configurations of a type other than PAYERSPACE, you must override this prop */
     variables?: object;
+    /**
+     * Name for the GraphQL operation, used for debugging and monitoring.
+     *
+     * If an operation name exists in the query string, leave this undefined or
+     * ensure it matches what is in the query string.
+     *
+     * If no operation name exists in the query string, it can be defined here.
+     *
+     * Format: `{ValueStream || PayerName}{AbbreviatedAppName}{Description}{Type}` (PascalCase)
+     * @example "OnbPsFavoritesQuery"
+     */
+    operationName?: string;
     /** The Client ID obtained from APIConnect. */
     clientId?: string;
     /** Children can be a react child or render prop. */
@@ -101,14 +113,14 @@ type SpacesProps = {
      * Useful for if you already have the spaces in your app and don't want the spaces provider to have to fetch them again. */
     spaces?: Space[];
 };
-type UseSpaces = (...ids: string[]) => (Space)[] | undefined;
+type UseSpaces = (...ids: string[]) => Space[] | undefined;
 
 declare const INITIAL_STATE: {
     loading: boolean;
 };
 declare const SpacesContext: react.Context<SpacesContextType>;
 declare const useSpacesContext: () => SpacesContextType;
-declare const Spaces: ({ query, variables, clientId, children, payerIds, spaceIds, spaces: spacesFromProps, }: SpacesProps) => JSX.Element;
+declare const Spaces: ({ query, variables, operationName, clientId, children, payerIds, spaceIds, spaces: spacesFromProps, }: SpacesProps) => JSX.Element;
 declare const useSpaces: UseSpaces;
 
 type SpacesLinkVariants = 'card' | 'list' | 'default' | undefined;

package/dist/index.d.ts

@@ -85,6 +85,18 @@ type SpacesProps = {
     /** Override the default variables used in the thanos query. Default: { types: [PAYERSPACE] }.
      * If the spaces provider should contain configurations of a type other than PAYERSPACE, you must override this prop */
     variables?: object;
+    /**
+     * Name for the GraphQL operation, used for debugging and monitoring.
+     *
+     * If an operation name exists in the query string, leave this undefined or
+     * ensure it matches what is in the query string.
+     *
+     * If no operation name exists in the query string, it can be defined here.
+     *
+     * Format: `{ValueStream || PayerName}{AbbreviatedAppName}{Description}{Type}` (PascalCase)
+     * @example "OnbPsFavoritesQuery"
+     */
+    operationName?: string;
     /** The Client ID obtained from APIConnect. */
     clientId?: string;
     /** Children can be a react child or render prop. */
@@ -101,14 +113,14 @@ type SpacesProps = {
      * Useful for if you already have the spaces in your app and don't want the spaces provider to have to fetch them again. */
     spaces?: Space[];
 };
-type UseSpaces = (...ids: string[]) => (Space)[] | undefined;
+type UseSpaces = (...ids: string[]) => Space[] | undefined;
 
 declare const INITIAL_STATE: {
     loading: boolean;
 };
 declare const SpacesContext: react.Context<SpacesContextType>;
 declare const useSpacesContext: () => SpacesContextType;
-declare const Spaces: ({ query, variables, clientId, children, payerIds, spaceIds, spaces: spacesFromProps, }: SpacesProps) => JSX.Element;
+declare const Spaces: ({ query, variables, operationName, clientId, children, payerIds, spaceIds, spaces: spacesFromProps, }: SpacesProps) => JSX.Element;
 declare const useSpaces: UseSpaces;
 
 type SpacesLinkVariants = 'card' | 'list' | 'default' | undefined;

package/dist/index.js

@@ -98,6 +98,10 @@ var import_react_query = require("@tanstack/react-query");
 
 // src/lib/spaces-data.tsx
 var import_api_axios = require("@availity/api-axios");
+var parseOperationName = (query) => {
+  const match = query.match(/(?:query|mutation|subscription)\s+([a-zA-Z_][a-zA-Z0-9_]*)/i);
+  return match == null ? void 0 : match[1];
+};
 var actions = {
   SPACES: (currentState, { spaces, spacesByConfig, spacesByPayer }) => ({
     previousSpacesMap: spaces,
@@ -118,7 +122,7 @@ var spacesReducer = (state, action) => {
   const { type } = action;
   return actions[type](state, action);
 };
-var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, variables }) {
+var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, variables, operationName }) {
   const headers = {};
   if (clientId) {
     headers["X-Client-ID"] = clientId;
@@ -130,7 +134,8 @@ var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, vari
   } = yield import_api_axios.avWebQLApi.create(
     {
       query,
-      variables: __spreadValues({}, variables)
+      variables: __spreadValues({}, variables),
+      operationName: operationName || parseOperationName(query) || "PuiSpacesCmpAnonymousOperation"
     },
     { headers: __spreadValues({}, headers) }
   );
@@ -148,21 +153,22 @@ var fetchAllSpaces = (_0) => __async(null, [_0], function* ({
   query,
   clientId,
   variables,
-  _spaces = []
+  _spaces = [],
+  operationName
 }) {
-  const { items, currentPage, hasNextPage } = yield fetchSpaces({ query, clientId, variables });
+  const { items, currentPage, hasNextPage } = yield fetchSpaces({ query, clientId, variables, operationName });
   _spaces.push(...items);
   if (hasNextPage) {
     const vars = __spreadProps(__spreadValues({}, variables), {
       page: currentPage + 1
     });
-    return fetchAllSpaces({ query, clientId, variables: vars, _spaces });
+    return fetchAllSpaces({ query, clientId, variables: vars, _spaces, operationName });
   }
   return _spaces;
 });
 
 // src/lib/configurationFindMany.tsx
-var configurationFindMany_default = `query configurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
+var configurationFindMany_default = `query PuiSpacesCmpConfigurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
   configurationPagination(filter: { ids: $ids, payerIds: $payerIDs, types: $types }, page: $page) {
     pageInfo {
       hasNextPage
@@ -582,6 +588,7 @@ var useSpacesContext = () => (0, import_react3.useContext)(SpacesContext);
 var Spaces = ({
   query = configurationFindMany_default,
   variables = { types: ["PAYERSPACE"] },
+  operationName,
   clientId,
   children,
   payerIds,
@@ -637,12 +644,12 @@ var Spaces = ({
     queries: [
       {
         queryKey: ["id", spaceIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars, operationName }),
         enabled: spaceIdsToQuery.size > 0
       },
       {
         queryKey: ["id", payerIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars, operationName }),
         enabled: payerIdsToQuery.size > 0
       }
     ]

package/dist/index.mjs

@@ -56,6 +56,10 @@ import { useQueries } from "@tanstack/react-query";
 
 // src/lib/spaces-data.tsx
 import { avWebQLApi } from "@availity/api-axios";
+var parseOperationName = (query) => {
+  const match = query.match(/(?:query|mutation|subscription)\s+([a-zA-Z_][a-zA-Z0-9_]*)/i);
+  return match == null ? void 0 : match[1];
+};
 var actions = {
   SPACES: (currentState, { spaces, spacesByConfig, spacesByPayer }) => ({
     previousSpacesMap: spaces,
@@ -76,7 +80,7 @@ var spacesReducer = (state, action) => {
   const { type } = action;
   return actions[type](state, action);
 };
-var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, variables }) {
+var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, variables, operationName }) {
   const headers = {};
   if (clientId) {
     headers["X-Client-ID"] = clientId;
@@ -88,7 +92,8 @@ var fetchSpaces = (_0) => __async(null, [_0], function* ({ query, clientId, vari
   } = yield avWebQLApi.create(
     {
       query,
-      variables: __spreadValues({}, variables)
+      variables: __spreadValues({}, variables),
+      operationName: operationName || parseOperationName(query) || "PuiSpacesCmpAnonymousOperation"
     },
     { headers: __spreadValues({}, headers) }
   );
@@ -106,21 +111,22 @@ var fetchAllSpaces = (_0) => __async(null, [_0], function* ({
   query,
   clientId,
   variables,
-  _spaces = []
+  _spaces = [],
+  operationName
 }) {
-  const { items, currentPage, hasNextPage } = yield fetchSpaces({ query, clientId, variables });
+  const { items, currentPage, hasNextPage } = yield fetchSpaces({ query, clientId, variables, operationName });
   _spaces.push(...items);
   if (hasNextPage) {
     const vars = __spreadProps(__spreadValues({}, variables), {
       page: currentPage + 1
     });
-    return fetchAllSpaces({ query, clientId, variables: vars, _spaces });
+    return fetchAllSpaces({ query, clientId, variables: vars, _spaces, operationName });
   }
   return _spaces;
 });
 
 // src/lib/configurationFindMany.tsx
-var configurationFindMany_default = `query configurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
+var configurationFindMany_default = `query PuiSpacesCmpConfigurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
   configurationPagination(filter: { ids: $ids, payerIds: $payerIDs, types: $types }, page: $page) {
     pageInfo {
       hasNextPage
@@ -540,6 +546,7 @@ var useSpacesContext = () => useContext2(SpacesContext);
 var Spaces = ({
   query = configurationFindMany_default,
   variables = { types: ["PAYERSPACE"] },
+  operationName,
   clientId,
   children,
   payerIds,
@@ -595,12 +602,12 @@ var Spaces = ({
     queries: [
       {
         queryKey: ["id", spaceIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars, operationName }),
         enabled: spaceIdsToQuery.size > 0
       },
       {
         queryKey: ["id", payerIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars, operationName }),
         enabled: payerIdsToQuery.size > 0
       }
     ]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/mui-spaces",
-  "version": "1.0.31",
+  "version": "1.1.1",
   "description": "Availity MUI Spaces Component - part of the @availity/element design system",
   "keywords": [
     "react",
@@ -45,7 +45,7 @@
     "@availity/mui-chip": "^1.0.4",
     "@availity/mui-dialog": "^1.0.15",
     "@availity/mui-disclaimer": "^1.0.5",
-    "@availity/mui-favorites": "^1.1.6",
+    "@availity/mui-favorites": "^1.1.7",
     "@availity/mui-icon": "^1.1.0",
     "@availity/mui-layout": "^1.0.2",
     "@availity/mui-list": "^1.0.7",
@@ -66,7 +66,7 @@
     "@availity/mui-chip": "^1.0.4",
     "@availity/mui-dialog": "^1.0.15",
     "@availity/mui-disclaimer": "^1.0.5",
-    "@availity/mui-favorites": "^1.1.6",
+    "@availity/mui-favorites": "^1.1.7",
     "@availity/mui-icon": "^1.1.0",
     "@availity/mui-layout": "^1.0.2",
     "@availity/mui-list": "^1.0.7",

package/src/lib/Spaces.tsx

@@ -17,6 +17,7 @@ export const useSpacesContext = () => useContext(SpacesContext);
 export const Spaces = ({
   query = configurationFindMany,
   variables = { types: ['PAYERSPACE'] },
+  operationName,
   clientId,
   children,
   payerIds,
@@ -82,12 +83,12 @@ export const Spaces = ({
     queries: [
       {
         queryKey: ['id', spaceIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: spaceIdVars, operationName }),
         enabled: spaceIdsToQuery.size > 0,
       },
       {
         queryKey: ['id', payerIdVars],
-        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars }),
+        queryFn: () => fetchAllSpaces({ query, clientId, variables: payerIdVars, operationName }),
         enabled: payerIdsToQuery.size > 0,
       },
     ],

package/src/lib/configurationFindMany.tsx

@@ -1,4 +1,4 @@
-export default `query configurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
+export default `query PuiSpacesCmpConfigurationFindMany($ids: [String!], $payerIDs: [ID!], $types: [TypeEnum!], $page: Int) {
   configurationPagination(filter: { ids: $ids, payerIds: $payerIDs, types: $types }, page: $page) {
     pageInfo {
       hasNextPage

package/src/lib/spaces-data.test.tsx

@@ -1,4 +1,4 @@
-import { fetchAllSpaces } from './spaces-data';
+import { fetchAllSpaces, parseOperationName } from './spaces-data';
 import configurationFindMany from './configurationFindMany';
 // eslint-disable-next-line @nx/enforce-module-boundaries
 import { server } from '../../../mock/src/lib/server';
@@ -38,3 +38,42 @@ describe('getAllSpaces', () => {
     expect(apiCalls).toBe(2);
   });
 });
+
+describe('parseQueryName', () => {
+  it('should return the query name if one exists in the query', async () => {
+    const opName = parseOperationName(configurationFindMany);
+
+    expect(opName).toBe('PuiSpacesCmpConfigurationFindMany');
+  });
+
+  it('should return the mutation name if one exists in the mutation', async () => {
+    const opName = parseOperationName(`
+      mutation FakeMutation($ids: [String!]) {
+        fakeMutation({ ids: $ids }) {
+          id
+        }
+    }`);
+
+    expect(opName).toBe('FakeMutation');
+  });
+
+  it('should return the subscription name if one exists in the subscription', async () => {
+    const opName = parseOperationName(`
+      subscription FakeSubscription($ids: [String!]) {
+        fakeSubscription({ ids: $ids }) {
+          id
+        }
+      }`);
+
+    expect(opName).toBe('FakeSubscription');
+  });
+
+  it('should return undefined if an opeation does not exist on the query', async () => {
+    const opName = parseOperationName(`
+        fakeQuery({ ids: $ids }) {
+          id
+        }`);
+
+    expect(opName).toBe(undefined);
+  });
+});

package/src/lib/spaces-data.tsx

@@ -1,6 +1,11 @@
 import { avWebQLApi } from '@availity/api-axios';
 import { Space, FetchSpacesProps, FetchAllSpacesProps, SpacesContextType, SpacesReducerAction } from './spaces-types';
 
+export const parseOperationName = (query: string): string | undefined => {
+  const match = query.match(/(?:query|mutation|subscription)\s+([a-zA-Z_][a-zA-Z0-9_]*)/i);
+  return match?.[1];
+};
+
 export const actions = {
   SPACES: (
     currentState: SpacesContextType,
@@ -28,7 +33,7 @@ export const spacesReducer = (state: SpacesContextType, action: SpacesReducerAct
   return actions[type](state, action);
 };
 
-export const fetchSpaces = async ({ query, clientId, variables }: FetchSpacesProps) => {
+export const fetchSpaces = async ({ query, clientId, variables, operationName }: FetchSpacesProps) => {
   const headers: Record<string, string> = {};
 
   if (clientId) {
@@ -43,6 +48,7 @@ export const fetchSpaces = async ({ query, clientId, variables }: FetchSpacesPro
     {
       query,
       variables: { ...variables },
+      operationName: operationName || parseOperationName(query) || 'PuiSpacesCmpAnonymousOperation',
     },
     { headers: { ...headers } }
   );
@@ -64,8 +70,9 @@ export const fetchAllSpaces = async ({
   clientId,
   variables,
   _spaces = [],
+  operationName,
 }: FetchAllSpacesProps): Promise<Space[]> => {
-  const { items, currentPage, hasNextPage } = await fetchSpaces({ query, clientId, variables });
+  const { items, currentPage, hasNextPage } = await fetchSpaces({ query, clientId, variables, operationName });
 
   _spaces.push(...items);
 
@@ -74,7 +81,7 @@ export const fetchAllSpaces = async ({
       ...variables,
       page: currentPage + 1,
     };
-    return fetchAllSpaces({ query, clientId, variables: vars, _spaces });
+    return fetchAllSpaces({ query, clientId, variables: vars, _spaces, operationName });
   }
 
   return _spaces;

package/src/lib/spaces-types.tsx

@@ -66,6 +66,18 @@ export type FetchSpacesProps = {
   variables?: object;
   /** The page sent to the avWebQL endpoint. */
   page?: string;
+  /**
+   * Name for the GraphQL operation, used for debugging and monitoring.
+   *
+   * If an operation name exists in the query string, leave this undefined or
+   * ensure it matches what is in the query string.
+   *
+   * If no operation name exists in the query string, it can be defined here.
+   *
+   * Format: `{ValueStream || PayerName}{AbbreviatedAppName}{Description}{Type}` (PascalCase)
+   * @example "OnbPsFavoritesQuery"
+   */
+  operationName?: string;
 };
 
 export type FetchAllSpacesProps = {
@@ -77,6 +89,18 @@ export type FetchAllSpacesProps = {
   variables?: Record<string, any>;
   /** Array of spaces to be passed into the Spaces provider. */
   _spaces?: Space[];
+  /**
+   * Name for the GraphQL operation, used for debugging and monitoring.
+   *
+   * If an operation name exists in the query string, leave this undefined or
+   * ensure it matches what is in the query string.
+   *
+   * If no operation name exists in the query string, it can be defined here.
+   *
+   * Format: `{ValueStream || PayerName}{AbbreviatedAppName}{Description}{Type}` (PascalCase)
+   * @example "OnbPsFavoritesQuery"
+   */
+  operationName?: string;
 };
 
 export type SpacesContextType = {
@@ -116,6 +140,18 @@ export type SpacesProps = {
   /** Override the default variables used in the thanos query. Default: { types: [PAYERSPACE] }.
    * If the spaces provider should contain configurations of a type other than PAYERSPACE, you must override this prop */
   variables?: object;
+  /**
+   * Name for the GraphQL operation, used for debugging and monitoring.
+   *
+   * If an operation name exists in the query string, leave this undefined or
+   * ensure it matches what is in the query string.
+   *
+   * If no operation name exists in the query string, it can be defined here.
+   *
+   * Format: `{ValueStream || PayerName}{AbbreviatedAppName}{Description}{Type}` (PascalCase)
+   * @example "OnbPsFavoritesQuery"
+   */
+  operationName?: string;
   /** The Client ID obtained from APIConnect. */
   clientId?: string;
   /** Children can be a react child or render prop. */
@@ -133,4 +169,4 @@ export type SpacesProps = {
   spaces?: Space[];
 };
 
-export type UseSpaces = (...ids: string[]) => (Space)[] | undefined;
+export type UseSpaces = (...ids: string[]) => Space[] | undefined;