Methods

❗️info

Here are valuable methods of the Collection Class listed.

setKey()

Assigns a new key/name to the Collection.

MY_COLLECTION.setKey("newKey");
MY_COLLECTION.key; // Returns 'newKey'

❓ Why a Key

• helps us during debug sessions
• makes it easier to identify the Collection
• no need for separate persist Key

📭 Props

Prop	Type	Default	Required
value	string | number | undefined	undefined	Yes

📄 Return

Collection

Returns the Collection it was called on.

---

Group()

Creates a new Group without associating it to the Collection. Therefore, this function is intended for use in the Collection config object, where the constructor() takes care of the associating.

createCollection((collection) => ({
  groups: {
    myGroup: collection.Group(["item1", "item2"])
  }
}));

The itemKeys which the Group initially represents are passed as a first parameter in an array shape.

collection.Group(["item1", "item2"]);

The object key is used as groupKey, if we don't pass a separate key into the Group config.

createCollection((collection) => ({
    groups: {
        myGroup: collection.Group(["item1", "item2"], {key: "myCoolGroup"}) // Key === "myCoolGroup"
    }
}));

createCollection((collection) => ({
    groups: {
        myGroup: collection.Group(["item1", "item2"]) // Key === "myGroup"
    }
}));

For creating Groups in general (outside the Collection config), we strongly recommend using the createGroup() method because it directly associates the Group to the Collection without further thinking.

MY_COLLECTION.createGroup('myGroup', ['item1', 'item2']);

📭 Props

Prop	Type	Default	Description	Required
initialItems	Array<string | number>	[]	Initial itemKeys of Group	No
config	GroupConfig	{}	Configuration	No

📄 Return

Group

---

Selector()

Creates a new Selector without associating it to the Collection. Therefore, this function is intended for use in the Collection config object, where the constructor() takes care of the associating.

createCollection((collection) => ({
    selectors: {
        mySelector: collection.Selector("item1")
    }
}));

The itemKey of the Item which the Selector initially represents is passed as a first parameter.

collection.Selector("item1");

The object key is used as selectorKey, if we don't pass a separate key into the Selector config.

createCollection((collection) => ({
    selectors: {
        mySelector: collection.Selector("item1", {key: "myCoolSelector"}) // Key === "myCoolSelector"
    }
}));

createCollection((collection) => ({
    selectors: {
        mySelector: collection.Selector("item1") // Key === "mySelector"
    }
}));

For creating Selectors in general (outside the Collection Config), we strongly recommend using the createSelector() method because it directly associates the Selector to the Collection, without further thinking.

MY_COLLECTION.createSelector('mySelector', 'toSelectKey');

📭 Props

Prop	Type	Default	Description	Required
initialKey	string | number	undefined	Initial itemKey of Item the Selector represents	Yes
config	SelectorConfig	{}	Configuration	No

📄 Return

Selector

---

initSelectors()

🔥warning

No public function! (only public for testing purpose)
It is called once after the Collection is created and takes care of creating Selectors defined in the Collection config object.

---

initGroups()

🔥warning

No public function! (only public for testing purpose)
It is called once after the Collection is created and takes care of creating Groups defined in the Collection config object. In addition, it instantiates the default Group, which is like an interface to all collected data.

---

collect()

We use the collect() method to add object-shaped data to the Collection. Be aware that each data needs one primaryKey to be correctly identified later.

MY_COLLECTION.collect({id: 1, name: "jeff"});

In the above example, the primaryKey property is id, so '1' is the unique identifier (primaryKey) of the collected data. We can also collect multiple data objects at once.

MY_COLLECTION.collect([{id: 9, name: "hans"}, {id: 22, name: "frank"}]);

Each collected data is transformed to an extension of the State Class called Item. All Items are directly stored in the Collection.

{
    1: Item(1) // has value '{id: 1, name: "jeff"}'
    9: Item(9)  // has value '{id: 9, name: "hans"}'
    22: Item(22) // has value '{id: 22, name: "frank"}'
}

