gitlab: setting eslint

Signed-off-by: Victor Login <batazor@evrone.com>
shortlink-org · Jun 19, 2023 · f34b55c · f34b55c
1 parent ea83466
commit f34b55c
Show file tree

Hide file tree

Showing 11 changed files with 122 additions and 85 deletions.
diff --git a/ops/gitlab/pipelines/ui/stages/test.yml b/ops/gitlab/pipelines/ui/stages/test.yml
@@ -1,3 +1,14 @@
+# Common ===============================================================================================================
+lint:
+  extends: .nx
+  stage: test
+  script:
+    - npx nx run-many --target=lint:gitlab --all --parallel
+  allow_failure: true
+  artifacts:
+    reports:
+      codequality: ./ui/nx-monorepo/gl-codequality.json
+
 # LANDINGS =============================================================================================================
 
 ui:landing:

diff --git a/ui/nx-monorepo/package-lock.json b/ui/nx-monorepo/package-lock.json
diff --git a/ui/nx-monorepo/package.json b/ui/nx-monorepo/package.json
@@ -33,6 +33,7 @@
     "@types/react-is": "18.2.0",
     "eslint": "^8.43.0",
     "eslint-config-shortlink": "*",
+    "eslint-formatter-gitlab": "^4.0.0",
     "eslint-plugin-cypress": "^2.13.3",
     "eslint-plugin-jest-dom": "^5.0.1",
     "eslint-plugin-jsx-a11y": "^6.7.1",

diff --git a/ui/nx-monorepo/packages/landing/package.json b/ui/nx-monorepo/packages/landing/package.json
@@ -9,6 +9,7 @@
     "export": "npx next export",
     "lint": "npx eslint ./ --max-warnings 0 --report-unused-disable-directives --cache",
     "lint:fix": "npm run lint -- --fix",
+    "lint:gitlab": "npm run lint -- --format gitlab",
     "prettier": "npx prettier -w -c .",
     "cypress": "NODE_ENV=test npx cypress open",
     "cypress:headless": "NODE_ENV=test cypress run"

diff --git a/ui/nx-monorepo/packages/next/components/PriceTable/PricingToggle.tsx b/ui/nx-monorepo/packages/next/components/PriceTable/PricingToggle.tsx
@@ -8,50 +8,46 @@ type PricingToggleProps = {
 const PricingToggle: React.FC<PricingToggleProps> = ({
   isAnnual,
   setIsAnnual,
-}) => {
-  return (
-    <div className="flex justify-center max-w-[14rem] m-auto mb-8 lg:mb-16">
-      <div className="relative flex w-full p-1 bg-white dark:bg-slate-900 rounded-full">
+}) => (
+  <div className="flex justify-center max-w-[14rem] m-auto mb-8 lg:mb-16">
+    <div className="relative flex w-full p-1 bg-white dark:bg-slate-900 rounded-full">
+      <span
+        className="absolute inset-0 m-1 pointer-events-none"
+        aria-hidden="true"
+      >
         <span
-          className="absolute inset-0 m-1 pointer-events-none"
-          aria-hidden="true"
-        >
-          <span
-            className={`absolute inset-0 w-1/2 bg-indigo-500 rounded-full shadow-sm shadow-indigo-950/10 transform transition-transform duration-150 ease-in-out ${
-              isAnnual ? 'translate-x-0' : 'translate-x-full'
-            }`}
-          />
-        </span>
-        <button
-          type="button"
-          className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
-            isAnnual ? 'text-white' : 'text-slate-500 dark:text-slate-400'
-          }`}
-          onClick={() => setIsAnnual(true)}
-        >
-          Yearly
-          <span
-            className={
-              isAnnual
-                ? 'text-indigo-200'
-                : 'text-slate-400 dark:text-slate-500'
-            }
-          >
-            -20%
-          </span>
-        </button>
-        <button
-          type="button"
-          className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
-            isAnnual ? 'text-slate-500 dark:text-slate-400' : 'text-white'
+          className={`absolute inset-0 w-1/2 bg-indigo-500 rounded-full shadow-sm shadow-indigo-950/10 transform transition-transform duration-150 ease-in-out ${
+            isAnnual ? 'translate-x-0' : 'translate-x-full'
           }`}
-          onClick={() => setIsAnnual(false)}
+        />
+      </span>
+      <button
+        type="button"
+        className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
+          isAnnual ? 'text-white' : 'text-slate-500 dark:text-slate-400'
+        }`}
+        onClick={() => setIsAnnual(true)}
+      >
+        Yearly
+        <span
+          className={
+            isAnnual ? 'text-indigo-200' : 'text-slate-400 dark:text-slate-500'
+          }
         >
