Troubleshoot: Show auth connection issues

[RXminuS]

Fixes #3673 where we mistakingly show a signIn screen if there are connectivity issues to the Cody server.

Test plan

• End2end tests are added
• Storybook is added to view the UI
  • Allow for full-viewport rendering to test for breakpoint issues.

[RXminuS]

@sourcegraph/cody-clients Does this affect JB's in any way? I had to update the Kotlin protocols but I'm not sure if that was the correct approach.

[abeatrix]

Left some comments inline. The only concern i have is about the reset function, but the rest looks good to me. Nice work!

[RXminuS]

Yeah I'll probably just change that to a sign out. I just didn't want someone to get stuck with bad settings and not get back to the sign in screen.

Thanks for taking a look

[RXminuS]

I've decided to remove the "fullReset" and "showOutput" logs in favor of another feature coming soon to help users enable and navigate debug mode/troubleshooting mode more easily. So this screen will only allow you to retry or sign-out explicitly. The problem with some of the other commands is that they are tied to specific UI clicks and handle all the analytics as well (which I think is a different problem altogether). But I'll see if I can simplify it somewhat.

Although there will be 4-5 commands coming to the troubleshoot namespace soon

[github-actions]

‼️ Hey @sourcegraph/cody-security, please review this PR carefully as it introduces usage of unsafe_ functions or abuses PromptString.

[philipp-spiess]

@RXminuS sorry regarding the message above, see: #3797 (comment)

Fix incoming: #3810

[RXminuS]

@philipp-spiess increasing the timeout fixed the e2e tests 👍 thanks for the help

[toolmantim]

Nice! This design is looking good too.

For the width/positioning, use VS Code’s Run & Debug panel and responsive breakpoints as the guide:

CleanShot.2024-04-17.at.11.24.01.mp4

i.e. icon & buttons are full width until a point, then left aligned

[RXminuS]

Nice! This design is looking good too.

For the width/positioning, use VS Code’s Run & Debug panel and responsive breakpoints as the guide:

@toolmantim VScode had a few inconsistent breakpoints so I just picked 650px as the max. They also have global flags for reduced motion that I didn't want to dive into now so I didn't add any animations. I think that's something we can globally define once we set up Tailwind helpers. But for now, I've tried to follow the spirit of it :-)

CleanShot.2024-04-17.at.14.36.07.mp4

[abeatrix]

Thanks for working on this and for adding all those amazing tests! Confirm the chat panel is now showing up correctly on reload, and we can look into the Loading page issue separately 😄 well done!