👨‍👩‍👧 Add Data to Group

We can directly define in the collect() method to which Groups the data should be added. Groups are used to preserve the ordering of structured data and can be seen as an interface to the actual Collection data.

MY_COLLECTION.collect({id: 1, name: "jeff"}, ["group1", "group2"]);

If we pass a key that belongs to a not existing Group, the collect() method takes care of creating this Group. For example, if we assume that the Group with the groupKey 'group1' doesn't exist yet. Then a Group with the initial itemKeys '[1]' and the groupKey 'group1' is created by the Collection.

// Groups of Collection
{
    group1: Group("group1"), // value [1] 
    group2: Group("group2"), // value [1]
    default: Group("default") // value [1, 9, 22]
}

By default, all collected data is added to the default Group. In conclusion, we can draw that the default Group represents all Items of the Collection. But don't forget that each Item is stored directly in the Collection and not in the Group. Imagine Groups as interfaces to the stored Items.

🌎 Existing primaryKey

We don't have to worry about collecting an already existing primaryKey. If this is the case, the existing data gets simply overwritten by the new one.

MY_COLLECTION.collect({id: 1, name: "jeff"}); 
MY_COLLECTION.getItemValue(1); // Returns '{id: 1, name: "jeff"}'
MY_COLLECTION.collect({id: 1, name: "benno"}); // Overwrites already collected Data
MY_COLLECTION.getItemValue(1); // Returns '{id: 1, name: "benno"}'

🔑 Change primaryKey property

Sometimes the primaryKey isn't represented by the id property. If that is the case, we can change the primaryKey property in the Collection config.

createCollection({
    primaryKey: "key" // default 'id'
}); 
MY_COLLECTION.collect({key: 1, name: "frank"});

📭 Props

Prop	Type	Default	Description	Required
data	DataType | Array<DataType> (DataType = Object)	[]	Data added to the Collection	Yes
groupKeys	Array<string | number>	[]	Keys of Groups to which the Data will be added	No
config	CollectConfig	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

update()

The update() method is used to update the Item data at the given primaryKey.

MY_COLLECTION.collect({id: 1, name: "hans"});
MY_COLLECTION.update(1, {name: "frank"});
MY_COLLECTION.getItem(1); // Returns '{id: 1, name: "frank"}'

Therefore, we pass the primary Key of the Item, which should be updated as the first parameter. And specify as the second parameter the data object that is merged into the found Item data by default.

🌪 Overwrite Data

In order to overwrite the entire Item data with the passed data object, we set patch to false in the configuration object. The configuration object can be passed as a third parameter.

MY_COLLECTION.update(1, {id: 1, name: 'hans'}, {patch: false});

Because the changes are not merged into the Item data anymore, we have to redefine the primaryKey in the given data object. Otherwise, the primary Key gets missing, which can lead to problems.

❓ Deepmerge

Unfortunately, the update() method doesn't support deep merges yet. In conclusion, the merge only happens at the top-level of the objects. If AgileTs can't find a particular property, it will add it at the top-level of the Item data object.

MY_COLLECTION.collect({id: 1, data: {name: "jeff"}});
MY_COLLECTION.update(1, {name: "frank"}); // new value is (see below)
// {id: 1, data: {name: "jeff"}, name: "frank"}

In case we don't want to add not existing properties to the Item data object, we can set addNewProperties to false in the configuration object.

MY_COLLECTION.collect({id: 1, data: {name: "jeff"}});
MY_COLLECTION.update(1, {name: "frank"}, {patch: {addNewProperties: false}}); // new value is (see below)
// {id: 1, data: {name: "jeff"}}

📭 Props

Prop	Type	Default	Description	Required
itemKey	number | string	undefined	primary Key of the Item that will be updated	Yes
changes	object	{}	Data merged into the found Item data	Yes
config	UpdateConfig	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

createGroup()

Creates a new Group and automatically associates it to the Collection.