-          Monthly
-        </button>
-      </div>
+          -20%
+        </span>
+      </button>
+      <button
+        type="button"
+        className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
+          isAnnual ? 'text-slate-500 dark:text-slate-400' : 'text-white'
+        }`}
+        onClick={() => setIsAnnual(false)}
+      >
+        Monthly
+      </button>
     </div>
-  )
-}
+  </div>
+)
 
 export default PricingToggle
diff --git a/ui/nx-monorepo/packages/next/package.json b/ui/nx-monorepo/packages/next/package.json
@@ -17,6 +17,7 @@
     "prettier": "npx prettier -w -c .",
     "lint": "npx eslint ./ --max-warnings 0 --report-unused-disable-directives --cache",
     "lint:fix": "npm run lint -- --fix",
+    "lint:gitlab": "npm run lint -- --format gitlab",
     "swagger": "npx swagger-typescript-api -p ../../api/swagger.json -o ./store/api -d -r --modular --axios",
     "sitemap": "npx next-sitemap --config config/sitemap.config.js",
     "cypress": "NODE_ENV=test npx cypress open",

diff --git a/ui/nx-monorepo/packages/next/pages/pricing.tsx b/ui/nx-monorepo/packages/next/pages/pricing.tsx
@@ -1,8 +1,8 @@
 import Container from '@mui/material/Container'
 import Typography from '@mui/material/Typography'
-import { ArticleJsonLd, NextSeo } from 'next-seo'
 // @ts-ignore
 import { PriceTable } from '@shortlink-org/ui-kit'
+import { ArticleJsonLd, NextSeo } from 'next-seo'
 
 import { Layout } from 'components'
 import Discounted from 'components/Billing/Discounted'

diff --git a/ui/nx-monorepo/packages/next/public/sw.js.map b/ui/nx-monorepo/packages/next/public/sw.js.map
diff --git a/ui/nx-monorepo/packages/ui-kit/package.json b/ui/nx-monorepo/packages/ui-kit/package.json
@@ -15,6 +15,7 @@
     "test": "NODE_ENV=test jest",
     "lint": "npx eslint ./ --max-warnings 0 --report-unused-disable-directives --cache",
     "lint:fix": "npm run lint -- --fix",
+    "lint:gitlab": "npm run lint -- --format gitlab",
     "prettier": "npx prettier -w -c .",
     "chromatic": "npx chromatic --project-token=secret"
   },

diff --git a/ui/nx-monorepo/packages/ui-kit/src/effect/Spotlight/Spotlight.tsx b/ui/nx-monorepo/packages/ui-kit/src/effect/Spotlight/Spotlight.tsx
@@ -33,7 +33,7 @@ export function Spotlight({ children, className = '' }: SpotlightProps) {
 
   useEffect(() => {
     onMouseMove()
-  }, [mousePosition])
+  }, [mousePosition]) // eslint-disable-line react-hooks/exhaustive-deps
 
   const initContainer = () => {
     if (containerRef.current) {
@@ -63,6 +63,7 @@ export function Spotlight({ children, className = '' }: SpotlightProps) {
       }
     }
   }
+
   return (
     <div className={className} ref={containerRef}>
       {children}

diff --git a/ui/nx-monorepo/packages/ui-kit/src/page/PriceTable/PricingToggle.tsx b/ui/nx-monorepo/packages/ui-kit/src/page/PriceTable/PricingToggle.tsx
@@ -8,50 +8,46 @@ type PricingToggleProps = {
 const PricingToggle: React.FC<PricingToggleProps> = ({
   isAnnual,
   setIsAnnual,
-}) => {
-  return (
-    <div className="flex justify-center max-w-[14rem] m-auto mb-8 lg:mb-16">
-      <div className="relative flex w-full p-1 bg-white dark:bg-slate-900 rounded-full">
+}) => (
+  <div className="flex justify-center max-w-[14rem] m-auto mb-8 lg:mb-16">
+    <div className="relative flex w-full p-1 bg-white dark:bg-slate-900 rounded-full">
+      <span
+        className="absolute inset-0 m-1 pointer-events-none"
+        aria-hidden="true"
+      >
         <span
-          className="absolute inset-0 m-1 pointer-events-none"
-          aria-hidden="true"
-        >
-          <span
-            className={`absolute inset-0 w-1/2 bg-indigo-500 rounded-full shadow-sm shadow-indigo-950/10 transform transition-transform duration-150 ease-in-out ${
-              isAnnual ? 'translate-x-0' : 'translate-x-full'
-            }`}
-          />
-        </span>
-        <button
-          type="button"
-          className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
-            isAnnual ? 'text-white' : 'text-slate-500 dark:text-slate-400'
-          }`}
-          onClick={() => setIsAnnual(true)}
-        >
-          Yearly
-          <span
-            className={
-              isAnnual
-                ? 'text-indigo-200'
-                : 'text-slate-400 dark:text-slate-500'
-            }
-          >
-            -20%
-          </span>
-        </button>
-        <button
-          type="button"
-          className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
-            isAnnual ? 'text-slate-500 dark:text-slate-400' : 'text-white'
+          className={`absolute inset-0 w-1/2 bg-indigo-500 rounded-full shadow-sm shadow-indigo-950/10 transform transition-transform duration-150 ease-in-out ${
+            isAnnual ? 'translate-x-0' : 'translate-x-full'
           }`}
-          onClick={() => setIsAnnual(false)}
+        />
+      </span>
+      <button
+        type="button"
+        className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
+          isAnnual ? 'text-white' : 'text-slate-500 dark:text-slate-400'
+        }`}
+        onClick={() => setIsAnnual(true)}
+      >
+        Yearly
+        <span
+          className={
+            isAnnual ? 'text-indigo-200' : 'text-slate-400 dark:text-slate-500'
+          }
         >
-          Monthly
-        </button>
-      </div>
+          -20%
+        </span>
+      </button>
+      <button
+        type="button"
+        className={`relative flex-1 text-sm font-medium h-8 rounded-full focus-visible:outline-none focus-visible:ring focus-visible:ring-indigo-300 dark:focus-visible:ring-slate-600 transition-colors duration-150 ease-in-out ${
+          isAnnual ? 'text-slate-500 dark:text-slate-400' : 'text-white'
+        }`}
+        onClick={() => setIsAnnual(false)}
+      >
+        Monthly
+      </button>
     </div>
-  )
-}
+  </div>
+)
 
 export default PricingToggle