KURE Community Curation App, Fundition Update - Tabbed View Selection, Sorting Comments, Remembering Vote Weights

After getting more of the UI/UX improvements done, I got stuck trying to resolve some issues in some areas, like the vote slider being cut off at the bottom due to overflow: hidden being applied. Eventually I got around to working on sorting comments and remembering the previous vote weight in the vote slider for the next time a vote is done.


Completed Tasks

  • Tabbed views for data sections on pages

  • Sort comments

  • Remember previous upvote slider weight

  • Other work done, bug fixes and code improvements

  • Separated the Redux for Steem actions

  • Fixed the vote slider's bottom part being overflow: hidden

  • Fixed bug with images crashing page in some cases

  • Fixed bug with single tag posts crashing page

  • Separated Steem interaction reducers and actions


Github commits for work done

https://github.com/KrNel/kure/commit/0040146106924704dd0776780f43138ca5e89e80
https://github.com/KrNel/kure/commit/7a9fb4fd8fb6d3c969374169d489945ceca0cb7c
https://github.com/KrNel/kure/commit/1932f22e94cce074730afb25369ac19dd2a0a297
https://github.com/KrNel/kure/commit/93eef3938cc7a8c9df7582e19d96a84bd1b8d8c2
https://github.com/KrNel/kure/commit/06c68ed17fe36dd5bd6067db32dd1fa9b1ed31b3
https://github.com/KrNel/kure/commit/89863858c5e76988a9194b0532020882c60f5f7d


Tabbed views for data sections on pages

Each KURE page had multiple section to display content. The Home page, for example, had the section Recent Kurations and Community Activity. These sections used to be displayed one on top of the others. To get more data for each section would require pagination.

But I already use infinite scroll on the Steem pages. So it's better to stick to that. The sections needed to be in their own view to have infinite scroll work for each. As such, section are now viewable separately as tabs.

The tab selected will determine which component to load. Each component has it's own tabs array to loop through and display the view. When the component updates with a state change for a change int he tab selection, a check is made to see which tab should be shown on the page by adding an activeTab class.

Sort comments

Comments can now be sorted. The sort by is done by new by default. Additionally you can select Old, Reputation or Payout.

New

Reputation

Payout

When the option is chosen, the specific switch case will match and sort the comments by the requested sort type.

Remember previous upvote slider weight

When voting, it's nice to have your previous vote weight remembered, as we often use the same vote on several successive posts. And if not, we usually stay in the same general area of vote weight percentage so at least its less moving of the slider when you need to change it slightly.

Two functions are called to set and get the vote weight which is stored in localStorage. When the vote weight is called, it gets the value from localStorage. And when the vote is finally sent, a new vote weight is set for the localStorage.


Ongoing Tasks

Up next, I will work on the following tasks previously listed in the original project post:

  • Post main story content (regular post)
  • Liking Kurated post submissions in communities
  • Rating Kurated post submissions in communities
  • Edit comments
  • Delete comments
  • Tweak comments (limit to 20, show more option, max nested depth)
  • Implement PRPL Pattern for better performance
  • Tabbed views for data sections on pages
  • Kurated posts page
  • Viewing comments in their own page view

Thank you everyone who supports my work in developing the community curation networking platform known as KURE!


Previous Fundition posts:


If you appreciate and value the content, please consider: Upvoting, Sharing or Reblogging below.
Follow me for more content to come!


Like what I do? Then consider giving me a vote on the Witness page :) Thanks!

My goal is to share knowledge, truth and moral understanding in order to help change the world for the better. If you appreciate and value what I do, please consider supporting me as a Steem Witness by voting for me at the bottom of the Witness page.

H2
H3
H4
Upload from PC
Video gallery
3 columns
2 columns
1 column
2 Comments