const MY_GROUP = MY_COLLECTION.createGroup('myGroup', [1, 2, 3]); 

To correctly identify the Group later, we must pass a unique key/name as the first parameter. Such key is, for instance, required to remove or access the Group.

const MY_GROUP = MY_COLLECTION.getGroup('myGroup');

The itemKeys which the Group initially represents are passed as the second parameter in an array shape.

const MY_GROUP = MY_COLLECTION.createGroup('myGroup', [1, 3, 7, 9]); 

It's not necessary to pass only existing itemKeys. However, we strongly recommend it. If a Group can't find an Item to an itemKey in the Collection, it prints a warning and skips the Item in the Group's output. Let's assume that the Item with the primaryKey '3' doesn't exist.

const MY_GROUP = MY_COLLECTION.createGroup('myGroup', [1, 3, 7]); 
MY_GROUP.output; // Returns (see below)
/*
[
  {id: 1, name: 'jeff'},
  // No Item(3) value, since it doesn't exist
  {id: 7, name: 'frank'}
]
 */

The Collection holds a reference to each not existing Item. This reference makes it possible to add the Item to the Group output and trigger a rerender on all subscribed UI-Components when the missing Item got collected.

📭 Props

Prop	Type	Default	Description	Required
groupKey	number | string	undefined	Key/Name of Group	Yes
initialItems	Array<string | number>	[]	Initial itemKeys of Group	No

📄 Return

Group

---

hasGroup()

Checks if a Group exists at the given groupKey in the Collection.

MY_COLLECTION.hasGroup('group5'); // Returns false
MY_COLLECTION.createGroup('group6');
MY_COLLECTION.hasGroup('group6'); // Returns true

📭 Props

Prop	Type	Default	Description	Required
groupKey	number | string	undefined	Key/Name of Group	Yes
config	HasConfig	{}	Configuration	No

📄 Return

boolean

---

getGroup()

Returns the Group at the given groupKey.

const MY_GROUP = MY_COLLECTION.getGroup('myGroup');

If it can't find the desired Group, it returns undefined.

❗️info

The getGroup() method is perfect for accessing a Group in our business logic. However, it has some disadvantages when we use it to subscribe a Group to a UI-Component using, for instance, the useAgiel() hook. The reason is that it returns undefined whenever the Group doesn't exist. Thus, AgileTs can't keep a reference to the Group and isn't able to rerender the subscribed UI-Component, whenever the Group is created. To solve this problem the Collection provides a function called getGroupWithReference() which returns a reference to the not existing Group instead of undefined.

📭 Props

Prop	Type	Default	Description	Required
groupKey	number | string	undefined	Key/Name of Group	Yes
config	HasConfig	{}	Configuration	No

📄 Return

Group | undefined

---

getDefaultGroup()

Returns the default Group of the Collection.

MY_COLLECTION.getDefaultGroup();
// equal to
MY_COLLECTION.getGroup(MY_COLLECTION.config.defaultGroupKey);

If it can't find the default Group, it returns undefined. But if that is the case, something big has gone wrong.

📄 Return

Group | undefined

---

getGroupWithReference()

Returns like getGroup() the Group at the given groupKey.

const MY_GROUP = MY_COLLECTION.getGroupWithReference('myGroup');

However, it differs in one key area. It doesn't return undefined, if it couldn't find the desired Group. Instead, it returns a placeholder Group to hold a reference to the not existing Group. For example, such a reference is helpful to reliably subscribe a not existing Group to a UI-Component, for instance, with the useAgile() hook.

// Doesn't cause rerender, when Group is created and returns undefined
const myGroup = useAgile(MY_COLLECTION.getGroup('myGroup'));

// Does cause rerender, when Group is created and returns an empty array
const myGroupWithReference = useAgile(MY_COLLECTION.getGroupWithReferenece('myGroup'));

📭 Props

Prop	Type	Default	Required
groupKey	number | string	undefined	Yes

📄 Return

