Skip to main content

Group Store

The GroupStore is a reactive store that manages group operations and group-related data. It provides a simplified interface for group management while automatically synchronizing with the backend.

Overview

The GroupStore provides:

  • Group list management and synchronization
  • Group operations and updates
  • Group sharing request management
  • Subgroup management
  • Automatic state synchronization
  • Reactive state management

Accessing the Store

Access the GroupStore through the CDF instance:

const groupStore = espCDF.groupStore;

Properties

PropertyTypeDescription
groupListESPRMGroup[] (computed)A computed array of all groups in the store. This is automatically updated when groups are added or removed.
groupsByID{ [key: string]: ESPRMGroup }A dictionary of groups indexed by their group ID for quick lookup.
issuedSharingRequests{ [key: string]: ESPGroupSharingRequest[] } (computed)Sharing requests that the current user has issued to other users, grouped by status.
receivedSharingRequests{ [key: string]: ESPGroupSharingRequest[] } (computed)Sharing requests that the current user has received from other users, grouped by status.
hasNextbooleanIndicates if there are more groups to fetch (pagination).
hasNextIssuedSharingRequestsbooleanIndicates if there are more issued sharing requests to fetch.
hasNextReceivedSharingRequestsbooleanIndicates if there are more received sharing requests to fetch.

Example Usage

// Get all groups
const groups = groupStore.groupList;
console.log("Total groups:", groups.length);
groups.forEach(group => {
console.log("Group:", group.name, group.id);
});

// Get group by ID
const group = groupStore.groupsByID["group123"];
if (group) {
console.log("Group found:", group.name);
}

// Get sharing requests
const issuedRequests = groupStore.issuedSharingRequests;
console.log("Pending requests:", issuedRequests.pending);
console.log("Accepted requests:", issuedRequests.accepted);

const receivedRequests = groupStore.receivedSharingRequests;
console.log("Pending requests:", receivedRequests.pending);

// Check for pagination
if (groupStore.hasNext) {
await groupStore.fetchNext();
}

if (groupStore.hasNextIssuedSharingRequests) {
await groupStore.fetchNextIssuedSharingRequest();
}

if (groupStore.hasNextReceivedSharingRequests) {
await groupStore.fetchNextReceivedSharingRequest();
}

GroupStore Methods

Sync Group List

To fetch the list of groups from the cloud and update the store, use the syncGroupList() method. This is automatically called when autoSync is enabled during login.

try {
await groupStore.syncGroupList();
console.log("Groups synced:", groupStore.groupList);
} catch (error) {
console.error("Error syncing groups:", error);
}

Set Group List

To set the group list in the store, use the setGroupList() method. Each group is made observable and interceptors are set up.

/*
- groups: Array of groups to set
*/

try {
const groups = await userStore.user.getGroups({ withNodeList: true, withSubGroups: true });
groupStore.setGroupList(groups.groups);
console.log("Group list set successfully");
} catch (error) {
console.error("Error setting group list:", error);
}

Add Group

To add a single group to the store and make it observable, use the addGroup() method.

/*
- group: The group to add
*/

try {
const newGroup = await userStore.user.createGroup({ name: "My Group" });
const observableGroup = groupStore.addGroup(newGroup);
console.log("Group added:", observableGroup);
} catch (error) {
console.error("Error adding group:", error);
}

Set Group by ID

To set a group in the store by its ID, use the setGroupByID() method.

/*
- id: The group ID
- group: The group object
*/

groupStore.setGroupByID("group123", group);

Expand Groups

To retrieve groups by their IDs from the store, use the expand() method.

/*
- groupIds: Array of group IDs
*/

const groups = groupStore.expand(["group1", "group2", "group3"]);
console.log("Expanded groups:", groups);

Update Multiple Groups

To update multiple groups in a single operation, use the updateMultipleGroups() method.

/*
- updates: Array of partial group updates
*/

groupStore.updateMultipleGroups([
{ id: "group1", name: "Updated Name 1" },
{ id: "group2", name: "Updated Name 2" }
]);

Delete Groups

To remove multiple groups from the store by their IDs, use the deleteGroups() method.

/*
- ids: Array of group IDs to delete
*/

try {
await groupStore.deleteGroups(["group1", "group2"]);
console.log("Groups deleted successfully");
} catch (error) {
console.error("Error deleting groups:", error);
}

Fetch Next Page

To fetch the next page of groups when pagination is available, use the fetchNext() method.

if (groupStore.hasNext) {
try {
const response = await groupStore.fetchNext();
console.log("Next groups:", response.groups);
} catch (error) {
console.error("Error fetching next page:", error);
}
}

Fetch Next Issued Sharing Request

To fetch the next page of issued sharing requests, use the fetchNextIssuedSharingRequest() method.

