The @espressif/rainmaker-base-cdf package is a reactive state management library for Rainmaker applications, built on MobX, offering seamless state synchronization through predefined stores (GroupStore, NodeStore, UserStore, SubscriptionStore). It automatically updates with backend API calls via @espressif/rainmaker-base-sdk, ensuring efficient data flow and real-time reactivity
The @espressif/rainmaker-base-cdf package is a reactive state management library designed for Rainmaker applications. Built with MobX at its core, it provides a seamless and efficient way to manage and synchronize application state through its predefined stores: GroupStore, NodeStore, UserStore, and SubscriptionStore. These stores automatically update when backend APIs are called through the @espressif/rainmaker-base-sdk package, ensuring robust data handling and communication. This simplifies data flow and keeps your application effortlessly reactive and up-to-date.
GroupStore, NodeStore, UserStore, and SubscriptionStore) using MobX, ensuring seamless state synchronization and updates.@espressif/rainmaker-base-sdk: Automatically manages API calls through the @espressif/rainmaker-base-sdk package, reducing the need for repetitive backend setup.@espressif/rainmaker-base-sdk package with minimal configuration, requiring only SDK and CDF setup.Before installing the @espressif/rainmaker-base-cdf package, ensure you meet the following prerequisites:
To use the @espressif/rainmaker-base-cdf package in your project, follow the steps below:
Install @espressif/rainmaker-base-cdf using the following command:
npm install @espressif/rainmaker-base-cdf
yarn add @espressif/rainmaker-base-cdf
pnpm add @espressif/rainmaker-base-cdf
After installation, you can import and initialize the package in your project to start using the reactive stores.
Below are examples to help you get started with the @espressif/rainmaker-base-cdf package in your application:
Initialize the @espressif/rainmaker-base-cdf package by providing the required configuration. This automatically sets up the necessary reactive stores.
import { initCDF } from "@espressif/rainmaker-base-cdf";
const initApp = async () => {
const sdkConfiguration = {
baseUrl: "https://api.rainmaker.espressif.com",
version: "v1",
};
try {
const espCDF = await initCDF(sdkConfiguration, { autoSync: true });
console.log("Rainmaker Base CDF initialized:", espCDF);
} catch (error) {
console.error("Initialization error:", error);
}
};
initApp();`
Use the UserStore for logging in and managing user-related data.
const handleConnect = async () => {
try {
await espCDF.userStore.login(username, password);
console.log("User logged in successfully");
} catch (error) {
console.error("Login error:", error);
}
};
if (espCDF.userStore.userInfo) {
console.log("User Info:", espCDF.userStore.userInfo);
}
Use the NodeStore to interact with node data.
const nodes = espCDF.nodeStore.nodeList;
console.log("Nodes:", nodes);
useEffect(() => {
console.groupCollapsed("Node list updated");
console.log(espCDF.nodeStore.nodeList);
console.groupEnd();
}, [espCDF.nodeStore.nodeList]);
Use the GroupStore to manage group data.
const groups = espCDF.groupStore.groupList;
console.log("Groups:", groups);
useEffect(() => {
console.groupCollapsed("Group list updated");
console.log(espCDF.groupStore.groupList);
console.groupEnd();
}, [espCDF.groupStore.groupList]);
Use the SceneStore to manage scene data and operations.
// Sync scenes from specific nodes
await espCDF.sceneStore.syncScenesFromNodes(['node1', 'node2']);
const scenes = espCDF.sceneStore.sceneList;
console.log("Scenes:", scenes);
// Create a new scene
const newScene = await espCDF.sceneStore.createScene({
name: "Living Room Scene",
nodes: ["node1", "node2"],
actions: {
node1: { light: { power: true, brightness: 80 } },
node2: { fan: { power: false } },
},
});
// Activate a scene
await espCDF.sceneStore.activateScene("scene123");
// Remove a scene
const scene = espCDF.sceneStore.getScene("scene123");
if (scene) await scene.remove();
useEffect(() => {
console.groupCollapsed("Scene list updated");
console.log(espCDF.sceneStore.sceneList);
console.groupEnd();
}, [espCDF.sceneStore.sceneList]);
Use the ScheduleStore to manage time-based device operations.
// Create a schedule
const schedule = await espCDF.scheduleStore.createSchedule({
name: "Morning Routine",
nodes: ["bedroom_light"],
action: {
bedroom_light: { light: { power: true } }
},
triggers: [{ m: 420, d: 127 }] // 7:00 AM daily
});
// Manage schedules
const schedules = espCDF.scheduleStore.scheduleList;
await espCDF.scheduleStore.enableSchedule("schedule123");
await espCDF.scheduleStore.disableSchedule("schedule123");
// Handle updates
useEffect(() => {
console.log("Schedules updated:", espCDF.scheduleStore.scheduleList);
}, [espCDF.scheduleStore.scheduleList]);
Use the AutomationStore to manage context-aware automations.
// Access automations by type
const allAutomations = espCDF.automationStore.automationList;
const weatherAutomations = espCDF.automationStore.weatherAutomationList;
const daylightAutomations = espCDF.automationStore.daylightAutomationList;
// Manage automations
const nodeAutomations = espCDF.automationStore.getAutomationsByNodeId("node123");
const locationAutomations = espCDF.automationStore.getWeatherAutomationsByLocation({
latitude: 37.7749,
longitude: -122.4194
});
// Update automation
const automation = espCDF.automationStore.getAutomationById("automation123");
if (automation) {
await automation.updateName("New Name");
await automation.enable(true);
}
This project is licensed under the Apache 2.0 license - see the LICENSE file for details.