Group

---

removeGroup()

Removes Group at the given groupKey from the Collection.

MY_COLLECTION.removeGroup('myGroup');

📭 Props

Prop	Type	Default	Required
groupKey	number | string	undefined	Yes

📄 Return

Collection

Returns the Collection it was called on.

---

createSelector()

Creates a new Selector, and automatically associates it to the Collection.

const MY_SELECTOR = MY_COLLECTION.createSelector('mySelector', 'itemKey'); 

To correctly identify the Selector later, we have to pass a unique key/name as the first parameter. Such key is, for instance, required to remove or access the Selector.

const MY_SELECTOR = MY_COLLECTION.getSelector('mySelector');

The itemKey to the Item which the Selector initially represents is passed as the second parameter.

const MY_SELECTOR = MY_COLLECTION.createSelector('currentUser', 1); 

❗️info

Often we call the selectorKey like the itemKey the Selector selects. If that is the case, we can use the select() method, which creates like the createSelector() method a Selector. But we don't have to pass a separate selctorKey, because it uses the passed itemKey as selectorKey.

const MY_SELECTOR = MY_COLLECTION.select('itemKey'); 

📭 Props

Prop	Type	Default	Description	Required
selectorKey	number | string	undefined	Key/Name of Selector	Yes
itemKey	number | string	undefined	Initial itemKey of Item the Selector represents	Yes

📄 Return

Selector

---

select()

Creates like the createSelector() method a new Selector, and automatically associates it to the Collection. However, we don't have to pass a separate selecotorKey, because it uses the passed itemKey as selectorKey

const MY_SELECTOR = MY_COLLECTION.select('itemKey'); 
MY_SELECOTR.key; // Returns 'itemKey'

📭 Props

Prop	Type	Default	Description	Required
itemKey	number | string	undefined	Initial itemKey of Item the Selector represents	Yes

📄 Return

Selector

---

hasSelector()

Checks if a Selector exists at the given selectorKey in the Collection.

MY_COLLECTION.hasSelector('selector4'); // Returns false
MY_COLLECTION.createSelector('selector8', 'itemKey');
MY_COLLECTION.hasSelector('selector8'); // Returns true

📭 Props

Prop	Type	Default	Description	Required
selectorKey	number | string	undefined	Key/Name of Selector	Yes
config	HasConfig	{}	Configuration	No

📄 Return

boolean

---

getSelector()

Returns the Selector at the given selectorKey.

const MY_SELECTOR = MY_COLLECTION.getSelector('mySelector');

If it can't find the desired Selector, it returns undefined.

❗️info

The getSelector() method is perfect for accessing a Selector in our business logic. However, it has some disadvantages when we use it to subscribe a Selector to a UI-Component using, for instance, the useAgiel() hook. The reason is that it returns undefined whenever the Selector doesn't exist. Thus, AgileTs can't keep a reference to the Selector and isn't able to rerender the subscribed UI-Component, whenever the Selector is created. To solve this problem the Collection provides a function called getSelectorWithReference() which returns a reference to the not existing Selector instead of undefined.

📭 Props

Prop	Type	Default	Description	Required
selectorKey	number | string	undefined	Key/Name of Selector	Yes
config	HasConfig	{}	Configuration	No

📄 Return

Selector | undefined

---

getSelectorWithReference()

Returns like getSelector() the Selector at the given selectorKey.

const MY_SELECTOR = MY_COLLECTION.getSelectorWithReference('mySelector');

However, it differs in one key area. It doesn't return undefined, if it couldn't find the desired Selector. Instead, it returns a placeholder Selector to hold a reference to the not existing Selector. For example, such a reference is helpful to reliably subscribe a not existing Selector to a UI-Component, for instance, with the useAgile() hook.

// Doesn't cause rerender, when Selector is created
const mySelector = useAgile(MY_COLLECTION.getSelector('mySelector'));

