Merge pull request #67 from oslabs-beta/ms/ValidateUserInput

Ms/validate user input

Author: MichaelCSnyder

ksqLight/server/server.js

@@ -35,6 +35,15 @@ const RealTimeType = new GraphQLObjectType({
             resolve: (parent, args, context) => parent[1]
         }
     })
+});
+
+const ValidationType = new GraphQLObjectType({
+    name: 'inputValidation',
+    description: 'Object indicating input validity status and error message',
+    fields: () => ({
+        isValid: { type: GraphQLBoolean },
+        error: { type: GraphQLString }
+    })
 })
 
 //---------------Root Query Types----------------
@@ -53,7 +62,7 @@ const RootQueryType = new GraphQLObjectType({
                 prometheusURL: { type: GraphQLNonNull(GraphQLString)}
             },
             resolve: (parent, {start, end, resolution, metric, prometheusURL}) => {
-                if (prometheusURL[prometheusURL.length] === '/') prometheusURL = prometheusURL.slice(0, prometheusURL.length);
+                if (prometheusURL[prometheusURL.length - 1] === '/') prometheusURL = prometheusURL.slice(0, prometheusURL.length - 1);
 
                 return axios.get(`${prometheusURL}/api/v1/query_range?step=${resolution}s&end=${end}&start=${start}&query=${queryTypes[metric]}`)
                 .then(res => {
@@ -125,6 +134,65 @@ const RootQueryType = new GraphQLObjectType({
                 }
             }
         },
+        isValidPrometheusURL: {
+            type: ValidationType,
+            description: 'Object representing whether provided Prometheus URL points to valid Prometheus server and any errors',
+            args: {
+                prometheusURL: { type: GraphQLNonNull(GraphQLString)}
+            },
+            resolve: async (parent, { prometheusURL }) => {
+                if (prometheusURL[prometheusURL.length - 1] === '/') prometheusURL = prometheusURL.slice(0, prometheusURL.length - 1);
+
+                return axios.get(`${prometheusURL}/api/v1/status/buildinfo`)
+                .then(res => ({
+                    isValid: true,
+                    error: null
+                }))
+                .catch(error => ({
+                    isValid: false,
+                    error: error.message
+                }));
+            }
+        },
+        isValidKsqlDBURL: {
+            type: ValidationType,
+            description: 'Object representing whether provided ksqlDB URL points to valid Prometheus server and any errors',
+            args: {
+                ksqlDBURL: { type: GraphQLNonNull(GraphQLString)}
+            },
+            resolve: (parent, { ksqlDBURL }) => {
+                if (ksqlDBURL[ksqlDBURL.length - 1] === '/') ksqlDBURL = ksqlDBURL.slice(0, ksqlDBURL.length - 1);
+
+                return axios.get(`${ksqlDBURL}/clusterStatus`)
+                .then(res => ({
+                    isValid: true,
+                    error: null
+                }))
+                .catch(error => ({
+                    isValid: false,
+                    error: error.message
+                }));
+            }
+        },
+        isValidDuration: {
+            type: GraphQLBoolean,
+            description: 'Boolean representing whether Prometheus server accepts user duration.',
+            args: {
+                metric: { type: GraphQLNonNull(GraphQLString)},
+                start: { type: GraphQLNonNull(GraphQLInt)},
+                end: { type: GraphQLNonNull(GraphQLInt)},
+                resolution: { type: GraphQLNonNull(GraphQLInt)},
+                prometheusURL: { type: GraphQLNonNull(GraphQLString)}
+            },
+            resolve: (parent, { start, end, resolution, metric, prometheusURL }) => {
+                if (prometheusURL[prometheusURL.length - 1] === '/') prometheusURL = prometheusURL.slice(0, prometheusURL.length - 1);
+
+                
+                return axios.get(`${prometheusURL}/api/v1/query_range?step=${resolution}s&end=${end}&start=${start}&query=${queryTypes[metric]}`)
+                .then(res => true)
+                .catch(error => false);
+            }
+        }
     })
 });
 

