Skip to content

fix: update performance tests counter to use camelCase API Key #7870

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Sumedh-6504 wants to merge 4 commits into
base: master
Choose a base branch
from
Open

fix: update performance tests counter to use camelCase API Key #7870

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
96a163f
fix: update performance tests counter to use camelCase API Key
Sumedh-6504 Jul 14, 2026
25f7371
Merge branch 'master' into fix/performance-runs-counter
Sumedh-6504 Jul 16, 2026
3e43f0c
Merge branch 'master' into fix/performance-runs-counter
Sumedh-6504 Jul 17, 2026
1011daf
Merge branch 'master' into fix/performance-runs-counter
Sumedh-6504 Jul 20, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions onRenderBody.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const themes = { light: lighttheme, dark: darktheme };
const MagicScriptTag = (props) => {
// FIX: Stringify the theme object outside the template literal to prevent syntax errors caused by unescaped quotes inside theme values.
const themeJSON = JSON.stringify(props.theme);

// Injects CSS variables and theme state strictly before the first paint to prevent FOUC.
const codeToRunOnClient = `
(function() {
Expand Down Expand Up @@ -75,6 +75,6 @@ const MagicScriptTag = (props) => {

// FIX: Using setHeadComponents instead of setPreBodyComponents ensures the script runs
// strictly in the <head>, blocking the first paint until the theme is applied and completely eliminating FOUC.
export const onRenderBody = ( { setHeadComponents }) => {
export const onRenderBody = ({ setHeadComponents }) => {
setHeadComponents([<MagicScriptTag key="theme-injection" theme={themes} />]);
};
};
33 changes: 14 additions & 19 deletions src/components/MeetInfo-Table/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,29 +3,24 @@ import { useTable } from "react-table";
import { TableWrapper } from "./MeetInfoTable.style";

const Table = ({ columns, data, showHeader = true }) => {
const {
getTableProps,
getTableBodyProps,
headerGroups,
rows,
prepareRow,
} = useTable({
columns,
data,
});
const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } =
useTable({
columns,
data,
});

return (
<TableWrapper>
{showHeader && (
<>
<h1 className="meetings-table-title">
<a href="#meetings">Layer5 Meetings</a>
</h1>
<h3 className="meetings-table-subtitle">
Everyone is welcome to join. Engage!
</h3>
</>
)}
<>
<h1 className="meetings-table-title">
<a href="#meetings">Layer5 Meetings</a>
</h1>
<h3 className="meetings-table-subtitle">
Everyone is welcome to join. Engage!
</h3>
</>
)}
<table name="meetings" id="meetings" {...getTableProps()}>
<thead>
{headerGroups.map((headerGroup) => (
Expand Down
9 changes: 7 additions & 2 deletions src/sections/Counters/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,13 @@ const Counters = () => {

useEffect(() => {
fetch(URL)
.then(response => response.json())
.then(result => setPerformanceCount(result.total_runs));
.then((response) => response.json())
.then((result) =>
setPerformanceCount(result.totalRuns || result.total_runs),
)
.catch((error) => {
console.error("Failed to fetch performance count:", error.message);
});
}, []);

return (
Expand Down
174 changes: 132 additions & 42 deletions src/sections/Meshery/Features-Col/data/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,76 +14,164 @@ const LifecycleFeature = () => {
}
`);


