Opt-In Dropdown for dashboard

[abhishek-01k]

Pull Request Template

• Fix the opt-in dropdown scroll issue on dashboard page #1643

Description

New Subscribe and Unsubscribe dropdown for the dashboard. Added query for subscribe channel, unscubscribe channel and save notiifcations settings. Also, used the new components for the dropdown.

• Problem/Feature:

Type of Change

• Bug fix
• New feature
• Code refactor
• Documentation update
• Other (please describe):

Checklist

• Quick PR: Is this a quick PR? Can be approved before finishing a coffee.
  • Quick PR label added
• Not Merge Ready: Is this PR dependent on some other PR/tasks and not ready to be merged right now.
  • DO NOT Merge PR label added

Frontend Guidelines

• Followed frontend guidelines as per the Guidelines Notion Doc

Build & Testing

• No errors in the build terminal
• Engineer has tested the changes on their local environment
• Engineer has tested the changes on deploy preview

Screenshots/Video with Explanation

https://www.figma.com/design/FvJL0JWHlsVohsHTERB1Lh/Push-Design-Foundations?node-id=6696-9326&t=stUlFf9CbAIdY9PF-0

Additional Context

Review & Approvals

• Self-review completed
• Code review by at least one other engineer
• Documentation updates if applicable

Notes

You can try to subscribe on Test Dev 5 channel and Node tester channel. It has the settings

[github-actions]

All looks good.

[github-actions]

PR Preview Action v1.4.7
Preview removed because the pull request was closed.
2024-08-12 13:38 UTC

[github-actions]

In the Dropdown.tsx file:

1. Line 38: Change onClick={() => trigger == 'click' && toggleDropdown} to onClick={() => trigger === 'click' && toggleDropdown()}.
2. Line 49: Change trigger == 'hover' to trigger === 'hover' for onMouseEnter and onMouseLeave events.
3. Line 84: Add parentheses to onClick event: onClick={() => trigger === 'click' && toggleDropdown()}.

In the ManageSettingsDropdown.tsx file:

1. Line 35: if (updatedSettings[index].type === 1) should be changed to if (updatedSettings[index].type === 1) {.
2. Line 46: Add missing declaration for updatedSettings above in the function.
3. Line 58: Add updatedSettings before updatedSettings[index] to fix the variable reference.
4. Line 66: Add closing curly brace } to close the condition block for type 2.
5. Line 78: Add closing curly brace } to close the condition block for type 3.
6. Line 126: The assignment in {setting.user || setting.default} should be replaced with the appropriate logic based on the expected result.
7. Line 186: defaultEndVal should be replaced with defaultUpperVal to maintain consistency in naming.
8. Line 196: Replace handleSliderChange with handleSliderRangeChange in onChange event.

These are the corrections needed in the provided snippets.

[github-actions]

In the Dropdown.tsx file:

1. Line 37: onClick={() => trigger == 'click' && toggleDropdown} should be onClick={() => trigger === 'click' && toggleDropdown()}
2. Line 112: if (updatedSettings[index].type === 1) is missing updatedSettings declaration before the IF condition.
3. Line 122: if (updatedSettings[index].type === 2) is missing updatedSettings declaration before the IF condition.
4. Line 157: if (setting.type === 3) is missing updatedSettings declaration before the IF condition.
5. There seems to be more code not shown, but based on what's visible, those are the changes needed.

In the InputSlider.tsx file:

1. Line 37: border-bottom-left-radius: 8px; in Active styled component is missing the closing curly brace }.
2. Line 46: background-color: #eaebf2; in Inactive styled component is missing the closing curly brace }.
3. Line 52: height: 24px; in Container styled component is missing the closing semi-colon ;.

Other files are not displayed, so I cannot review them.

Overall, please fix the issues mentioned above in the respective files. Let me know if you need further assistance or clarification.