ksqLight/src/components/Chart.js

@@ -1,13 +1,8 @@
 import React from "react";
-import { useState } from "react";
-import { Typography, Grid, Toolbar, Container, CssBaseline, Box } from "@mui/material";
-import { Chart } from "./Chart.js";
+import { Grid, CssBaseline, Box, CardContent } from "@mui/material";
 import LineChart from "./LineChart.js";
-import { LivenessCard } from "./MetricCard.js";
 
 export const Homepage = ({ showQueries, showMessages, showErrors, metricsState }) => {
-  const [content, setContent] = useState('Chart placeholder');
-
   const queriesCharts = [
     ["runningQueries", "Number of Running Queries"],
     ["createdQueries", "Number of Created Queries"],
@@ -33,32 +28,10 @@ export const Homepage = ({ showQueries, showMessages, showErrors, metricsState }
     ["errorQueries", "Number of Error Queries"],
     ["pendingErrorQueries", "Number of Pending Error Queries"],
   ]
-  const queryTypes = [
-    ["runningQueries", "Number of Running Queries"],
-    ["rebalancingQueries", "Number of Rebalancing Queries"],
-    ["pendingShutdownQueries", "Number of Pending Shutdown Queries"],
-    ["pendingErrorQueries", "Number of Pending Error Queries"],
-    ["numPersistentQueries", "Number of Persistent Queries"],
-    ["numIdleQueries", "Number of Idle Queries"],
-    ["numActiveQueries", "Number of Active Queries"],
-    ["notRunningQueries", "Number of Not Running Queries"],
-    ["messagesProducedPerSec", "Number of Messages Produced Per Second"],
-    ["messagesConsumedTotal", "Number of Messages Consumed"],
-    ["messagesConsumedPerSec", "Number of Messages Consumed Per Second"],
-    ["messagesConsumedMin", "Number of Messages Consumed Min"],
-    ["messagesConsumedMax", "Number of Messages Consumed Max"],
-    ["messagesConsumedAvg", "Number of Messages Consumed Average"],
-    // ["livenessIndicator", "Liveness Indicator"],
-    ["errorRate", "Error Rate"],
-    ["errorQueries", "Number of Error Queries"],
-    ["createdQueries", "Number of Created Queries"],
-    ["bytesConsumedTotal", "Number of Bytes Consumed Total"],
-  ];
 
   return (
     <Box>
       <CssBaseline />
-      <Typography color="primary">Hi Welcome back</Typography>
       <Grid container spacing={4} sx={{}}>
         {showQueries &&
           queriesCharts.map(([query, description], index) =>
@@ -69,12 +42,11 @@ export const Homepage = ({ showQueries, showMessages, showErrors, metricsState }
             <LineChart description={description} metric={query} metricsState={metricsState} key={index} />
           )
         }
-        {/* {showErrors &&
+        {showErrors &&
           errorCharts.map(([query, description], index) =>
-            <LineChart description={description} metric={query} key={index} />
-          )
-        } */}
-        {/* {queryTypes.map(([query, description], index) => <LineChart description={description} metric={query} key={index} />)} */}
+            <LineChart description={description} metric={query} metricsState={metricsState} key={index} />
+          ).concat([<Grid item xl={3}><CardContent sx={{ width: "300px" }}></CardContent></Grid>])
+        }
       </Grid>
     </Box>
   )

ksqLight/src/components/Homepage.js

@@ -37,7 +37,7 @@ export default function LineChart({ metric, description, metricsState }) {
 
     initialData = client.query({
       query: gql`
-          query testQuery {
+          query fetchMetric {
             ksqlDBMetrics(prometheusURL: "${metricsState.prometheusURL}" metric: "${metric}", resolution: ${metricsState.refreshRate}, start: ${unixStart}, end: ${unixEnd}) {
                   x,
                   y