const lifecycleFeatureData = {
name: "Lifecycle",
description: "Manage and operate your cloud native infra from discovery to deployment.",
description:
"Manage and operate your cloud native infra from discovery to deployment.",
link: "#",
btnText: "Discover your clusters",
services: [
{ content: "Multi-cluster operations from a central console", className: "--on" },
{ content: "Discover, deploy, and visualize Kubernetes clusters", className: "--on" },
{ content: "Dry-run capabilities and change previews in pull requests", className: "--on" },
{ content: "Meshery CLI (mesheryctl) for streamlined cluster ops", className: "--on" },
{ content: "Bulk import of infrastructure as code from GitHub", className: "--on" },
{ content: "Helm chart generation and environment configuration", className: "--on" },
{ content: "Workspaces for centralized team and project management", className: "--on" },
{ content: "Environments for grouped resource access and control", className: "--on" },
{ content: "GitOps snapshots and insights in pull requests", className: "--on" },
{ content: "Role-based access control and multi-tenant support", className: "--on" }
{
content: "Multi-cluster operations from a central console",
className: "--on",
},
{
content: "Discover, deploy, and visualize Kubernetes clusters",
className: "--on",
},
{
content: "Dry-run capabilities and change previews in pull requests",
className: "--on",
},
{
content: "Meshery CLI (mesheryctl) for streamlined cluster ops",
className: "--on",
},
{
content: "Bulk import of infrastructure as code from GitHub",
className: "--on",
},
{
content: "Helm chart generation and environment configuration",
className: "--on",
},
{
content: "Workspaces for centralized team and project management",
className: "--on",
},
{
content: "Environments for grouped resource access and control",
className: "--on",
},
{
content: "GitOps snapshots and insights in pull requests",
className: "--on",
},
{
content: "Role-based access control and multi-tenant support",
className: "--on",
},
],
count: {
value: 300,
description: "cloud native integrations"
}
description: "cloud native integrations",
},
};


const configurationFeatureData = {
name: "Configuration",
description: "Design, validate, and version your infra with visual tools and best practices.",
description:
"Design, validate, and version your infra with visual tools and best practices.",
link: "#",
btnText: "Get Started",
services: [
{ content: "Drag-and-drop infrastructure designer (Kanvas)", className: "--on" },
{ content: "400+ reusable design templates and patterns", className: "--on" },
{ content: "Define semantic and non-semantic relationships visually", className: "--on" },
{ content: "Export designs: Kubernetes, Helm, Docker Compose, OCI", className: "--on" },
{ content: "Static validation and OPA-based policy enforcement", className: "--on" },
{ content: "Version control and inline design review tools", className: "--on" },
{
content: "Drag-and-drop infrastructure designer (Kanvas)",
className: "--on",
},
{
content: "400+ reusable design templates and patterns",
className: "--on",
},
{
content: "Define semantic and non-semantic relationships visually",
className: "--on",
},
{
content: "Export designs: Kubernetes, Helm, Docker Compose, OCI",
className: "--on",
},
{
content: "Static validation and OPA-based policy enforcement",
className: "--on",
},
{
content: "Version control and inline design review tools",
className: "--on",
},
{ content: "Custom models with OCI registry support", className: "--on" },
{ content: "Web terminal for direct container/pod access", className: "--on" },
{ content: "Extension points: gRPC adapters, hot-loadable React and Golang plugins", className: "--on" },
{ content: "REST and GraphQL APIs for platform extensibility", className: "--on" }
{
content: "Web terminal for direct container/pod access",
className: "--on",
},
{
content:
"Extension points: gRPC adapters, hot-loadable React and Golang plugins",
className: "--on",
},
{
content: "REST and GraphQL APIs for platform extensibility",
className: "--on",
},
],
count: {
value: 1500,
description: "standardized components"
}
description: "standardized components",
},
};


const performanceFeatureData = {
name: "Optimization",
description: "Assess, benchmark, and improve the performance of your infra.",
description:
"Assess, benchmark, and improve the performance of your infra.",
link: "#",
btnText: "Start Performance Testing",
services: [
{ content: "Performance profiles for consistent benchmarking", className: "--on" },
{ content: "Built-in load generators: Fortio, Wrk2, Nighthawk", className: "--on" },
{ content: "Comparative testing with visual result analysis", className: "--on" },
{ content: "Statistical reporting: latency histograms, buckets", className: "--on" },
{ content: "Cloud Native Performance spec compliance", className: "--on" },
{ content: "Historical performance tracking across versions", className: "--on" },
{ content: "Prometheus and Grafana integration for metrics", className: "--on" },
{ content: "Support for soak, burst, and capacity tests", className: "--on" },
{ content: "HTTP, TCP, and gRPC load generation support", className: "--on" },
{ content: "Behavioral comparison of CNFs across deployments", className: "--on" }
{
content: "Performance profiles for consistent benchmarking",
className: "--on",
},
{
content: "Built-in load generators: Fortio, Wrk2, Nighthawk",
className: "--on",
},
{
content: "Comparative testing with visual result analysis",
className: "--on",
},
{
content: "Statistical reporting: latency histograms, buckets",
className: "--on",
},
{
content: "Cloud Native Performance spec compliance",
className: "--on",
},
{
content: "Historical performance tracking across versions",
className: "--on",
},
{
content: "Prometheus and Grafana integration for metrics",
className: "--on",
},
{
content: "Support for soak, burst, and capacity tests",
className: "--on",
},
{
content: "HTTP, TCP, and gRPC load generation support",
className: "--on",
},
{
content: "Behavioral comparison of CNFs across deployments",
className: "--on",
},
],
count: {
value: 0,
description: "performance tests run"
}
description: "performance tests run",
},
};

