Skip to content

Staging#159

Merged
Riyad-Murad merged 3 commits intomainfrom
staging
May 19, 2025
Merged

Staging#159
Riyad-Murad merged 3 commits intomainfrom
staging

Conversation

@Riyad-Murad
Copy link
Owner

@Riyad-Murad Riyad-Murad commented May 19, 2025

Summary by Sourcery

Revamp UI styling and data-fetch logic for provider and client energy reporting pages by integrating the ActionButton component, refactoring components to use service hooks, updating AI prompt formats, and refreshing project documentation

New Features:

  • Introduce report generation and download flows in ProviderPowerPrediction and ClientPowerPlan using service hooks and ActionButton
  • Implement fetchProviderPredictionReport hook in ProviderPredictionService to manage loading state and data fetching

Documentation:

  • Refresh README.md with updated ERD, component and flow diagrams, concise feature descriptions, and relocated default test credentials

@sourcery-ai
Copy link

sourcery-ai bot commented May 19, 2025

Reviewer's Guide

This PR standardizes and enhances the UI for both Provider and Client forecasting pages through a comprehensive CSS refactor and component restructuring, introduces a unified ActionButton component with class-based styling, refactors service layers into hooks managing loading state via Redux, updates AI prompt utilities to produce strict JSON reports, and cleans up outdated documentation in the README.

Sequence Diagram: Provider Power Forecast Generation

sequenceDiagram
    actor User as Provider
    participant Page as ProviderPowerPrediction Page
    participant ServiceHook as ProviderPredictionService Hook
    participant ReduxStore as Redux Store
    participant Axios as axiosInstance
    participant BackendAPI as Backend API

    User->>Page: Clicks "Generate Forecast" button
    Page->>ServiceHook: Calls fetchProviderPredictionReport(userId, setReportData)
    ServiceHook->>ReduxStore: dispatch(toggleLoad(true))
    ServiceHook->>Axios: GET /providers/providerReport/{userId}
    Axios->>BackendAPI: Request provider report
    BackendAPI-->>Axios: Return report data / error
    Axios-->>ServiceHook: Receive response
    alt Successful fetch
        ServiceHook->>Page: setReportData(data) (updates Page's reportData state)
    else Error fetching
        ServiceHook->>Page: setReportData(null) (updates Page's reportData state)
        ServiceHook->>Page: Logs error (console.error)
    end
    ServiceHook->>ReduxStore: dispatch(toggleLoad(false))
Loading

File-Level Changes

Change Details Files
Comprehensive CSS refactor for Provider and Client pages
  • Renamed container, header, title, card, spinner and action button classes
  • Replaced old generate/report sections with unified card and grid layouts
  • Added padding, shadows, border‐radius, and color theme updates
  • Streamlined keyframes and overlay styles
amp-client/src/Pages/ProviderPages/ProviderPowerPrediction/styles.css
amp-client/src/Pages/ClientPages/ClientPowerPlan/styles.css
ProviderPowerPrediction component overhaul
  • Removed direct dispatch hooks and inline loading logic
  • Swapped raw buttons for ActionButton component
  • Renamed state, integrated fetchProviderPredictionReport with userId
  • Reorganized JSX into header, generate card, loading overlay, report card sections
amp-client/src/Pages/ProviderPages/ProviderPowerPrediction/ProviderPowerPrediction.jsx
ClientPowerPlan component restructure
  • Integrated ActionButton instead of raw buttons
  • Updated container and header markup
  • Hooked fetchPowerPlanReport with userId and setReportData
  • Reorganized JSX into generate card, loading overlay, download and report sections
amp-client/src/Pages/ClientPages/ClientPowerPlan/ClientPowerPlan.jsx
Enhanced ActionButton component
  • Added optional className prop to switch between CSS and inline styles
  • Adjusted style object generation based on presence of className
  • Preserved backward compatibility for width, margin and color props
amp-client/src/Components/CommonComponents/ActionButton/ActionButton.jsx
Refactor ProviderPowerPredictionService into hook
  • Converted service object to functional hook returning fetchProviderPredictionReport
  • Integrated Redux toggleLoad dispatch before/after API call
  • Parameterized endpoint by userId and setReportData state
amp-client/src/Pages/ProviderPages/Services/ProviderPowerPredictionService/ProviderPowerPredictionService.js
Revamped AI prompt templates for JSON output
  • Redefined ClientPrompt and ProviderPrompt instructions for strict JSON schema
  • Replaced bullet‐list style guidance with section‐element mapping
  • Specified exact JSON structure with keys summary, insights and recommendations
amp-laravel/app/Utils/ClientPrompt.php
amp-laravel/app/Utils/ProviderPrompt.php
README cleanup and asset updates
  • Removed outdated user data and detailed database schema description
  • Updated ERD, component and flow diagram paths
  • Reintroduced test credentials at bottom and streamlined feature bullets
README.md

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@Riyad-Murad Riyad-Murad merged commit 7c1dcc6 into main May 19, 2025
1 of 6 checks passed
Copy link

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

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

Hey @Riyad-Murad - I've reviewed your changes - here's some feedback:

  • Using a static margin-left (300px) to center the container can break responsiveness on smaller viewports—consider a flex- or grid-based centering approach instead.
  • The client and provider CSS files share almost identical card and section styles—extract those into reusable common classes to reduce duplication.
  • The download buttons are wired to console.log; you’ll want to replace those placeholders with actual download logic or integrate with your file download service.
Here's what I looked at during the review
  • 🟡 General issues: 4 issues found
  • 🟢 Testing: all looks good
  • 🟢 Documentation: all looks good

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

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.

margin,
className = "",
}) => {
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.

dispatch(toggleLoad(false));
}
};
const { fetchProviderPredictionReport } = ProviderPredictionService();
Copy link

Choose a reason for hiding this comment

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

suggestion: ProviderPredictionService is called as a function, which may cause confusion if it is not a hook.

If this service uses hooks (e.g., useDispatch), rename it with a 'use' prefix. Otherwise, avoid calling it like a hook to prevent unexpected behavior.

Suggested implementation:

import useProviderPredictionService from 'services/ProviderPredictionService';
  const { fetchProviderPredictionReport } = useProviderPredictionService();
  1. In amp-client/src/services/ProviderPredictionService.js (or .ts), rename the exported function:

    <<<<<<< SEARCH
    export default function ProviderPredictionService() {

    }

    export default function useProviderPredictionService() {

    }

    REPLACE

  2. Update any internal references or tests that import ProviderPredictionService to the new hook name.


- 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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant