Merge remote-tracking branch 'origin' into test-fixes

Sunbird-Obsrv · Nov 15, 2024 · a921e55 · a921e55
2 parents f11d74a + 6b75825
commit a921e55
Show file tree

Hide file tree

Showing 40 changed files with 597 additions and 572 deletions.
diff --git a/web-console-v2/package.json b/web-console-v2/package.json
@@ -67,7 +67,7 @@
   },
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build",
+    "build": "react-scripts build --no-cache",
     "postbuild": "mkdir build/console && mv build/static build/console/static",
     "test": "react-scripts test",
     "eject": "react-scripts eject",

diff --git a/web-console-v2/src/components/Navbar/Navbar.tsx b/web-console-v2/src/components/Navbar/Navbar.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Typography, Breadcrumbs, Grid, Box, Badge } from '@mui/material';
+import { Typography, Breadcrumbs, Grid, Box, Badge, BadgeProps } from '@mui/material';
 import { NavLink, useLocation, useNavigate } from 'react-router-dom';
 import NotificationsNoneOutlinedIcon from '@mui/icons-material/NotificationsNoneOutlined';
 import styles from './Navbar.module.css';
@@ -14,6 +14,7 @@ import { getBaseURL, getConfigValueV1 } from 'services/configData';
 import { errorInterceptor, responseInterceptor } from 'services/http';
 import { addHttpRequestsInterceptor } from 'services/http';
 import { routeConfigurations } from 'router';
+import { styled } from '@mui/material/styles';
 
 const OBSRV_WEB_CONSOLE = process.env.REACT_APP_OBSRV_WEB_CONSOLE as string || "/dashboard";
 
@@ -88,6 +89,15 @@ function BasicBreadcrumbs(): JSX.Element {
         return null;
     };
 
