fix(web-app): Fix Grafana detection due to HEAD request (kubeflow#1541)

We should use a GET request to try and detect if Grafana is exposed. The
frontend should consider the Grafana endpoint to be working only if the
request to the endpoint returns a list.

Signed-off-by: Kimonas Sotirchos <kimwnasptd@arrikto.com>

web-app/frontend/src/app/pages/server-info/server-info.component.ts

@@ -89,14 +89,27 @@ export class ServerInfoComponent implements OnInit, OnDestroy {
     });
 
     // don't show a METRICS tab if Grafana is not exposed
+    console.log('Checking if Grafana endpoint is exposed');
+    const grafanaApi = environment.grafanaPrefix + '/api/search';
+
     this.http
-      .head(environment.grafanaPrefix)
+      .get(grafanaApi)
       .pipe(timeout(1000))
       .subscribe({
-        next: () => {
+        next: resp => {
+          if (!Array.isArray(resp)) {
+            console.log(
+              'Response from the Grafana endpoint was not as expected.',
+            );
+            this.grafanaFound = false;
+            return;
+          }
+
+          console.log('Grafana endpoint detected. Will expose a metrics tab.');
           this.grafanaFound = true;
         },
         error: () => {
+          console.log('Could not detect a Grafana endpoint..');
           this.grafanaFound = false;
         },
       });