Format disconnect messages

[zardoy]

We already format chat & death messages. Let's refactor loading & error screen to React and use the same logic as for death screen, this should be easy. Also need to ensure that long kick messages are scrollable and don't overflow buttons (+ensure have global scroll bar styles).

examples. This is not readable at all:

---

IssueHunt Summary

Backers (Total: $50.00)

• zardoy ($50.00)

Become a backer now!

Or submit a pull request to get the deposits!

Tips

• Checkout the Issuehunt explorer to discover more funded issues.
• Need some help from other developers? Add your repositories on IssueHunt to raise funds.

[issuehunt-oss]

@zardoy has funded $10.00 to this issue.

---

• Submit pull request via IssueHunt to receive this reward.
• Want to contribute? Chip in to this issue via IssueHunt.
• Checkout the IssueHunt Issue Explorer to see more funded issues.
• Need help from developers? Add your repository on IssueHunt to raise funds.

[raghavpatidar]

I want to work please tell me how to regenerate above issue

[zardoy]

Hey @raghavpatidar! To reproduce:

• On the prod website:

1. Connect to mc.gamster.org

• Locally:

1. Start npm script test-mc-server
2. Start npm script start
3. open localhost:8080
4. connect to server by ip localhost
5. In terminal with npm script test-mc-server write kick <player name> like kick testbot

You should see raw JSON text displayed, instead the json should be parsed and used with MessageFormattedString.tsx (from next branch)

I was adding storybook support on the next branch, so it's easier to develop React components. You can see how DeathScreen is used in combination with StoryBook: https://github.com/zardoy/prismarine-web-client/blob/d77484c9662819edda8fe88424e9ea0190bd152b/src/react/DeathScreen.stories.tsx#L24-L25 You might want to do new React component in the same fashion (I mean refactor loading_or_error_screen.js) Now refactored to React. See AppStatus.tsx

[issuehunt-oss]

@zardoy has funded $40.00 to this issue.

---

• Submit pull request via IssueHunt to receive this reward.
• Want to contribute? Chip in to this issue via IssueHunt.
• Checkout the IssueHunt Issue Explorer to see more funded issues.
• Need help from developers? Add your repository on IssueHunt to raise funds.

[pablo-albaladejo]

Hi @zardoy,

Im trying to reproduce the issue locally but Im not able to connect to the server according the provided instructions

Start npm script test-mc-server
Start npm script start
open localhost:8080
connect to server by ip localhost
In terminal with npm script test-mc-server write kick like kick testbot

Everything seems to be up and running but connection can not be done:

• web client:
  
  

• server:
  

But when trying to connect

Could you help with the setup?

[zardoy]

Sorry for the delay. In MC version plays a crucial role, open mc server file - just because it set to run with version 1.16.1, it runs with version 1.16.1. And here you are connecting from the web client with version 1.18.1. Another question is why auto-version doesn't work sometimes and there is no proper error message when you connect to flying-squid with the wrong version. I think most probably there is an issue specific to flying-squid js impl, need to look into protocol stuff because I definitely remember I didn't have such issues with native java servers. Flying squid is totally okay for simple testing as it is fast & portable, but of course, for bigger testing or adding more serious features I always use native servers remotely/locally.