Knacksteem.org User Profile Dashboard Update: Contributions Lazy Loading & ACL Filtering for Administrators.

@creatrixity · 2018-11-27 08:05 · utopian-io

Repository

https://github.com/knacksteem/knacksteem.org

Pull Request

https://github.com/knacksteem/knacksteem.org/pull/47

https://user-images.githubusercontent.com/5021686/48901543-11ead180-ee56-11e8-926c-fa9b413486ed.gif

What Does this Pull Add?

This pull adds lazy loading capability to the profile dashboard of knacksteem.org to help create a seamless exploratory experience for users. This could be implemented thanks to server side updates that help queries define load ranges. The primary code that aids with this feature is the handleMoreArticlesLoading callback applied whenever the load more button is clicked. Also some sensible defaults are present within the component state. The code is pretty descriptive as we simply update the number of articles to skip over whenever the button is clicked.

  state = {
    isBanModalOpen: false,
    banReason: '',
    banDuration: 1000,
    filterBy: '',
    skipArticles: 0,
    limit: 25
  };

  handleMoreArticlesLoading(category) {
    let skipArticles = this.state.skipArticles + this.state.limit;
    this.setState({
      skipArticles
    });

    this.loadArticlesUser(category, skipArticles);
  }

This pull also adds more definitive filtering for access control levels as access to moderation controls is defined based on the user roles. There are multiple tiers of access with specific permissions:

  • Contributor.
  • Moderator.
  • Supervisor
  • Master-Supervisor.

Access-control-levels.gif

The dropdown for the moderation controls was updated to accommodate all constraints.

{(isMasterSupervisor || isSupervisor ) &&
 onModChoiceSelect(item.props.choice, item.props.action)}>
    {(isMasterSupervisor || isSupervisor) &&
      
        
        {user && user.roles.indexOf('moderator') === -1 ? ' a ' : ' as a '}
        Moderator
      
    }
    { isMasterSupervisor && (
      
        
        {user && user.roles.indexOf('supervisor') === -1 ? 'Make  ' : ' as a '}
        Supervisor
      
    )}
    
  }
  trigger={['click']}
>
  

}

Issue

https://github.com/knacksteem/knacksteem.org/issues/35

Task Request

https://steemit.com/knacksteem/@knowledges/development-task-request-help-build-knacksteem-front-end-800-steem-bounty

Conclusion

This pull successfully concludes the utopian task request described.

Commits

https://github.com/knacksteem/knacksteem.org/pull/47/commits/16ed4a88276a4519b1c0eb37f4539378296eb79f

https://github.com/knacksteem/knacksteem.org/pull/47/commits/24718079551345dab64da5821b9e12fbe908a4bf

https://github.com/knacksteem/knacksteem.org/pull/47/commits/c06bd44173c2483a98a5707ea53bd02fc184ca9f

https://github.com/knacksteem/knacksteem.org/pull/47/commits/7ccc753edcfad8d0762adbfb8b55e094effc8da9

https://github.com/knacksteem/knacksteem.org/pull/47/commits/6d3ebad2f1c2a5dbb210e81d98ed862f8a2b9348

Github Account

https://github.com/creatrixity

#utopian-io #development #knacksteem #programming #reactjs
Payout: 0.000 HBD
Votes: 87
More interactions (upvote, reblog, reply) coming soon.