🐛 Sonarqube: No information to display, however, the settings are correct

[padupe]

Plugin Name

sonarqube

📜 Description

The settings are in accordance with the Backend and Frontend plugin documentation.

However, I receive the message on the frontend:
No information to display

👍 Expected behavior

Sonarqube information is expected to be rendered as expected.

👎 Actual Behavior with Screenshots

👟 Reproduction steps

1. Config at app-config.yaml:

sonarqube:
  baseUrl: https://sonarcloud.acme.com
  apiKey: ${SONARQUBE_TOKEN}

2. Config at catalog-info.yaml:

apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: gac-front-end
  description: Frontend GAC
  annotations:
    sonarqube.org/project-key: AP02126_GAC_FRONT_END
    github.com/project-slug: acme/gac-front-end
spec:
  type: service
  owner: group:squad-gac
  lifecycle: production

3. Backend config

// packages/backend/src/index.ts
import { createBackend } from '@backstage/backend-defaults'

[...]

// New Backend System
const backend = createBackend()

[...] // Other plugins

backend.add(import('@backstage-community/plugin-sonarqube-backend'))

backend.start()

4. EntityPage.tsx

// packages/app/src/components/EntityPage
import React from 'react';
import { EntitySonarQubeCard } from '@backstage-community/plugin-sonarqube';

[...]

const overviewCard = (
    <Grid container spacing={3} alignItems="stretch">
        {entityWarningContent}
        <Grid item md={6}>
           <EntityAboutCard variant="gridItem" />
        </Grid>
        <Grid item md={6}>
            <EntitySonarQubeCard variant="gridItem" />
        </Grid>

    [...]

     </Grid>
)

📃 Provide the context for the Bug.

I suspect it may be something related to CORS, but before the plugin was "migrated" to "community-plugins" it worked perfectly in a local environment.

👀 Have you spent some time to check if this bug has been raised before?

• I checked and didn't find similar issue

🏢 Have you read the Code of Conduct?

• I have read the Code of Conduct

Are you willing to submit PR?

No, but I'm happy to collaborate on a PR with someone else

[LegendSebastianoL]

interesting, we are using the same plugin and it's working as expected 🤔

sonarqube:
  baseUrl: ${SONARQUBE_BASE_URL}
  apiKey: ${SONARQUBE_API_KEY}

backend:
  baseUrl: ${BACKEND_BASE_URL}
  listen:
    port: 7007

  csp:
    connect-src:
      [
        "'self'",
        "'unsafe-eval'",
        "'unsafe-inline'",
        'https://api.github.com/repos/',
        'https://pipelines.actions.githubusercontent.com/',
        'https://api.pagerduty.com/',
      ]
    default-src: ['https://www.loom.com/', '*']
    script-src: ["'self'", "'unsafe-inline'", "'unsafe-eval'"]
    img-src: ["'self'", '*', 'data:']
  cors:
    origin: ${APP_BASE_URL}
    methods: [GET, HEAD, PATCH, POST, PUT, DELETE]
    credentials: true

"@backstage-community/plugin-sonarqube": "^0.8.2",

---

export const hasSonarqube = (entity: Entity) =>
  entityHasAnnotation(entity, 'sonarqube.org/project-key');

---

// Routes.tsx

  <>
    <EntityLayout.Route path="/sonarqube" title="Sonarqube" if={hasSonarqube}>
      <Grid container spacing={3} alignItems="stretch">
        <Grid md={12}>
          <EntitySonarQubeCard variant="gridItem" />
        </Grid>
      </Grid>
    </EntityLayout.Route>
  </>

index.ts in the BE

"@backstage-community/plugin-sonarqube-backend": "^0.2.23",

---

backend.add(import('@backstage-community/plugin-sonarqube-backend'));

[vinzscam]

according to the code the sonarqube.org/project-key annotation should be in one of the following format:

      //   instanceA/projectA  -> projectInstance = "instanceA" & projectKey = "projectA"
      //   instanceA/tenantA:projectA -> projectInstance = "instanceA" & projectKey = "tenantA:projectA"
      //   instanceA/tenantA/projectA -> projectInstance = "instanceA" & projectKey = "tenantA/projectA"