Add popover for the Flux sync status badge

What does this MR do and why?

This MR adds a popover for the Flux sync status badge.

Screenshots or screen recordings

Scenario	Screenshot	Comment
Flux reconciled		Added popover as per UX reviewer's comment in a related MR
Flux reconciling in progress		Added popover as per UX reviewer's comment in a related MR
Flux reconciliation stalled		The popover displays an error message provided by Flux
Flux reconciliation failed		The popover displays an error message provided by Flux
Flux sync status unknown		The popover renders a link to the related issue with a list of all statuses and the logic behind displaying them
Flux sync status unavailable due to not configured setup		Links to the docs
Flux sync status unavailable due to authorization error		The popover displays an error provided by the KAS
Flux sync status unavailable due to a generic API error		The popover displays an error provided by the request handler

How to set up and validate locally

1. Enable KAS on your GDK (steps 1-2 from the guide).

2. Visit the Project -> Infrastructure -> Kubernetes clusters page and create an agent following the instruction from the modal.

   • Select the "Connect a cluster" button
   • The modal should pop up
   • In the modal select "Select an agent or enter a name to create new"
   • You probably won't have any configured agents to show up in the list, create a new one by typing the name of your choice
   • The button should appear at the bottom of the list saying "Create agent: <your-agent-name>"
   • Select the button and click "Register" in the next view.
   • Save the token to use it in the next point.

3. Please follow points 3-8 from the guide and then the (Optional) Deploy the GitLab Agent (agentk) with k3d section to create a local cluster and connect your agent with the cluster.

4. Add the following configuration for your agent, commit the following on the default branch: .gitlab/agents/<your-agent-name>/config.yaml:

   gitops:
     manifest_projects:
     - id: <your-group>/<your-project>
   user_access:
     access_as: 
       agent: {}
     projects:
     - id: <your-group>/<your-project>

5. Follow this guide to start with the Flux

6. Visit the Environments page:

   • Project -> Operate -> Environments if the new navigation is enabled
   • Project -> Deployments -> Environments if the new navigation is not enabled

7. Create/Edit an environment using the UI, select the agent created in the previous steps and the namespace used for the Flux setup (usually, called flux-system)

8. Navigate to the Environments page, toggle the environment, wait for the Kubernetes overview to appear, and verify the Flux sync badge has a popover.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Review progress:

• UX review
• Technical Writing review
• frontend developer review
• frontend maintainer review

Related to #391581 (closed)