Skip to content

Commit 9b76462

Browse files
Rankush KumarShreyas281299
authored andcommitted
docs(store): add AI documentation - AGENTS.md and ARCHITECTURE.md
1 parent b1faaed commit 9b76462

File tree

2 files changed

+435
-0
lines changed

2 files changed

+435
-0
lines changed
Lines changed: 205 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,205 @@
1+
# Contact Center Store (`@webex/cc-store`)
2+
3+
## Overview
4+
5+
`@webex/cc-store` is the shared, singleton MobX store for all Contact Center widgets. It holds global agent,session and task state, proxies SDK events, and exposes convenience APIs for fetching lists (queues, entry points, address book), task lifecycle handling, and common mutations.
6+
7+
**Package:** `@webex/cc-store`
8+
**Version:** See package.json
9+
10+
---
11+
12+
## Why and What is This Used For?
13+
14+
### Purpose
15+
16+
The store enables Contact Center widgets to:
17+
- **Initialize and register** with the Webex Contact Center SDK
18+
- **Observe global state** (teams, device type, login options, agent state, tasks and many more)
19+
- **Handle SDK events** (login, logout, multi-login, task lifecycle, agent state changes)
20+
- **Fetch domain data** (buddy agents, queues, entry points, address book)
21+
- **Centralize callbacks and error handling** for consistent behavior across widgets
22+
23+
### Key Capabilities
24+
25+
- **Singleton** state via MobX observables
26+
- **Event wiring** to SDK (TASK_EVENTS and CC_EVENTS)
27+
- **Task list management** and current task tracking
28+
- **Helpers** for buddy agents, queues, entry points, address book
29+
- **Error propagation** via `setOnError`
30+
- **Feature flags** parsing from SDK profile
31+
32+
---
33+
34+
## Examples and Usage
35+
36+
### Basic Initialization
37+
38+
```typescript
39+
import store from '@webex/cc-store';
40+
41+
// Option A: If you already have a Webex instance, best for existing webex enabled apps
42+
await store.init({
43+
webex: someWebexInstance, // must include cc
44+
});
45+
46+
// Option B: Let the store initialize Webex for you, best for new apps
47+
await store.init({
48+
webexConfig: {/* sdk config */},
49+
access_token: authToken,
50+
});
51+
```
52+
53+
### Registration (when Webex is ready)
54+
55+
```typescript
56+
// If you need explicit (re-)registration using an existing webex
57+
await store.registerCC(someWebexInstance);
58+
```
59+
60+
### Observing State in React
61+
62+
```typescript
63+
import {observer} from 'mobx-react-lite';
64+
import store from '@webex/cc-store';
65+
66+
const Header = observer(() => {
67+
return (
68+
<div>
69+
<div>Agent ID: {store.agentId}</div>
70+
<div>Logged In: {store.isAgentLoggedIn ? 'Yes' : 'No'}</div>
71+
<div>Device: {store.deviceType}</div>
72+
<div>Team: {store.teamId}</div>
73+
</div>
74+
);
75+
});
76+
```
77+
78+
### Setting Up Error Callback
79+
80+
```typescript
81+
import store from '@webex/cc-store';
82+
83+
store.setOnError((componentName, error) => {
84+
console.error(`Error from ${componentName}`, error);
85+
// forward to telemetry
86+
});
87+
```
88+
89+
### Subscribing/Unsubscribing to SDK Events on contact center object
90+
91+
```typescript
92+
import store, {CC_EVENTS, TASK_EVENTS} from '@webex/cc-store';
93+
94+
const onLogin = (payload) => console.log('Login success:', payload);
95+
store.setCCCallback(CC_EVENTS.AGENT_STATION_LOGIN_SUCCESS, onLogin);
96+
97+
// Later
98+
store.removeCCCallback(CC_EVENTS.AGENT_STATION_LOGIN_SUCCESS);
99+
```
100+
101+
### Subscribing/Unsubscribing to Task Events on task object
102+
103+
```typescript
104+
import store, {TASK_EVENTS} from '@webex/cc-store';
105+
106+
// Choose a task (e.g., current task)
107+
const taskId = store.currentTask?.data?.interactionId;
108+
if (taskId) {
109+
const handleMedia = (track) => {
110+
// e.g., use track for call control audio
111+
console.log('Media track received', track?.kind);
112+
};
113+
114+
// Subscribe to a task event
115+
store.setTaskCallback(TASK_EVENTS.TASK_MEDIA, handleMedia, taskId);
116+
117+
// Later, unsubscribe
118+
store.removeTaskCallback(TASK_EVENTS.TASK_MEDIA, handleMedia, taskId);
119+
}
120+
```
121+
122+
### Fetching Lists
123+
124+
```typescript
125+
// Buddy agents for current task media type
126+
const buddies = await store.getBuddyAgents();
127+
128+
// Queues for a channel
129+
const {data: queues} = await store.getQueues('TELEPHONY', {page: 0, pageSize: 25});
130+
131+
// Entry points
132+
const entryPoints = await store.getEntryPoints({page: 0, pageSize: 50});
133+
134+
// Address book (no-op if disabled)
135+
const addressBook = await store.getAddressBookEntries({page: 0, pageSize: 50});
136+
```
137+
138+
### Mutating Common State
139+
140+
```typescript
141+
store.setDeviceType('BROWSER');
142+
store.setDialNumber('12345');
143+
store.setTeamId('teamId123');
144+
store.setState({id: 'Available', name: 'Available', isSystem: true, isDefault: true});
145+
```
146+
147+
---
148+
149+
## Key API (Selected)
150+
151+
Properties (observable via MobX):
152+
- `teams`, `loginOptions`, `idleCodes`, `wrapupCodes`, `featureFlags`
153+
- `agentId`, `agentProfile`, `isAgentLoggedIn`, `deviceType`, `dialNumber`, `teamId`
154+
- `currentTask`, `taskList`, `currentState`, `lastStateChangeTimestamp`, `lastIdleCodeChangeTimestamp`
155+
- `showMultipleLoginAlert`, `currentTheme`, `customState`, `isMuted`, `isAddressBookEnabled`
156+
157+
Methods:
158+
- `init(params)`, `registerCC(webex?)`
159+
- `setOnError(cb)`, `setCCCallback(event, cb)`, `removeCCCallback(event)`
160+
- `refreshTaskList()`, `setCurrentTask(task, isClicked?)`
161+
- `setDeviceType(option)`, `setDialNumber(value)`, `setTeamId(id)`
162+
- `setCurrentState(stateId)`, `setState(state | {reset:true})`
163+
- `getBuddyAgents(mediaType?)`, `getQueues(mediaType?, params?)`
164+
- `getEntryPoints(params?)`, `getAddressBookEntries(params?)`
165+
166+
For full types, see src/store.types.ts.
167+
168+
---
169+
170+
## Dependencies
171+
172+
See exact versions in package.json
173+
174+
### Runtime
175+
176+
| Package | Purpose |
177+
|---------|---------|
178+
| `@webex/contact-center` | SDK integration (methods/events) |
179+
| `mobx` | Observable state management |
180+
181+
### Dev/Test
182+
183+
TypeScript, Jest, ESLint, Webpack (see [package.json](../package.json)).
184+
185+
---
186+
187+
## Installation
188+
189+
```bash
190+
yarn add @webex/cc-store
191+
```
192+
193+
---
194+
195+
## Additional Resources
196+
197+
For detailed store architecture, event flows, and sequence diagrams, see [architecture.md](./architecture.md).
198+
199+
---
200+
201+
_Last Updated: 2025-11-26_
202+
203+
204+
205+

0 commit comments

Comments
 (0)