Discussion Forum Integration: Create solutions leaderboard

[leecalcote]

Current Behavior
meshery.io does not integrate with its discussion forum (discuss.layer5.io).

Desired Behavior
Ideally, one or more of the pages will display the a solutions leaderboard.

See an example of this integration in-action on this Meshery Docs page. And see this discussion for more context.

See the discuss.layer5.io design spec and the moderating the community discussion forum docs for a list of other possibilities.

Screenshots / Mockups

---

Contributor Guides and Resources

• 🎨 Wireframes and designs for Meshery Site in Figma
• 🖥 Contributing to Meshery Website
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack

[chethan27]

hi @leecalcote, if the designs are ready I am ready to work on this.

[leecalcote]

@kayceeDev and @asubedy are two individuals to engage with @chethan27

[chethan27]

@kayceeDev @asubedy , any update ?

[leecalcote]

They are waiting for you to make a move and implement, @chethan27. I mentioned these two as helpful and knowledgeable community members to connect with should you get stuck. What’s your plan of approach on implement of this issue?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[github-actions]

Checking in... it has been awhile since we've heard from you on this issue. Are you still working on it? Please let us know and please don't hesitate to contact a MeshMate or any other community member for assistance.

---

        Be sure to join the community, if you haven't yet and please leave a ⭐ star on the project 😄

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue is being automatically closed due to inactivity. However, you may choose to reopen this issue.

[senali-d]

@leecalcote I would like to work on this task.

But I have doubt regarding this task. Is this issue is to develop something similar to screenshot/mockup or else is it like this Recent Discussions with "mesheryctl" Tag

[ishaan812]

Can I be assigned this task?

[aabidsofi19]

@leecalcote

I would like to work on this issue , with experience in front-end development, I am confident in resolving these issues effectively. I would appreciate being assigned this task to contribute to the improvement of the Meshery experience for new users.

Thank you for considering my request.

Best regards,
Aabid Sofi

[kayceeDev]

@leecalcote

I would like to work on this issue , with experience in front-end development, I am confident in resolving these issues effectively. I would appreciate being assigned this task to contribute to the improvement of the Meshery experience for new users.

Thank you for considering my request.

Best regards, Aabid Sofi

Hello @aabidsofi19,

You can take a go at this. You need to reiterate to me your progress as you proceed.
You need to be certain you have read and understood what is needed to work on this.
Take a look at this article to get a deeper understanding of what is expected under the hood the aside from UI you are seeing here.

[aabidsofi19]

Thanks @kayceeDev for considering it , Just checked the article . and i can assure you that this is something i would really enjoy working on . i would like to discuss about different ways to get this done efficiently .

[kayceeDev]

Thanks @kayceeDev for considering it , Just checked the article . and i can assure you that this is something i would really enjoy working on . i would like to discuss about different ways to get this done efficiently .

Well, I'm glad you did look at the article. Please feel free to discuss an efficient solution on this thread.. let's discuss..

[aabidsofi19]

@leecalcote @kayceeDev
Based on my understanding of the proposal, there are three key parts to the problem that need to be addressed:

• Implementing the UI: Design and develop a user-friendly and visually appealing interface for the embeddable component.

• Implementing Business Logic for ranking: Create the necessary algorithms and logic to handle the ranking functionality within the component.

• Implementing IO for feeding data to Business Logic: Set up a mechanism to fetch and feed data to the business logic, ensuring seamless communication and integration.

Additionally, considering that this component will be utilized on multiple sites, it is crucial to make it embeddable. To achieve this, I propose bundling the component as a standalone JavaScript script that can be hosted on our CDN (Content Delivery Network). This approach will enable the component to be easily loaded and utilized on any site as needed.

Benefits:

- Enhanced User Experience: By implementing a well-designed UI, users will have a seamless and visually pleasing experience when interacting with the component.

- Improved Ranking Functionality: The implementation of robust business logic will ensure accurate and reliable ranking results for the intended purpose also it would be easy to unittest 

• Versatility and Ease of Integration: Making the component embeddable as a standalone JavaScript script allows for effortless integration into various websites, providing flexibility and convenience.

Proposed Plan:

• Design and develop a visually appealing and intuitive UI for the embeddable component, ensuring a smooth user experience.

• Implement the necessary business logic and algorithms for the ranking functionality, considering the specific requirements and objectives.

• Set up IO mechanisms, such as APIs or data feeds, to seamlessly provide the required data to the business logic for accurate ranking calculations.

• Package the component as a standalone JavaScript script, optimizing it for performance and compatibility, and host it on our CDN for easy integration and deployment on any website.

[kayceeDev]

@aabidsofi19 I have looked at your outline plans and it's welcomed, I have some question to consider

1. The solution, can you easily embed it to our websites with the tech stack we are using for our client sides?

2. The data, do you think it makes sense to fetch it through some socket or fetching on page visit?

3. Are we considering paginations

[sudhanshutech]

@aabidsofi19 that great you have been working here, implementing the ui and fetching the data should not be a very difficult task because it has been already done in catalog page in this site. Next comes about implementing logic so in api used for discuss provide much responses where you can build the logic.
1. api gives for every posts likes count .
2. api gives posts count
3. accepted answer- a solution of that post as boolean value

.....on that that such responses we can count points using normal alzebraic formula and result in points and just make in descending order and display in ui.

[aabidsofi19]

@kayceeDev if all the sites we are going to use discussion ui on are using Gatsby then we can just create it as a Gatsby component else we can create it using vanilla js and plain html (as suggested ). Coming to pagination I think it would be easy if the APIs also implement it else I think we may need to create wrapper APIs .

[vishalvivekm]

Thanks for the feedback @kayceeDev @sudhanshutech
@aabidsofi19 would you be on today's websites call to discuss this? if yes, please add this as an agenda item in the meeting minutes // @kayceeDev @sudhanshutech .
The meeting happens every Monday at 5:30 PM IST i.e, 2 hours from now.

[aabidsofi19]

@vishalvivekm @leecalcote @kayceeDev we might need to create a separate repo for this as it is not going to be a part of any site in particular and we can then also easily manage its devops.

[leecalcote]

There is a separate repo in the layer5io org for this.

[aabidsofi19]

Thanks @leecalcote , forgot to look in layer5 org . I will start working on this issue from today according to above action plan :) . Just to confirm is it this repo https://github.com/layer5io/discuss-board

[vishalvivekm]

@aabidsofi19
Let's cover this item in tomorrow's websites call :)

[aabidsofi19]

Sure

[kayceeDev]

Thanks @leecalcote , forgot to look in layer5 org . I will start working on this issue from today according to above action plan :) . Just to confirm is it this repo https://github.com/layer5io/discuss-board

yes.