Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
98 changes: 34 additions & 64 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,27 +9,6 @@
>
> The website will display the data that the arduino will send to the database and the users will be able to generate AI reports for their needs.

#### To test the website, here are some initial default data stored in the database:

#### Admin Users:
> <u><b>Email:</b></u> riyad@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> nabiha@gmail.com, <u><b>Password:</b></u> password

#### Provider Users:
> <u><b>Email:</b></u> cdaoud@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> nour@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> taha@gmail.com, <u><b>Password:</b></u> password

#### Client Users:
> <u><b>Email:</b></u> gheeda@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> joe@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> sara@gmail.com, <u><b>Password:</b></u> password

<br>

<!-- System Design -->
Expand All @@ -38,63 +17,33 @@
### ER Diagram

<center>
<img src="./readme/demo/Amp_Intelligence.png"/>
<img src="./readme/demo/ERD.png"/>
</center>

<br />

## System Design - Database Schema Overview
The Amp Intelligence platform utilizes a relational database schema designed to support a scalable, secure, and modular architecture for intelligent energy monitoring and user management. The schema is optimized for clarity in data ownership, role-based access, and historical data collection, ensuring robust data integrity and efficient query performance.

### Core Entities & Relationships
### 1) Users

- Centralized user management is facilitated through the Users table, which supports multiple user roles: Clients, Providers, and Admins. This enables clear segregation of access rights and responsibilities.

- The schema supports optional direct mapping between Users and Slaves, ensuring traceability of device ownership per client.

- The design ensures flexibility to support role-based data visualization and management in both the platform’s dashboard and APIs.

### 2) Masters & Slaves

- The Masters table represents the core energy monitoring controllers, typically installed and managed by provider entities (linked via user_id).

- Each Master can manage multiple Slaves, which represent individual monitored assets or devices. The Slaves are associated back to the Masters and can also link directly to Users (clients) via the slave_id field in the Users table, ensuring traceability of monitored assets.

### 3) Metrics & Lines

- The Metrics table serves as the historical data ledger, storing essential telemetry such as voltage, current, power, and energy per Slave and Master device, organized on a monthly basis for performance optimization.

- The Lines table provides additional granularity by storing per-phase measurements (L1, L2, L3) and is directly linked to the Masters. This supports detailed line-level diagnostics, crucial for industrial-grade energy analytics.
### Component Diagram

### 4) Contact Forms

- User-generated communication is handled by the Contact_Forms table, ensuring that feedback, support requests, and queries are traceable to specific users.

- This supports seamless user support workflows and ensures accountability.

### 5) Design Principles
- Scalability & Modularity: The schema supports multi-tenant architecture, where Providers can manage multiple Masters and Clients can own specific Slaves. This allows the platform to scale horizontally by simply extending these relationships.

- Data Integrity & Traceability: All critical records are timestamped (created_at, updated_at), supporting full audit trails. Foreign key relationships ensure data consistency across all levels.
<center>
<img src="./readme/demo/Component Diagram 2.0.png"/>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nitpick: Consider standardizing diagram image filename.

The '2.0' suffix isn’t needed unless you’re tracking versions for display. Rename to Component Diagram.png to match other filenames like ERD.png and Flow Diagram.png.

</center>

- Performance Considerations: Metrics are decoupled into Metrics and Lines, optimizing for both high-frequency telemetry capture and in-depth line-level analysis without query performance degradation.
### Flow Diagram

### Summary
This ERD lays the foundation for Amp Intelligence’s core platform services by enabling structured, efficient, and secure energy data management while providing flexibility for future expansion, including integrations with third-party platforms, advanced reporting engines, and AI-driven anomaly detection systems.
<center>
<img src="./readme/demo/Flow Diagram.png"/>
</center>

<br>
<br><br>

<!-- Project Highlights -->
<img src="./readme/title4.svg"/>

### The Most Remarkable Features

- <b>Seamless IoT Data Ingestion:</b> The system integrates with ESP32 microcontrollers to capture real-time energy consumption data from client devices. This data is securely transmitted and stored in the platform's centralized database, ensuring accurate and continuous monitoring of power usage.
- <b>Seamless IoT Data Ingestion:</b> The system captures and securely stores real-time energy consumption data from client devices using ESP32 microcontrollers.

- <b>AI-Powered Consumption Forecasting for Providers:</b> Leveraging advanced AI models, the platform provides energy providers with predictive analytics based on historical consumption patterns. These insights enable providers to anticipate client power demand, enhance load management, and optimize resource allocation.
- <b>AI-Powered Consumption Forecasting:</b> Advanced AI models analyze historical patterns to help energy providers anticipate demand and optimize resource allocation.

- <b>Personalized AI Optimization Plans for Clients:</b> The system offers clients intelligent, data-driven power usage plans. By analyzing past consumption behaviors, the AI recommends actionable strategies to optimize energy usage, reduce costs, and promote sustainable consumption habits.
- <b>Personalized AI Optimization Plans:</b> Clients receive intelligent, data-driven strategies to optimize energy usage, reduce costs, and promote sustainability based on their consumption behaviors.

<br><br>

Expand Down Expand Up @@ -143,3 +92,24 @@ This ERD lays the foundation for Amp Intelligence’s core platform services by
| ![Landing](./readme/demo/1440x1024.png) | ![fsdaf](./readme/demo/1440x1024.png) | ![fsdaf](./readme/demo/1440x1024.png) |

