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

Implement status filter on the org homepage #1432

Closed
wants to merge 4 commits into from
Closed

Implement status filter on the org homepage #1432

wants to merge 4 commits into from

Conversation

MahtabBukhari
Copy link
Contributor

@MahtabBukhari MahtabBukhari commented Jan 21, 2024

Problem: Create a status filter on the org homepage for Open, Assigned, Completed, and Paid bounties, ensuring correct API calls when user clicks on status and default display of all statuses, zero skills, and newest bounties first.

Issue ticket number and link

New Updated Evidance:

Changes

OrgHeader.tsx

  • Utilized Elastic UI components (EuiCheckboxGroup and EuiPopover) for the status filter to enhance accessibility and user interaction.
  • Improved styling and dynamic rendering of status options.
  • Incorporated EuiText for consistent text styling in the OrgHeader component.
  • Removed unnecessary styledProps interface and adjusted the code accordingly.

OrgTickets.tsx

  • Introduced a defaultOrgBountyStatus for better management of default status values.
  • Updated the initial state of the status filter to include 'Completed' and adjusted code accordingly.
  • Added a new state languageString to manage the selected language string.
  • Made necessary adjustments in the OrgHeader component, including passing the onChangeStatus function, checkboxIdToSelectedMap, and languageString.

WidgetSwitchViewer.tsx

  • Introduced a conditional check for org_uuid to filter results based on the organization UUID.

OrgHeader.spec.tsx:

Test: API Call Trigger on Status Filter Click

  • Rendered the OrgHeader component with mock props.
  • Clicked on the status filter.
  • Used waitFor to ensure the API call (mainStore.getSpecificOrganizationBounties) is triggered.
  • Verified that the API call includes the expected parameters such as page, resetPage, checkboxIdToSelectedMap, languageString, and org_uuid.

@ecurrencyhodler
Copy link
Contributor

ecurrencyhodler commented Jan 21, 2024

Hey thanks for submitting the PR and video. I'm a bit confused by what I'm seeing.

At the 0:09 mark what action are you taking so that the order of bounties change?

Also it looks like when you select a status, the check mark disappears. The check mark should persist.

@MahtabBukhari
Copy link
Contributor Author

MahtabBukhari commented Jan 21, 2024

At the 0:09 mark, I trigger an API call with parameters such as the organization UUID from useParam, page set to 1, and a reset of the page to true. Additionally, the default status for all bounties is set to false ({Opened: false, Completed: false, Paid: false, Assigned: false}), and the default skill is empty string ' ' (indicating no specific language). ( Is this api call required ?)

The check marks persist, but in the video, I double-clicked, making it look like they are not persistent Link of new video

@MahtabBukhari
Copy link
Contributor Author

Hi @ecurrencyhodler, kindly review the pull request.

@ecurrencyhodler
Copy link
Contributor

Okay it looks like a call is firing when you click the button "status" and that no calls are being fired when you select "open/assigned/completed/paid".

The opposite should be happening. No call should be fired when the button "status" is clicked but a call should be fired when a status is selected. You can use the homepage for reference for the type of behavior that is expected: https://community.sphinx.chat/bounties

Also it looks like you're not pulling in org specific bounties because I see sphinx app, bounties, and core lightning all in this video. This should be an org specific call so only bounties associated with that org should appear.

@MahtabBukhari
Copy link
Contributor Author

I think I already tried to confirm with you the expected behavior, and you mentioned to just click on the status button and call the API, as you can see in this image.
image

@MahtabBukhari
Copy link
Contributor Author

I have implemented all the behavior and reverted back after confirming with you 😂 . Now, I am going to implement the behavior that you are instructing me to do now. I will ping you as soon as I complete it.

@ecurrencyhodler
Copy link
Contributor

I'm sorry. I misunderstood what you were saying. Thanks for doing that.

@MahtabBukhari
Copy link
Contributor Author

MahtabBukhari commented Jan 22, 2024

Okay it looks like a call is firing when you click the button "status" and that no calls are being fired when you select "open/assigned/completed/paid".

The opposite should be happening. No call should be fired when the button "status" is clicked but a call should be fired when a status is selected. You can use the homepage for reference for the type of behavior that is expected: https://community.sphinx.chat/bounties

Also it looks like you're not pulling in org specific bounties because I see sphinx app, bounties, and core lightning all in this video. This should be an org specific call so only bounties associated with that org should appear.

Hi @ecurrencyhodler, Please confirm this updated work Link. After confirmation, I will write the unit test and push it to the repository.

@elraphty
Copy link
Contributor

@MahtabBukhari After I unselected, or select a new status it does not get refreshed, and the request happens really slow, compared to the bounties page.

@MahtabBukhari
Copy link
Contributor Author

I haven't pushed the recently updated work on repo @elraphty

@MahtabBukhari
Copy link
Contributor Author

MahtabBukhari commented Jan 22, 2024

@elraphty, Could you please check this one https://www.loom.com/share/146b8c8022524cb8b8cd28a63e0def78

@ecurrencyhodler
Copy link
Contributor

Video looks good to me. Thanks.

But there are some jest tests failing. Can you take another look?

@MahtabBukhari
Copy link
Contributor Author

Sure, but I investigated and found that the organization backend API isn't functioning properly. When I make a call with a specific organization UUID, instead of returning the corresponding organization bounties, it's giving me a mix of bounties from different organizations, which seems unusual.
To address this issue and meet your requirement of displaying only the bounties from the same organization on the organization's homepage, I implemented some logic in the main.tsx file. As a result, these Jest errors are occurring.