// Does cause rerender, when Selector is created
const mySelectorWithReference = useAgile(MY_COLLECTION.getSelectorWithReferenece('mySelector'));

📭 Props

Prop	Type	Default	Required
selectorKey	number | string	undefined	Yes

📄 Return

Selector

---

removeSelector()

Removes Selector at the given selectorKey from the Collection.

MY_COLLECTION.removeSelector('mySelector');

📭 Props

Prop	Type	Default	Required
selectorKey	number | string	undefined	Yes

📄 Return

Collection

Returns the Collection it was called on.

---

hasItem()

Checks if an Item exists at the given itemKey in the Collection.

MY_COLLECTION.hasItem(3); // Returns false
MY_COLLECTION.collect({id: 1, name: 'frank'});
MY_COLLECTION.hasItem(1); // Returns true

📭 Props

Prop	Type	Default	Description	Required
itemKey	number | string	undefined	Key/Name of Item	Yes
config	HasConfig	{}	Configuration	No

📄 Return

boolean

---

getItem()

Returns the Item at the given itemKey.

const MY_ITEM = MY_COLLECTION.getItem('myItem');

If it can't find the desired Item, it returns undefined.

❗️info

The getItem() method is perfect for accessing an Item in our business logic. However, it has some disadvantages when we use it to subscribe an Item to a UI-Component using, for instance, the useAgiel() hook. The reason is that it returns undefined whenever the Item doesn't exist. Thus, AgileTs can't keep a reference to the Item and isn't able to rerender the subscribed UI-Component, whenever the Item is created. To solve this problem the Collection provides a function called getItemWithReference() which returns a reference to the not existing Item instead of undefined.

📭 Props

Prop	Type	Default	Description	Required
itemKey	number | string	undefined	Key/Name of Item	Yes
config	HasConfig	{}	Configuration	No

📄 Return

Item | undefined

---

getItemWithReference()

Returns like getItem() the Item at the given itemKey.

const MY_ITEM = MY_COLLECTION.getItemWithReference('myItem');

However, it differs in one key area. It doesn't return undefined, if it couldn't find the desired Item. Instead, it returns a placeholder Item to hold a reference to the not existing Item. For example, such a reference is helpful to reliably subscribe a not existing Item to a UI-Component, for instance, with the useAgile() hook.

// Doesn't cause rerender, when Item is created
const myItem = useAgile(MY_COLLECTION.getItem('myItem'));

// Does cause rerender, when Item is created
const myItemWithReference = useAgile(MY_COLLECTION.getItemWithReferenece('myItem'));

📭 Props

Prop	Type	Default	Required
itemKey	number | string	undefined	Yes

📄 Return

Item

---

getAllItems()

Returns all Items of the Collection.

MY_COLLECTION.getAllItems(); // Returns something like (see below)
/*
 [
    Item(1),
    Item(10),
    Item(23)
 ]
 */

📭 Props

Prop	Type	Default	Description	Required
config	HasConfig	{}	Configuration	No

📄 Return

Array<Item>

---

getAllItemValues()

Returns all Item values of the Collection.

MY_COLLECTION.getAllItemValues(); // Returns something like (see below)
/*
 [
    {id: 1, name: "frank"},
    {id: 10, name: "hans"},
    {id: 23, name: "jeff"},
 ]
 */

📭 Props

Prop	Type	Default	Description	Required
config	HasConfig	{}	Configuration	No

📄 Return

Array<DataType> // DataType is by default '{[key: string]: any}'

---

persist()

Preserves the Collection value in the appropriate local Storage for the current environment.

MY_COLLECTION.perist("myStorageKey");

The value of the Collection includes:

• default Group
• all Items

All other Instances that refer to the Collection have to be persisted separately if desired.

MY_COOL_GROUP.persist();

🤓 Learn more

If you want to find out more about persisting Instances like Collections, checkout the Persisting Data Section.

📭 Props

Prop	Type	Default	Description	Required
key	string | number	undefined	Key/Name of created Persistent (Note: Key is required if Collection has no set Key!)	No
config	StatePersistentConfig	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

