Merge pull request #5572 from surajgjadhav/fix/surajgjadhav/5570

fix(5570): ESLint version rollback with some linting fix

package.json

@@ -115,7 +115,8 @@
     "cpx": "^1.5.0",
     "cross-env": "^7.0.0",
     "env-cmd": "^10.1.0",
-    "eslint": "^9.4.0",
+    "eslint": "^8.57.0",
+    "eslint-plugin-react": "^7.34.2",
     "gatsby-plugin-webpack-bundle-analyser-v2": "^1.1.30",
     "gh-pages": "^6.1.1",
     "husky": "^8.0.3",

src/components/specs/data-card.js

@@ -1,11 +1,6 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
 import styled from "styled-components";
-import LifeCycleIcon from "./images/lifecycle-icon.svg";
-import PerformanceIcon from "./images/performance-icon.svg";
-import ConfigurationIcon from "./images/configuration-icon.svg";
 import { Col, Row } from "../../reusecore/Layout";
-import Counter from "../../reusecore/Counter";
-import { URL } from "../../sections/Counters/index";
 import List_Icon from "../../assets/images/app/tick.svg";
 
 const DataCardWrapper = styled.div`
@@ -47,13 +42,6 @@ const DataCardWrapper = styled.div`
 `;
 
 const DataCard = () => {
-  const [performanceCount, setPerformanceCount] = useState(0);
-
-  useEffect(() => {
-    fetch(URL)
-      .then((response) => response.json())
-      .then((result) => setPerformanceCount(result.total_runs));
-  }, []);
 
   return (
     <DataCardWrapper>

src/pages/index.js

@@ -8,11 +8,11 @@ import loadable from "@loadable/component";
 import CornerPopup from "../components/Corner-popup";
 const CloudNativeManagement = loadable(() => import("../sections/Home/CloudNativeManagement"));
 const SubscribeSection = loadable(() => import("../sections/subscribe/subscribe"));
-const ServiceMeshFocussed = loadable(() => import("../sections/Home/Service-mesh-focussed"));
+// const ServiceMeshFocussed = loadable(() => import("../sections/Home/Service-mesh-focussed"));
 import CaseStudyBanner from "../components/Case-study-banner";
 
-const EngineerEnabler = loadable(() => import("../sections/Home/Engineer-enabler"));
-const SoSpecial = loadable(() => import("../sections/Home/So-Special-Section"));
+// const EngineerEnabler = loadable(() => import("../sections/Home/Engineer-enabler"));
+// const SoSpecial = loadable(() => import("../sections/Home/So-Special-Section"));
 const MesheryIntegration = loadable(() => import("../sections/Meshery/Meshery-integrations"));
 const FeaturesContainer = loadable(() => import("../sections/Home/FeaturesContainer"));
 

src/sections/CloudNativeDeployments/features.js

@@ -1,8 +1,6 @@
 import React from "react";
 import styled from "styled-components";
-import { StaticImage } from "gatsby-plugin-image";
 import { Link } from "gatsby";
-const docker_ext = "../../assets/images/docker-extension/docker-extension-meshery.webp";
 import meshery_visualizer from "./images/meshery_visualizer.svg";
 import meshery_designer from "./images/meshery_designer.svg";
 import CatalogsLight from "../../assets/images/catalog/catalog-light.svg";

src/sections/Developer-Infrastructure/features.js

@@ -1,11 +1,9 @@
 import React from "react";
 import styled from "styled-components";
-import { StaticImage } from "gatsby-plugin-image";
 import { Link } from "gatsby";
 import orchestration_svg from "./images/orchestration.svg";
 import whiteboard from "./images/whiteboard-1e9f33293030bc98a01945af9740863f.png";
 import { Container, Row, Col } from "../../reusecore/Layout";
-import { useStyledDarkMode } from "../../theme/app/useStyledDarkMode";
 
 const FeatureWrapper = styled.div`
   min-height: fit-content;
@@ -123,8 +121,6 @@ const FeatureWrapper = styled.div`
 
 const Feature = () => {
 
-  const { isDark } = useStyledDarkMode();
-
   return (
     <FeatureWrapper>
       <Container className="catalog-container">

src/sections/Home/So-Special-Section/index.js

@@ -7,7 +7,7 @@ import SoSpecialWrapper from "./so-special-style";
 import Button from "../../../reusecore/Button";
 import { graphql, useStaticQuery } from "gatsby";
 import Image from "../../../components/image";
-import { useStyledDarkMode } from "../../../theme/app/useStyledDarkMode";
+// import { useStyledDarkMode } from "../../../theme/app/useStyledDarkMode";
 
 const SoSpecial = () => {
   const data = useStaticQuery(
@@ -98,7 +98,7 @@ const SoSpecial = () => {
     ]
   };
 
-  const { isDark } = useStyledDarkMode();
+  // const { isDark } = useStyledDarkMode();
 
   return (
     <SoSpecialWrapper>

src/sections/Meshery/How-meshery-works/specs/index.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { Container, Col, Row } from "../../../../reusecore/Layout";
-import MesheryImage1 from "../images/cloud-native-journey.webp";
-import MesheryImage2 from "../images/meshery-configuration-management.webp";
+// import MesheryImage1 from "../images/cloud-native-journey.webp";
+// import MesheryImage2 from "../images/meshery-configuration-management.webp";
 import GreenBubble from "../images/green-bubble.svg";
 import YellowBubble from "../images/yellow-bubble.svg";
 import DataCard from "./data-card";

src/sections/Projects/Sistent/about.js

@@ -1,4 +1,4 @@
-import React, { useSyncExternalStore } from "react";
+import React from "react";
 import { Container } from "../../../reusecore/Layout";
 import SistentWrapper from "./sistent.style";
 import TOC from "../../../components/SistentNavigation";

src/sections/kubernetes-multi-cluster/features.js

@@ -6,7 +6,6 @@ const docker_ext = "../../assets/images/docker-extension/docker-extension-mesher
 import meshery_operator from "../../assets/images/meshery-operator/meshery-operator-dark.svg";
 import meshsync from "./images/meshsync.svg";
 import { Container, Row, Col } from "../../reusecore/Layout";
-import { useStyledDarkMode } from "../../theme/app/useStyledDarkMode";
 
 const FeatureWrapper = styled.div`
   min-height: fit-content;
@@ -127,7 +126,6 @@ const FeatureWrapper = styled.div`
 
 const Feature = () => {
 
-  const { isDark } = useStyledDarkMode();
 
   return (
     <FeatureWrapper>