logic implemented: That is only the bounties from the organization with the same ID as the current one are returned.
image

@ecurrencyhodler
Copy link
Contributor

Ok let me sync with raph and get back to you.

@elraphty
Copy link
Contributor

Sure, but I investigated and found that the organization backend API isn't functioning properly. When I make a call with a specific organization UUID, instead of returning the corresponding organization bounties, it's giving me a mix of bounties from different organizations, which seems unusual. To address this issue and meet your requirement of displaying only the bounties from the same organization on the organization's homepage, I implemented some logic in the main.tsx file. As a result, these Jest errors are occurring.

logic implemented: That is only the bounties from the organization with the same ID as the current one are returned. image

Which API endpoint are you hitting, and is this the host you are using people-test.sphinx.chat?

@MahtabBukhari
Copy link
Contributor Author

Sure, but I investigated and found that the organization backend API isn't functioning properly. When I make a call with a specific organization UUID, instead of returning the corresponding organization bounties, it's giving me a mix of bounties from different organizations, which seems unusual. To address this issue and meet your requirement of displaying only the bounties from the same organization on the organization's homepage, I implemented some logic in the main.tsx file. As a result, these Jest errors are occurring.
logic implemented: That is only the bounties from the organization with the same ID as the current one are returned. image

Which API endpoint are you hitting, and is this the host you are using people-test.sphinx.chat?
This is the API and host that i am using
image
image

@MahtabBukhari
Copy link
Contributor Author

MahtabBukhari commented Jan 23, 2024

@elraphty, Is it fine? OR I have to use somthing different?

@MahtabBukhari
Copy link
Contributor Author

@ecurrencyhodler @elraphty , This API and host are working as expected only when I select just one checkbox. However, when I select two checkboxes, multiple organization bounties appear.
Link

@ecurrencyhodler
Copy link
Contributor

okay it looks like @AbdulWahab3181 ran into the same issue. We might need another ticket to address this problem. @elraphty can you take a look?
stakwork/sphinx-tribes-frontend#187

@AbdulWahab3181
Copy link
Contributor

okay it looks like @AbdulWahab3181 ran into the same issue. We might need another ticket to address this problem. @elraphty can you take a look? #1013 (comment)

@ecurrencyhodler I believe my issue is slightly different. Firstly, I am encountering null values when selecting multiple checkboxes, while Mahtab is receiving data for multiple organization bounties in the response. Secondly, I am using the 'metrics/bounties' endpoint, whereas Mahtab is utilizing the 'organizations/bounties' endpoint.

@Ekep-Obasi
Copy link
Contributor

@elraphty, Is it fine? OR I have to use somthing different?

@MahtabBukhari, In my case I used people-test.sphinx.chat as host

@ecurrencyhodler
Copy link
Contributor

Thanks @Ekep-Obasi. You are right. The correct call is people-test not people.

@MahtabBukhari
Copy link
Contributor Author

Error is same on both

@AbdulWahab3181
Copy link
Contributor

AbdulWahab3181 commented Jan 23, 2024

@ecurrencyhodler I also observed that Mahtab is utilizing the 'organizations/bounties' endpoint for the status filter, while I used the 'gobounties/all' endpoint for the search in this ticket#1316, and both tasks are related to organization bounties pages. I believe using two different endpoints may result in inaccurate results.

I followed the instructions provided in the ticket, which guided me to implement the 'gobounties/all' endpoint. However, please let me know if I need to update my endpoint. Otherwise, we can instruct Mahtab to update his endpoint.

@ecurrencyhodler
Copy link
Contributor

Okay let's wait for @elraphty to chime in. Apologies for the confusion.

@MahtabBukhari
Copy link
Contributor Author

@ecurrencyhodler I also observed that Mahtab is utilizing the 'organizations/bounties' endpoint for the status filter, while I used the 'gobounties/all' endpoint for the search in this ticket#1316, and both tasks are related to organization bounties pages. I believe using two different endpoints may result in inaccurate results.

I followed the instructions provided in the ticket, which guided me to implement the 'gobounties/all' endpoint. However, please let me know if I need to update my endpoint. Otherwise, we can instruct Mahtab to update his endpoint.

I also have tried this one but the same issue

@MahtabBukhari
Copy link
Contributor Author

@elraphty, please review my pull request.

@ecurrencyhodler
Copy link
Contributor

It's past dinner for him right now. He'll take a look maybe by tomorrow.

@ecurrencyhodler
Copy link
Contributor

New api endpoint for our backend is: https://api.people-test.sphinx.chat/ But i'm not sure that's related to this pr. But wouldn't hurt to try the new call.

@MahtabBukhari
Copy link
Contributor Author

New api endpoint for our backend is: https://api.people-test.sphinx.chat/ But i'm not sure that's related to this pr. But wouldn't hurt to try the new call.

I have tested my work with the new backend API, https://api.people-test.sphinx.chat/. It is functioning properly with this update. You can also view the results here: https://www.loom.com/share/a61aa608a84643049fd842625dfbcd32.

@ecurrencyhodler
Copy link
Contributor

Beautiful.

@AbdulWahab3181
Copy link
Contributor

@ecurrencyhodler @elraphty Hi! I am waiting for the response on my queries. Could you please guide me?

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.

5 participants