onLoad()

Registers a callback function that is called whenever the persisted Collection value is loaded into the Collection.

MY_COLLECTION.onLoad((success) => {
console.log(`Value '${MY_COLLECTION.value}' got loaded into the Collection! Success? ${success}`)
});

For example, we can use this information to display a loading indicator until the persisted value got loaded.

📭 Props

Prop	Type	Default	Required
callback	(success: boolean) => void	undefined	Yes

📄 Return

Collection

Returns the Collection it was called on.

---

getGroupCount()

Returns the number of registered Groups in a Collection.

MY_COLLECTION.createGroup('group1');
MY_COLLECTION.getGroupCount(); // Returns '2'

If you are wondering why it returns 2 even though we have only created one Group. This is due the fact that each Collection has registered a default Group.

📄 Return

number

---

getSelectorCount()

Returns the number of registered Selectors in a Collection.

MY_COLLECTION.select(1);
MY_COLLECTION.getSelectorCount(); // Returns '1'

📄 Return

number

---

reset()

Resets the Collection. A reset includes:

• removing all Items
• resetting each Group
• resetting each Selector

const MY_COLLECTION = createCollection();
MY_COLLECTION.collect({id: 1, name: 'frank'});
MY_COLLECTION.collect({id: 8, name: 'frank'});
MY_COLLECTION.data; // Returns '{1: Item(1), 8: Item(8)}'
MY_COLLECTION.reset();
MY_COLLECTION.data; // Returns '{}'

📄 Return

Collection

Returns the Collection it was called on.

---

put()

With the put() method, we can quickly add specific itemKeys to particular Group/s.

MY_COLLECTION.put('itemKey1', 'groupKey1');

In the above example, we put the itemKey1 into the Group at groupKey1, so to speak. We can also add multiple itemKeys to multiple Groups at once.

MY_COLLECTION.put(['itemKey1', 'itemKey2', 'itemKey3'], ['groupKey1', 'groupKey2']);

Now itemKey1, itemKey2, itemKey3 are added to the Groups at groupKey1 and groupKey2.

📭 Props

Prop	Type	Default	Description	Required
itemKeys	number | string	Array<number | string >	[]	ItemKey/s to be added to the specified Group/s
groupKeys	number | string	Array<number | string >	[]	Group/s to which the specified ItemKey/s are added
config	GroupAddConfigInterface	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

move()

Moves itemKey/s from one Group to another Group.

MY_COLLECTION.move('itemKey1', /* from */ 'groupKey1', /* to */ 'groupKey2');

In the above example, we move the itemKey1 from Group at groupKey1 to Group at groupKey2, so to speak.

📭 Props

Prop	Type	Default	Description	Required
itemKeys	number | string	Array<number | string >	[]	ItemKey/s that are moved
oldGroupKey	number | string	undefined	GroupKey of the Group that currently keeps the Item/s at itemKey/s	Yes
newGroupKey	number | string	undefined	GroupKey of the Group into which the Item/s at itemKey/s are moved	Yes
config	GroupAddConfigInterface	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

updateItemKey()

🔥warning

This method is mainly thought for the internal use.

Mutates the itemKey of an already collected Item. It takes care of:

• updating itemKey in Collection (replacing old itemKey with the new one)
• updating itemKey in Groups (replacing old itemKey with the new one)
• updating itemKey in Selector (unselecting old itemKey and selecting the new one)

📭 Props

Prop	Type	Default	Description	Required
oldItemKey	number | string	undefined	Old ItemKey	Yes
newItemKey	number | string	undefined	New ItemKey	Yes
config	UpdateItemKeyConfigInterface	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.

---

getGroupKeysThatHaveItemKey()

Returns all groupKeys that include the given itemKey.

MY_COLLECTION.getGroupKeysThatHaveItemKey('itemKey1'); // Returns '[]'
MY_COLLECTION.createGroup('group1', ['itemKey1', 'itemKey2']);
MY_COLLECTION.getGroupKeysThatHaveItemKey('itemKey1'); // Returns '['group1']'