<br><br>

#### To test the website, here are some initial default data stored in the database:

#### Admin Users:
> <u><b>Email:</b></u> riyad@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> nabiha@gmail.com, <u><b>Password:</b></u> password

#### Provider Users:
> <u><b>Email:</b></u> cdaoud@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> nour@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> taha@gmail.com, <u><b>Password:</b></u> password

#### Client Users:
> <u><b>Email:</b></u> gheeda@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> joe@gmail.com, <u><b>Password:</b></u> password

> <u><b>Email:</b></u> sara@gmail.com, <u><b>Password:</b></u> password
Original file line number Diff line number Diff line change
@@ -1,20 +1,36 @@
import "./styles.css";

const ActionButton = ({ backgroundColor, color, text, width, onClick, margin }) => {
const buttonStyle = {
backgroundColor: backgroundColor || "#000000",
color: color || "#FFFFFF",
borderRadius: "6px",
padding: "10px 20px",
fontWeight: 500,
fontSize: "20px",
border: "none",
cursor: "pointer",
width: width || "auto",
margin: margin || "0px",
};
const ActionButton = ({
backgroundColor,
color,
text,
width,
onClick,
margin,
className = "",
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (bug_risk): Defaulting className to an empty string may cause confusion.

Default className to undefined and only append it when truthy to avoid empty class attributes and expose missing class names.

}) => {
const useInlineStyles = !className;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: The logic for useInlineStyles may not work as intended if className is an empty string.

With className defaulting to '', !className is always true, so inline styles always apply. Check for a non-empty string instead.


return <button style={buttonStyle} onClick={onClick}>{text}</button>;
const buttonStyle = useInlineStyles
? {
backgroundColor: backgroundColor || "#000000",
color: color || "#FFFFFF",
borderRadius: "6px",
padding: "10px 20px",
fontWeight: 500,
fontSize: "20px",
border: "none",
cursor: "pointer",
width: width || "auto",
margin: margin || "0px",
}
: { width, margin };

return (
<button className={`${className}`} style={buttonStyle} onClick={onClick}>
{text}
</button>
);
};

export default ActionButton;
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import "./styles.css";
import { useState } from "react";
import { useSelector } from "react-redux";
import ActionButton from "../../../Components/CommonComponents/ActionButton/ActionButton";
import ClientPowerPlanService from "../Services/ClientPowerPlanService/ClientPowerPlanService";

const ClientPowerPlan = () => {
Expand All @@ -11,60 +12,80 @@ const ClientPowerPlan = () => {
const { fetchPowerPlanReport } = ClientPowerPlanService();

return (
<div className="client-power-plan-container">
<h2>Power Plan</h2>
<div className="client-container">
<header className="client-header">
<h1 className="client-title">Monthly Energy Report</h1>
<p className="client-subtitle">
Personalized power optimization plan for your devices
</p>
</header>

{reportData && !loading && (
<div className="client-download-top">
<ActionButton
text="Download Report"
className="client-download-action-button"
color="#FFFFFF"
onClick={() => console.log("Download triggered")}
width="250px"
margin="20px auto"
/>
</div>
)}

{!reportData && !loading && (
<div className="generate-report-section">
<p>Click On the Button to generate the power plan for this month</p>
<button
<div className="client-generate-card">
<p>
Click below to analyze your past 10 months of usage and receive a
detailed power plan.
</p>
<ActionButton
text="Generate My Plan"
className="client-generate-action-button"
color="#FFFFFF"
onClick={() => fetchPowerPlanReport(userId, setReportData)}
className="generate-button"
>
Generate Power Plan
</button>
width="250px"
margin="20px auto 0"
/>
</div>
)}

{loading ? (
<div className="spinner-container">
<div className="spinner"></div>
<div className="client-loading-overlay">
<div className="client-spinner" />
<p>Generating your plan...</p>
</div>
) : (
reportData && (
<div className="report-display">
<h3>Report Summary</h3>
<p>{reportData.summary}</p>
<div className="client-report-card">
<section className="client-summary-section">
<h3>Summary</h3>
<p>{reportData.summary}</p>
</section>

<div className="insight-section">
<h4>Voltage Insights</h4>
<p>{reportData.voltageInsights}</p>
</div>
<section className="client-insight-grid">
<div className="client-insight-box">
<h4>Voltage Insights</h4>
<p>{reportData.voltageInsights}</p>
</div>
<div className="client-insight-box">
<h4>Power Insights</h4>
<p>{reportData.powerInsights}</p>
</div>
<div className="client-insight-box">
<h4>Energy Insights</h4>
<p>{reportData.energyInsights}</p>
</div>
</section>

<div className="insight-section">
<h4>Power Insights</h4>
<p>{reportData.powerInsights}</p>
</div>

<div className="insight-section">
<h4>Energy Insights</h4>
<p>{reportData.energyInsights}</p>
</div>

<div className="recommendations-section">
<section className="client-recommendation-section">
<h4>Recommendations</h4>
<ul>
{reportData.recommendations
.split("\n")
.map((recommendation, index) => (
<li key={index}>{recommendation}</li>
))}
{reportData.recommendations.split("\n").map((rec, index) => (
<li key={index}>{rec}</li>
))}
</ul>
</div>

<div className="centering-button">
<button className="download-button">Download Plan Report</button>
</div>
</section>
</div>
)
)}
Expand Down
Loading
Loading