Steemit Condenser's Community Selection Option

faisalamin (79)modSteem Devin Steem Dev • 3 months ago (edited)

Hello everyone, I trust all is well. Recently, I worked on the Steemit Condenser project locally and made adjustments to certain components. One feature I strongly believe should be included in Steemit for users is the ability to select a community on the Submit page.

Problem Statement

When I first started using Steemit, I often made the mistake of posting in the wrong community. Unfortunately, there were times when I posted in my blogs instead of a specific community. This was because we needed to visit the community first and then click on the Post button.

Solution

I read some useful component code for this new feature. The code of Steemit is too old. It uses using very old dependencies method. So it was hard for me to understand the full work in a short time. I start it by adding the selector and fetching the subscribed communities. Then I make changes according to the retrieved data.

The primary challenge was to update the tags effectively. Although the community tag "hive144064" was included in the community selection, it was not displayed on the form. Therefore, I dedicated additional effort to ensure that everything functions as intended. As a result, I am delighted to share that I am currently publishing this post using my local environment and testing the Community Selection feature for the first time in Steemit's history.

Screenshot 2024-01-23 233320.png

Screenshot 2024-01-24 001025.png

Looking forward to improvement for this feature. If you have any suggestions, let me know.

Here I created a simple function to handle the community change in the editor.

 onCommunityChange = tag => {

        const { tags } = this.state;
        const items = tags.value.split(' ');

        // updating the url with the new community name
        browserHistory.replace(`/submit.html?category=${tag}`);

        // removing the old community name
        items.shift()

        // updating the tags with the new community name
        tags.props.onChange(tag + ' ' + items.join(' '));

        // updating the community state with new tags
        this.setState({ community: tag });
    }