📭 Props

Prop	Type	Default	Required
itemKey	number | string	undefined	Yes

📄 Return

Array<number | string>

---

remove()

Removes Items from:

• .everywhere()

  Removes Item/s at given itemKey/s from the entire Collection and all Groups / Selectors, i.e. from everywhere.

  MY_COLLECTION.remove('item1').everywhere();

  Synonym to removeItems().

• .fromGroups()

  Removes Item/s at given itemKey/s only from specific Groups at given groupKey/s.

  MY_COLLECTION.remove('item1').fromGroups(['group1', 'group2']);

  Synonym to removeFromGroups().

❗️info

Note that the standalone remove() method doesn't do anything.

MY_COLLECTION.remove('itemKey1'); // won't work
MY_COLLECTION.remove('itemKey1').everywhere(); // Removes from the entire Collection
MY_COLLECTION.remove('itemKey1').fromGroups('groupKey1'); // Removes from Group at 'groupKey1'

So we must always add the ending .everywhere() or .fromGroups().

📭 Props

Prop	Type	Default	Required
itemKeys	number | string	Array<number | string>	undefined

📄 Return

{
    fromGroups: (groups: Array<ItemKey> | ItemKey) => Collection<DataType>;
    everywhere: () => Collection<DataType>;
}

---

removeFromGroups()

Removes Item at the given itemKey from specific Group at the given groupKey.

MY_COLLECTION.removeFromGroups('item1', 'group1');

It is also possible to remove multiple Items from multiple Groups at once.

MY_COLLECTION.removeFromGroups(['item1', 'item2'], ['group1', 'group5']);

In the above example, the Collection removes the Items at item1 and item2 from the Groups at group1 and group5.

📭 Props

Prop	Type	Default	Required
itemKeys	number | string	Array<number | string>	undefined
groupKeys	number | string	Array<number | string>	undefined

📄 Return

Collection

Returns the Collection it was called on.

---

removeItems()

Removes Item at the givenitemKey from the entire Collection and all Groups / Selectors

MY_COLLECTION.removeItems('item1');

It is also possible to remove multiple Items at once.

MY_COLLECTION.removeItems(['item1', 'item2']);

⚠️ Remove includes?

• remove Item/s from the entire Collection
• remove Item/s from all Groups
• remove Item/s from all Selectors
• remove Item value/s from Storage

📭 Props

Prop	Type	Default	Description	Required
itemKeys	number | string	Array<number | string>	undefined	itemKey/s of Item/s that get removed

📄 Return

Collection

Returns the Collection it was called on.

---

setData()

🔥warning

No public function! (only public for testing purpose)
In summary, setData() applies newly added data (for instance from the collect() method) to the Collection.

---

rebuildGroupsThatIncludeItemKey()

🔥warning

This method is mainly thought for the internal use.

Rebuilds all Groups that include the provided itemKey.

MY_COLLECTION.rebuildGroupsThatIncludeItemKey('item1');

Such rebuild does among other things recompute the output of the Group.

// group value '[1, 2, 3]'
// group output '[{id: 1, name: 'jeff'}, {id: 3, name: 'hans'}]'

// Item gets added to Collection -> Collection rebuilds all Groups that include the 'itemKey'
MY_COLLECTION.collect({id: 2, name: 'jeff'});
// Exectues internally: 'MY_COLLECTION.rebuildGroupsThatIncludeItemKey(2)'

// group output '[{id: 1, name: 'jeff'}, {id: 2, name: 'jeff'}, {id: 3, name: 'hans'}]'

📭 Props

Prop	Type	Default	Description	Required
itemKey	number | string	undefined	itemKey	Yes
config	RebuildGroupsThatIncludeItemKeyConfigInterface	{}	Configuration	No

📄 Return

Collection

Returns the Collection it was called on.