if (groupStore.hasNextIssuedSharingRequests) {
try {
const response = await groupStore.fetchNextIssuedSharingRequest();
console.log("Next requests:", response.sharedRequests);
} catch (error) {
console.error("Error fetching issued requests:", error);
}
}

Fetch Next Received Sharing Request

To fetch the next page of received sharing requests, use the fetchNextReceivedSharingRequest() method.

if (groupStore.hasNextReceivedSharingRequests) {
try {
const response = await groupStore.fetchNextReceivedSharingRequest();
console.log("Next requests:", response.sharedRequests);
} catch (error) {
console.error("Error fetching received requests:", error);
}
}

Clear Store

To clear all groups and sharing requests from the store, use the clear() method.

groupStore.clear();

Add Custom Property

To dynamically add an observable property to the store with getter and setter methods, use the addProperty() method.

/*
- propertyName: Name of the property to add
- initialValue: Initial value for the property
*/

groupStore.addProperty("customData", {});
// Creates: customData, getCustomData(), setCustomData(value)

SDK Methods Available via Group Instance

Each group in the GroupStore is an ESPRMGroup instance. These methods are available directly on group objects. For detailed documentation, refer to the ESPRMGroup API Reference.

Group Management Methods

Subgroup Methods

SDK Methods Available via User Instance

Group operations can also be performed through the ESPRMUser instance. For detailed documentation, refer to the ESPRMUser API Reference.

Get Groups Methods

Create Groups Methods

Share Groups Methods

Accessing Group Properties

Once you have a group from the store, you can access its properties:

const group = groupStore.groupsByID["group123"];

// Group properties
console.log("Group ID:", group.id);
console.log("Group Name:", group.name);
console.log("Group Description:", group.description);
console.log("Group Type:", group.type);
console.log("Nodes:", group.nodes);
console.log("Sub Groups:", group.subGroups);
console.log("Custom Data:", group.customData);
console.log("Metadata:", group.metadata);
console.log("Mutually Exclusive:", group.mutuallyExclusive);

Reactive Updates

The GroupStore is reactive, so you can observe changes:

import { useEffect } from 'react';

useEffect(() => {
console.log("Group list updated:", groupStore.groupList);
}, [groupStore.groupList]);

useEffect(() => {
const group = groupStore.groupsByID["group123"];
if (group) {
console.log("Group updated:", group);
}
}, [groupStore.groupsByID["group123"]]);

Automatic Store Synchronization

When autoSync is enabled in CDF configuration, the GroupStore automatically synchronizes when a user logs in. This happens in the UserStore.setUserInstance() method.

Sharing Requests

The GroupStore manages group sharing requests. Sharing requests are automatically processed and made observable:

// Access sharing requests
const issuedRequests = groupStore.issuedSharingRequests;
const receivedRequests = groupStore.receivedSharingRequests;

// Accept a received request
const request = receivedRequests.pending[0];
if (request) {
await request.accept();
}

// Decline a received request
await request.decline();

// Remove an issued request
await request.remove();

For detailed information about group sharing, see Share Groups documentation.

Working with Groups

Creating a Group

try {
const newGroup = await userStore.user.createGroup({
name: "Living Room",
description: "Devices in the living room",
nodeIds: ["node1", "node2"]
});

// Group is automatically added to the store via interceptor
console.log("Group created:", groupStore.groupsByID[newGroup.id]);
} catch (error) {
console.error("Error creating group:", error);
}

Adding Nodes to a Group

const group = groupStore.groupsByID["group123"];
if (group) {
await group.addNodes(["node3", "node4"]);
// Nodes are automatically updated in the store
}

Removing Nodes from a Group

const group = groupStore.groupsByID["group123"];
if (group) {
await group.removeNodes(["node3"]);
// Nodes are automatically updated in the store
}

Updating Group Information

const group = groupStore.groupsByID["group123"];
if (group) {
await group.updateGroupInfo({
groupName: "Updated Name",
description: "Updated description",
customData: { key: "value" }
});
// Group info is automatically updated in the store
}

Creating a Subgroup

const group = groupStore.groupsByID["group123"];
if (group) {
const subGroup = await group.createSubGroup({
name: "Sub Group",
nodeIds: ["node5"]
});
// Subgroup is automatically added to the parent group
}

Getting Subgroups

const group = groupStore.groupsByID["group123"];
if (group) {
const subGroups = await group.getSubGroups();
console.log("Subgroups:", subGroups);
}

Deleting a Group

const group = groupStore.groupsByID["group123"];
if (group) {
await group.delete();
// Group is automatically removed from the store
}

Leaving a Group

const group = groupStore.groupsByID["group123"];
if (group) {
await group.leave();
// Group is automatically removed from the store
}

Additional Resources