Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show 'No Elections Found' when filter is empty #62

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

akathedeveloper
Copy link

Description:

This PR enhances the ElectionDash component by adding a message that is displayed when there are no elections matching the selected filter (Pending, Active, or Ended). The message is centered and styled to be easily noticeable, improving the user experience by providing clear feedback when no elections are available for the chosen filter.

Changes Made:

  • Added a renderMessage function to display a message when the filtered list is empty.
  • Centered the message horizontally and aligned it near the top of the election list area.
  • Applied bold and larger font styling to the message to ensure visibility.
  • Messages include:
  1. "No pending elections found"
  2. "No active elections found"
  3. "No ended elections found"

Screenshots :

Before:

image

After:

image

Testing:

  • Verified that the message appears when there are no elections matching the selected filter.
  • Tested on different screen sizes to ensure the message is responsive and properly aligned.

Related Issue:

Issue #61

@Ronnieraj37
Copy link
Contributor

Hey @akathedeveloper your commits are creating a conflict please fix them.

Additional Changes:

  1. Please don't use those many if else statements. The file already contains an object
    const counts = { total: 0, pending: 0, active: 0, ended: 0 };
    you can use this to get
    const statusNames = Object.keys(counts); // ['total', 'pending', 'active', 'ended']
    which can be later used to show the name No {name} Elections found.
  2. You do not have to again check for empty elections (count.active ==0, etc..) as you're already doing that when calling the renderMessage function checking the filteredElections variable check of 0.

@akathedeveloper
Copy link
Author

Sure sir I will make sure to incorporate the changes suggest by you

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.

2 participants