+    const StyledBadge = styled(Badge)<BadgeProps>(({ theme }) => ({
+        '& .MuiBadge-badge': {
+          right: -3,
+          top: 6,
+          border: `2px solid ${theme.palette.background.paper}`,
+          padding: '0 4px'
+        },
+      }));
+
     return (pathname !== '/login' ? (
         <Grid container className={styles.navMain} role="presentation" alignItems="center">
             <Grid item xs="auto" className={styles.logo}>
@@ -144,9 +154,9 @@ function BasicBreadcrumbs(): JSX.Element {
                     <Superset />
                 </div>
                 <div className={styles.icons} onClick={toggleNotification}>
-                    <Badge badgeContent={read} color="primary">
+                    <StyledBadge badgeContent={read} color="primary">
                         <NotificationsNoneOutlinedIcon />
-                    </Badge>
+                    </StyledBadge>
                 </div>
             </Grid>
             <Grid className={styles.alertNotification}>

diff --git a/web-console-v2/src/data/Charts/processingMetaData.tsx b/web-console-v2/src/data/Charts/processingMetaData.tsx
@@ -27,7 +27,7 @@ export const getProcessingMetaData = (refresh: any) => {
     {
       chart: (
         <ProcessingMetricsCard
-          label="Processing Time (min)"
+          label="Processing Time (Min)"
           description="This chart shows the minimum data processing time for today"
           icon={
             <>

diff --git a/web-console-v2/src/data/chartsV1/api.ts b/web-console-v2/src/data/chartsV1/api.ts
@@ -186,7 +186,7 @@ export default {
                     const endpoint = _.get(payload, 'metric.exported_endpoint');
                     const name = (endpoint && _.last(_.split(endpoint, "/")));
                     return {
-                        name: name || 'Total Api Calls',
+                        name: name || 'Total API Calls',
                         data: _.get(payload, 'values')
                     }
                 })
@@ -278,7 +278,7 @@ export default {
                     const endpoint = _.get(payload, 'metric.exported_endpoint');
                     const name = (endpoint && _.last(_.split(endpoint, "/")));
                     return {
-                        name: name || 'Total Failed Api Calls',
+                        name: name || 'Total Failed API Calls',
                         data: _.get(payload, 'values')
                     }
                 })
@@ -370,7 +370,7 @@ export default {
                     const endpoint = _.get(payload, 'metric.exported_endpoint');
                     const name = (endpoint && _.last(_.split(endpoint, "/")));
                     return {
-                        name: name || 'Total Api Calls',
+                        name: name || 'Total API Calls',
                         data: _.get(payload, 'values')
                     }
                 })
@@ -462,7 +462,7 @@ export default {
                     const endpoint = _.get(payload, 'metric.exported_endpoint');
                     const name = (endpoint && _.last(_.split(endpoint, "/")));
                     return {
-                        name: name || 'Total Failed Api Calls',
+                        name: name || 'Total Failed API Calls',
                         data: _.get(payload, 'values')
                     }
                 })

diff --git a/web-console-v2/src/pages/ConnectorConfiguration/ConnectorConfiguration.tsx b/web-console-v2/src/pages/ConnectorConfiguration/ConnectorConfiguration.tsx
@@ -136,7 +136,7 @@ const ConnectorConfiguration: React.FC = () => {
                     const apiSchema = connectorData.ui_spec;
                     if (apiSchema) {
                         setSchema(transformSchema(apiSchema));
-                        setHelpSectionContent(apiSchema);
+                        setHelpSectionContent(apiSchema, _.toLower(connectorData.category));
                         setErrorMessage(null);
                         setFormErrors([])
                         setFormData(_.get(dataset.data.connectors_config[0], 'connector_config'));
@@ -151,7 +151,7 @@ const ConnectorConfiguration: React.FC = () => {
             const apiSchema = readConnector.data.ui_spec;
             if (apiSchema) {
                 setSchema(transformSchema(apiSchema));
-                setHelpSectionContent(apiSchema);
+                setHelpSectionContent(apiSchema, _.toLower(readConnector.data.category));
                 setErrorMessage(null);
             } else {
                 setErrorMessage('uiSchema for this connector type not available.  Please contact administrator');
@@ -174,7 +174,7 @@ const ConnectorConfiguration: React.FC = () => {
         }
     };
 
-    const setHelpSectionContent = (schema: any): string[] => {
+    const setHelpSectionContent = (schema: any, connectorType: string): string[] => {
 
         const combinedHelp: string[] = [];
         if (schema?.properties) {
@@ -215,7 +215,7 @@ const ConnectorConfiguration: React.FC = () => {
                                 <li><strong>Periodic:</strong> Runs the connector at regular intervals, based on the specified polling frequency. Use this option if you need the connector to fetch data repeatedly.</li>
                                 <li><strong>Once:</strong> Runs the connector a single time. Use this option for a one-time data fetch.</li>
                             </ul>
-                            <p>Select the appropriate option based on your data requirements.</p>
+                            <p>Select the appropriate option based on your data requirements. For now only periodic is supported</p>
                         </div>
                     </section>
                     <section id="op_schedule" class="section">
@@ -395,7 +395,6 @@ const ConnectorConfiguration: React.FC = () => {
                                                 fullWidth
                                             >
                                                 <MenuItem value={'Periodic'}>Periodic</MenuItem>
-                                                <MenuItem value={'Once'}>Once</MenuItem>
                                             </Select>
                                         </FormControl>
                                     </Grid>

diff --git a/web-console-v2/src/pages/ConnectorConfiguration/Schema.ts b/web-console-v2/src/pages/ConnectorConfiguration/Schema.ts
diff --git a/web-console-v2/src/pages/Dashboard/metrics.tsx b/web-console-v2/src/pages/Dashboard/metrics.tsx
@@ -222,22 +222,22 @@ export const metricsMetadata = [
               {
                 id: "apiHealth",
                 description: "Shows the Http Requests Health. If the API failure percentage is above 1%, then it's Unhealthy",
-                chart: (<MetricsCard label="Api health" query={_.get(chartMeta, 'api_health_data_in.query')} />)
+                chart: (<MetricsCard label="API health" query={_.get(chartMeta, 'api_health_data_in.query')} />)
               },
               {
                 id: "apiResponseTime",
                 description: "Shows the API Response time for today",
-                chart: <MetricsCard label="Api Response Time" query={_.get(chartMeta, 'node_query_response_time_avg_data_in.query')} />
+                chart: <MetricsCard label="API Response Time" query={_.get(chartMeta, 'node_query_response_time_avg_data_in.query')} />
               },
               {
                 id: "apiMaxResponseTime",
                 description: "Shows the max API Response time for today",
-                chart: <MetricsCard label="Api Response Time (Max)" query={_.get(chartMeta, 'node_query_response_time_max_data_in.query')} />
+                chart: <MetricsCard label="API Response Time (Max)" query={_.get(chartMeta, 'node_query_response_time_max_data_in.query')} />
               },
               {
                 id: "apiFailurePercentage",
                 description: "Shows the api failure percentage for today",
-                chart: <MetricsCard label="Api Failure Percentage" query={_.get(chartMeta, 'api_failure_percent_data_in.query')} suffix="%" />
+                chart: <MetricsCard label="API Failure Percentage" query={_.get(chartMeta, 'api_failure_percent_data_in.query')} suffix="%" />
               },
               {
                 id: "apiFiftyPercentile",
@@ -306,22 +306,22 @@ export const metricsMetadata = [
               {
                 id: "apiHealth",
                 description: "Shows the Http Requests Health. If the API failure percentage is above 1%, then it's Unhealthy",
-                chart: <MetricsCard label="Api Health" query={_.get(chartMeta, 'api_health_data_out.query')} />
+                chart: <MetricsCard label="API Health" query={_.get(chartMeta, 'api_health_data_out.query')} />
               },
               {
                 id: "apiResponseTime",
                 description: "Shows the API Response time for today",
-                chart: <MetricsCard label="Api Response Time" query={_.get(chartMeta, 'node_query_response_time_avg_data_out.query')} />
+                chart: <MetricsCard label="API Response Time" query={_.get(chartMeta, 'node_query_response_time_avg_data_out.query')} />
               },
               {
                 id: "apiMaxResponseTime",
                 description: "Shows the max API Response time for today",
-                chart: <MetricsCard label="Api Response Time (Max)" query={_.get(chartMeta, 'node_query_response_time_max_data_out.query')} />
+                chart: <MetricsCard label="API Response Time (Max)" query={_.get(chartMeta, 'node_query_response_time_max_data_out.query')} />
               },
               {
                 id: "apiFailurePercentage",
                 description: "Shows the api failure percentage for today",
-                chart: <MetricsCard label="Api Failure Percentage" query={_.get(chartMeta, 'api_failure_percent_data_out.query')} suffix="%" />
+                chart: <MetricsCard label="API Failure Percentage" query={_.get(chartMeta, 'api_failure_percent_data_out.query')} suffix="%" />
               },
               {
                 id: "apiFiftyPercentile",

diff --git a/web-console-v2/src/pages/SelectConnector/SelectConnector.tsx b/web-console-v2/src/pages/SelectConnector/SelectConnector.tsx
@@ -119,7 +119,7 @@ const SelectConnector = () => {
     return (
         <>
             {isPending ? (
-                <Loader loading={isPending} descriptionText="Loading the page" />
+                <Loader loading={isPending} descriptionText="Please wait while we process your request." />
             ) : (
                 <div className={styles.selectConnector}>
                     <Typography variant="h1" className={styles.mainInfo} lineHeight="2.125rem">