[Feature] Converting Community events to tab list format

[Aadarsh805]

Fixes Issue

Closes #2902

Changes proposed

Changed the events page layout to tabs format same as in user profile section and a select dropdown for mobile screen size

Created EventTab.js separate file for events tabs implemented both tabs layout and select dropdown for large and smaller screen size

I used exactly the same approach that is being used for user profile tabs

Check List (Check all the applicable boxes)

• [ x] My code follows the code style of this project.
• [ ] My change requires changes to the documentation.
• [ ] I have updated the documentation accordingly.
• [ x] All new and existing tests passed.
• [x ] This PR does not contain plagiarized content.
• [ x] The title of my pull request is a short description of the requested changes.

Screenshots

Before:

These were taking too much screen space

After:

video screen capture:

screen-capture (9).webm

Idk why it didn't capture the dropdown, but it is there you can see in this video down here screen-capture (10).webm

Note to reviewers

I think the code can be cleaned up a little more, UserTabs and EventTabs pretty much do the same thing, maybe we can remove the reputation by using one for both some state and variables naming might also need to be changed

[Aadarsh805]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

[ChinmayMhatre]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

[Aadarsh805]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

so I remove the sorting functionality and buttons for now ?

[Aadarsh805]

resolved conflict in the above commit

[ChinmayMhatre]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

so I remove the sorting functionality and buttons for now ?

Yes we could add those later. It will be better if we add small changes in different Prs

[Aadarsh805]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

so I remove the sorting functionality and buttons for now ?

Yes we could add those later. It will be better if we add small changes in different Prs

so should i remove the sorting code completely or can i comment that out, as we might need it later

[ChinmayMhatre]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

so I remove the sorting functionality and buttons for now ?

Yes we could add those later. It will be better if we add small changes in different Prs

so should i remove the sorting code completely or can i comment that out, as we might need it later

Remove the code from here. But maybe you can save it somewhere locally on your system for a reference

[Aadarsh805]

@ChinmayMhatre hey, I'm having an issue with the sorting function, what happens is the sort works on the second click it doesn't work on the first click but then it starts working after the first click can you have a look at that functions code whenever you are free, thanks

I went Through the issue and noticed the issue was majorly discussing creating tabs instead of the four button. I think we could focus on refactoring the tabs further in this issue and create a new issue for the sorting. You could take on that issue as well if you want since you had been working on this.

so I remove the sorting functionality and buttons for now ?

Yes we could add those later. It will be better if we add small changes in different Prs

so should i remove the sorting code completely or can i comment that out, as we might need it later

Remove the code from here. But maybe you can save it somewhere locally on your system for a reference

alright 🫡

[ChinmayMhatre]

@Aadarsh805 I have added a comment on how you could go about adding a state for the event type .Could you take a look?

[Aadarsh805]

@Aadarsh805 I have added a comment on how you could go about adding a state for the event type .Could you take a look?

ohh yes yes we can do that

[ChinmayMhatre]

@Aadarsh805 I have added a comment on how you could go about adding a state for the event type .Could you take a look?

ohh yes yes we can do that

Try it out, let me know if you need any help

[Aadarsh805]

@ChinmayMhatre made a commit, have a look

[ChinmayMhatre]

@ChinmayMhatre made a commit, have a look

I'll take a look by EOD

[Aadarsh805]

@ChinmayMhatre made a commit, have a look

I'll take a look by EOD

sure sure whenever you are free

[ChinmayMhatre]

@Aadarsh805 why was userTabs and EventKey deleted? I guess it is used somewhere, the github action failed. please check

[Aadarsh805]

@Aadarsh805 why was userTabs and EventKey deleted? I guess it is used somewhere, the github action failed. please check

wait does it means it'll delete userTabs from the repo??

[ChinmayMhatre]

@Aadarsh805 why was userTabs and EventKey deleted? I guess it is used somewhere, the github action failed. please check

wait does it means it'll delete userTabs from the repo??

Yeah

[ChinmayMhatre]

@Aadarsh805 if you want to revert the changes from the file you can you git checkout main -- {name of the file} This commands takes that file from the main branch and copies it in this branch. Eddie made a video on this yesterday https://www.youtube.com/watch?v=YUHS5Ana7Jw

[Aadarsh805]

@ChinmayMhatre

then this on pull

[Aadarsh805]

The delete was done through GitHub directly, that's why it wants me to pull first

[ChinmayMhatre]

@Aadarsh805 Maybe just pull the changes from the fork then revert back to this 0114d4185df5594c2ae945c72234a7371d0ab93 commit which is the one before things got deleted

[ChinmayMhatre]

@Aadarsh805 try not to make changes on github. Eddie has this video on how to keep the fork in sync and the workflow. You could check it out later. https://www.youtube.com/watch?v=vn2SgK4IbiM

[Aadarsh805]

@Aadarsh805 try not to make changes on github. Eddie has this video on how to keep the fork in sync and the workflow. You could check it out later. https://www.youtube.com/watch?v=vn2SgK4IbiM

I'll check it out

now what

[Aadarsh805]

It still saying to pull

[ChinmayMhatre]

@Aadarsh805 try not to make changes on github. Eddie has this video on how to keep the fork in sync and the workflow. You could check it out later. https://www.youtube.com/watch?v=vn2SgK4IbiM

I'll check it out

now what

Are the files back locally?

[ChinmayMhatre]

It still saying to pull

Did you pull the changes from your fork?

[Aadarsh805]

It still saying to pull

Did you pull the changes from your fork?

It's not letting me, should i pull with --rebase

[Aadarsh805]

wait something happened here

[Aadarsh805]

I think it worked, @ChinmayMhatre did it ?

[Aadarsh805]

Now I gotta do this for EventKey.js too, or should I leave it because it gets merged it won't require EventKey.js