// const collaborationFeatureData = {
Expand Down Expand Up @@ -127,7 +215,9 @@ const LifecycleFeature = () => {

// Count the total number of integrations
const totalIntegrations =
Math.ceil(integrations.allMdx.totalCount / 10) * 10;
integrations.allMdx.totalCount > 0
? Math.ceil(integrations.allMdx.totalCount / 10) * 10
: lifecycleFeatureData.count.value;

// Update the count value in lifecycleFeatureData
const lifecycleFeatureDataUpdated = {
Expand Down
43 changes: 33 additions & 10 deletions src/sections/Meshery/Features-Col/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,22 @@ function getServiceFeature(service, index) {
<tbody>
<tr>
<td className="icon">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="none" viewBox="0 0 40 40"><rect width="40" height="40" fill="#C9FCF6" rx="5" /><path stroke="#00B39F" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M28 14L17 25L12 20" /></svg>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
fill="none"
viewBox="0 0 40 40"
>
<rect width="40" height="40" fill="#C9FCF6" rx="5" />
<path
stroke="#00B39F"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M28 14L17 25L12 20"
/>
</svg>
</td>
<td className="service">{service.content}</td>
</tr>
Expand All @@ -38,7 +53,7 @@ function getFeatureBlock(feature, index, performanceCount) {
</FeatureTitleInfoContainer>
<FeatureInfoContainer>
{feature.services.map((service, index) =>
getServiceFeature(service, index)
getServiceFeature(service, index),
)}
</FeatureInfoContainer>
<CountBlockContainer>
Expand All @@ -49,7 +64,12 @@ function getFeatureBlock(feature, index, performanceCount) {
end={
feature.count.value !== 0 ? feature.count.value : performanceCount
}
suffix= {(feature.count.description == "components" || feature.count.description == "cloud native integrations") ? "+" : " "}
suffix={
feature.count.description == "components" ||
feature.count.description == "cloud native integrations"
? "+"
: " "
}
/>
</h1>
<p className="count-desc">{feature.count.description}</p>
Expand All @@ -60,7 +80,8 @@ function getFeatureBlock(feature, index, performanceCount) {

const Features = () => {
const [performanceCount, setPerformanceCount] = useState(0);
const performanceCountEndpoint = "https://cloud.layer5.io/api/performance/results/total";
const performanceCountEndpoint =
"https://cloud.layer5.io/api/performance/results/total";

useEffect(() => {
fetch(performanceCountEndpoint)
Expand All @@ -72,13 +93,16 @@ const Features = () => {
return response.json();
})
.then((resultcount) => {
if (resultcount && typeof resultcount.total_runs === "number") {
setPerformanceCount(resultcount.total_runs);
const count = resultcount
? resultcount.totalRuns || resultcount.total_runs
: undefined;
if (typeof count === "number") {
setPerformanceCount(count);
}
})
.catch((error) => {
console.log("Failed to fetch performance count:", error.message);
// Keep default value of 0 if fetch fails
console.error("Failed to fetch performance count:", error.message);
// Keep default value of 0 if fetch fails
});
}, []);

Expand All @@ -94,12 +118,11 @@ const Features = () => {
</TitleContainer>
<FeaturesSectionContainer>
{data.map((feature, index) =>
getFeatureBlock(feature, index, performanceCount)
getFeatureBlock(feature, index, performanceCount),
)}
</FeaturesSectionContainer>
</FeaturesSectionWrapper>
);
};


export default Features;
Loading