frontend: make internet checks non-binary

[Williangalvani]

needs testing for the limited case

helps #2921

Summary by Sourcery

Refine the internet connection status to include limited connectivity states.

New Features:

• Introduce a new "limited" internet connection state, providing more granular information about network availability.

Tests:

• Update tests to accommodate the new internet connection states.

[Williangalvani]

should I get this in here?

🤔

[Williangalvani]

should I get this in here?

🤔

nah we can do it later

[sourcery-ai]

Reviewer's Guide by Sourcery

This pull request modifies the internet connection check to have three states: online, offline and limited. It also updates the UI to reflect the new states.

Sequence diagram for internet connection check

sequenceDiagram
    participant PS as PingStore
    participant BE as Backend
    participant Sites as External Sites
    PS->>BE: Check internet connection
    BE->>Sites: Check reachability
    Sites-->>BE: Sites status
    BE-->>PS: Response with site statuses
    Note over PS: Determine connection state:
    Note over PS: - All sites: ONLINE
    Note over PS: - No sites: OFFLINE
    Note over PS: - Some sites: LIMITED
    Note over PS: - Error: UNKNOWN

Loading

Class diagram showing updated PingStore and InternetConnectionState

classDiagram
    class PingStore {
        -API_URL: string
        -has_internet: InternetConnectionState
        -services: Service[]
        +setHasInternet(has_internet: InternetConnectionState)
        +fetchData()
    }
    class InternetConnectionState {
        <<enumeration>>
        OFFLINE
        UNKNOWN
        LIMITED
        ONLINE
    }
    PingStore --> InternetConnectionState: uses

Loading

State diagram for internet connection states

stateDiagram-v2
    [*] --> UNKNOWN
    UNKNOWN --> OFFLINE: No sites reachable
    UNKNOWN --> ONLINE: All sites reachable
    UNKNOWN --> LIMITED: Some sites reachable
    OFFLINE --> UNKNOWN: Connection check error
    ONLINE --> UNKNOWN: Connection check error
    LIMITED --> UNKNOWN: Connection check error
    OFFLINE --> ONLINE: All sites become reachable
    OFFLINE --> LIMITED: Some sites become reachable
    LIMITED --> ONLINE: All sites become reachable
    LIMITED --> OFFLINE: No sites reachable
    ONLINE --> LIMITED: Some sites unreachable
    ONLINE --> OFFLINE: No sites reachable

Loading

File-Level Changes

Change	Details	Files
Modified internet connection check to have three states: online, offline, and limited.	Modified the has_internet variable to be an enum of InternetConnectionState instead of a boolean. Modified the setHasInternet mutation to accept an InternetConnectionState instead of a boolean. Modified the checkInternetConnectivity action to set the has_internet state to ONLINE, OFFLINE, or LIMITED based on the reachability of sites. Added a check to set the has_internet state to UNKNOWN if the backend is unreachable.	core/frontend/src/store/helper.ts
Updated the UI to reflect the new internet connection states.	Modified the InternetTrayMenu component to display a different icon based on the internet connection state. Modified the VersionCard component to disable bootstrap updates when the internet connection state is OFFLINE or UNKNOWN. Modified the BackAlleyTab component to display an info card when the internet connection state is OFFLINE. Modified the BazaarTab component to display an info card when the internet connection state is OFFLINE. Modified the VersionChooser component to only allow version checking when the internet connection state is not OFFLINE. Modified the InternetSpeedTest component to display an overlay when the internet connection state is OFFLINE.	core/frontend/src/components/app/InternetTrayMenu.vue core/frontend/src/components/version-chooser/VersionCard.vue core/frontend/src/components/kraken/BackAlleyTab.vue core/frontend/src/components/kraken/BazaarTab.vue core/frontend/src/components/version-chooser/VersionChooser.vue core/frontend/src/components/speedtest/InternetSpeedTest.vue
Added an enum for the internet connection states.	Added an enum called InternetConnectionState with the values OFFLINE, UNKNOWN, LIMITED, and ONLINE.	core/frontend/src/types/helper.ts

Assessment against linked issues

Issue	Objective	Addressed	Explanation
#2921	Implement a non-binary internet connection status that includes a 'limited connectivity' state	✅
#2921	Avoid limiting functionality when not 100% offline	✅

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it. You can also reply to a
  review comment with @sourcery-ai issue to create an issue from it.
• Generate a pull request title: Write @sourcery-ai anywhere in the pull
  request title to generate a title at any time. You can also comment
  @sourcery-ai title on the pull request to (re-)generate the title at any time.
• Generate a pull request summary: Write @sourcery-ai summary anywhere in
  the pull request body to generate a PR summary at any time exactly where you
  want it. You can also comment @sourcery-ai summary on the pull request to
  (re-)generate the summary at any time.
• Generate reviewer's guide: Comment @sourcery-ai guide on the pull
  request to (re-)generate the reviewer's guide at any time.
• Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
  pull request to resolve all Sourcery comments. Useful if you've already
  addressed all the comments and don't want to see them anymore.
• Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
  request to dismiss all existing Sourcery reviews. Especially useful if you
  want to start fresh with a new review - don't forget to comment
  @sourcery-ai review to trigger a new review!
• Generate a plan of action for an issue: Comment @sourcery-ai plan on
  an issue to generate a plan of action for it.

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

[sourcery-ai]

Hey @Williangalvani - I've reviewed your changes - here's some feedback:

Overall Comments:

• The tooltip text in InternetTrayMenu.vue should be updated to reflect the new connection states (LIMITED and UNKNOWN) rather than just showing binary online/offline messages

Here's what I looked at during the review

• 🟡 General issues: 1 issue found
• 🟢 Security: all looks good
• 🟢 Testing: all looks good
• 🟢 Complexity: all looks good
• 🟢 Documentation: all looks good

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

[sourcery-ai]

issue: Update tooltip to reflect all possible connection states

The tooltip should be updated to handle all four InternetConnectionState values to avoid misleading users about the actual connection state.