fix(all): eslint enavled on exmple + fix all lint problem

.eslintrc

@@ -1,18 +1,31 @@
 {
+  "overrides": [
+    {
+      "files": [
+        "example/**/*.ts",
+        "example/**/*.tsx"
+      ]
+    }
+  ],
   "parser": "@typescript-eslint/parser",
   "plugins": [
     "sonarjs",
     "@typescript-eslint",
-    "jest"
+    "jest",
+    "cypress"
   ],
   "extends": [
     "standard",
     "standard-react",
     "plugin:sonarjs/recommended",
+    "plugin:cypress/recommended"
   ],
   "env": {
+    "browser": true,
+    "es2021": true,
     "node": true,
-    "jest": true
+    "jest": true,
+    "cypress/globals": true
   },
   "parserOptions": {
     "ecmaVersion": 2020,
@@ -28,6 +41,8 @@
   },
   "rules": {
     "no-unused-vars": "off",
+    "cypress/unsafe-to-chain-command": "off",
+    "sonarjs/no-duplicate-string": "off",
     "@typescript-eslint/no-unused-vars": [
       "error",
       {

example/.eslintignore

@@ -0,0 +1 @@
+cypress

example/cypress.config.ts

@@ -1,12 +1,12 @@
-import { defineConfig } from "cypress";
+import { defineConfig } from 'cypress'
 
 export default defineConfig({
   component: {
     devServer: {
-      framework: "react",
-      bundler: "vite",
+      framework: 'react',
+      bundler: 'vite'
     },
     viewportWidth: 1200,
     viewportHeight: 800
-  },
-});
+  }
+})

example/cypress/support/commands.ts

@@ -36,16 +36,12 @@
 //   }
 // }
 
+const getTab = (tab: string) => cy.get('[role="tab"]').contains(tab, { matchCase: false })
 
-
-
-const getTab = (tab: string) => cy.get(`[role="tab"]`).contains(tab, { matchCase: false })
-
-const shouldSubmit = (...args: unknown[]) => cy.get('@console-log').should('be.calledWith','Submitted Form', ...args)
+const shouldSubmit = (...args: unknown[]) => cy.get('@console-log').should('be.calledWith', 'Submitted Form', ...args)
 
 const shouldNotSubmit = () => { cy.get('@console-log').should('not.be.called') }
 
 const button = (text: string) => cy.get('button').contains(text, { matchCase: false }).parent()
 
-
-Cypress.Commands.addAll({ button, getTab, shouldSubmit, shouldNotSubmit})
+Cypress.Commands.addAll({ button, getTab, shouldSubmit, shouldNotSubmit })

example/cypress/support/component.tsx

@@ -19,21 +19,19 @@
 // Import commands.js using ES2015 syntax:
 import './commands'
 
+import { mount } from 'cypress/react18'
+
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
 
-
-global.process = global.process || {};
-global.process.env = global.process.env || {};
-
-import { mount } from 'cypress/react18'
-
+global.process = global.process || {}
+global.process.env = global.process.env || {}
 
 Cypress.Commands.add('mount', mount)
 
 beforeEach(() => {
-    cy.spy(window.console, 'log').as('console-log')
+  cy.spy(window.console, 'log').as('console-log')
 })
 
 // Example use:
-// cy.mount(<MyComponent />)
+// cy.mount(<MyComponent />)

example/cypress/support/index.d.ts

@@ -1,4 +1,5 @@
-import { mount } from "cypress/react18";
+/* eslint-disable no-undef */
+import { mount } from 'cypress/react18'
 
 declare global {
     namespace Cypress {
@@ -10,4 +11,4 @@ declare global {
         shouldNotSubmit: () => void
       }
     }
-  }
+  }

example/src/App.tsx

@@ -1,12 +1,12 @@
-import { Tabs } from "@radicalbit/radicalbit-design-system"
+import { Tabs } from '@radicalbit/radicalbit-design-system'
 import { BasicFormContext } from './forms/basic-form-context'
 import { BasicFormHook } from './forms/basic-form-hook'
 import { MultipleStepsForm } from './forms/multiple-steps'
 import { AddableFieldsForm } from './forms/addable-fields'
 import { EditLikeForm } from './forms/edit-like'
-import { FakeApiProvider } from "./forms/context/api-context"
-import FormbitLogo from "./img/formbit-logo.svg"
-import { WriteRemoveAllForm } from "./forms/remove-all"
+import { FakeApiProvider } from './forms/context/api-context'
+import FormbitLogo from './img/formbit-logo.svg'
+import { WriteRemoveAllForm } from './forms/remove-all'
 
 enum EXAMPLES {
   CONTEXT = 'context',
@@ -60,11 +60,11 @@ function App() {
               label: 'Write/Remove All Form',
               key: EXAMPLES.WRITEREMOVEALL,
               children: <WriteRemoveAllForm />
-            },
+            }
           ]} />
       </FakeApiProvider>
     </div>
   )
 }
 
-export default App
+export default App

example/src/__tests__/addable-fields.cy.tsx

@@ -1,118 +1,117 @@
-import App from "../App"
-
+import App from '../App'
 
 describe('<AddableFieldsForm />', () => {
-    beforeEach(() => {
-        cy.mount(<App />)
-        cy.getTab('addable').click()
+  beforeEach(() => {
+    cy.mount(<App />)
+    cy.getTab('addable').click()
+  })
 
-    })
+  it('Name input should exist', () => {
+    cy.get('input').eq(0).should('exist')
+  })
 
-    it('Name input should exist', () => {
-        cy.get('input').eq(0).should('exist')
-    })
+  it('Surname input should exist', () => {
+    cy.get('input').eq(1).should('exist')
+  })
 
-    it('Surname input should exist', () => {
-        cy.get('input').eq(1).should('exist')
-    })
+  it('Add Friend Name input should exist', () => {
+    cy.get('input').eq(2).should('exist')
+  })
 
-    it('Add Friend Name input should exist', () => {
-        cy.get('input').eq(2).should('exist')
-    })
+  it('Add Friend Surname input should exist', () => {
+    cy.get('input').eq(3).should('exist')
+  })
 
-    it('Add Friend Surname input should exist', () => {
-        cy.get('input').eq(3).should('exist')
-    })
+  describe('<Actions />', () => {
+    describe('Submit', () => {
+      beforeEach(() => {
+        cy.get('input').eq(0).as('name')
+        cy.get('input').eq(1).as('surname')
+        cy.get('input').eq(2).as('friendName')
+        cy.get('input').eq(3).as('friendSurname')
+      })
 
-    describe('<Actions />', () => {
-        describe('Submit', () => {
-            beforeEach(() => {
-                cy.get('input').eq(0).as('name')
-                cy.get('input').eq(1).as('surname')
-                cy.get('input').eq(2).as('friendName')
-                cy.get('input').eq(3).as('friendSurname')
-            })
+      it('Submit button should exist', () => {
+        cy.button('submit').should('exist')
+      })
 
-            it('Submit button should exist', () => {
-                cy.button('submit').should('exist')
-            })
+      it('Submit button should be disabled when form is rendered', () => {
+        cy.button('submit').should('be.disabled')
+      })
 
-            it('Submit button should be disabled when form is rendered', () => {
-                cy.button('submit').should("be.disabled")
-            })
+      const friendName = '@friendName'
 
-            it('Should be submittable', () => {
-                cy.get('@name').type('Harry')
-                cy.get('@surname').type('Potter')
-                cy.get('@friendName').type('Ron')
-                cy.get('@friendSurname').type('Weasley')
+      it('Should be submittable', () => {
+        cy.get('@name').type('Harry')
+        cy.get('@surname').type('Potter')
+        cy.get(friendName).type('Ron')
+        cy.get('@friendSurname').type('Weasley')
 
-                cy.get('.c-form-multiple__add').click()
+        cy.get('.c-form-multiple__add').click()
 
+        cy.button('submit').click()
 
-                cy.button('submit').click()
+        cy.shouldSubmit({ name: 'Harry', surname: 'Potter', friends: [{ name: 'Ron', surname: 'Weasley' }] })
+      })
 
-                cy.shouldSubmit({ name: 'Harry', surname: 'Potter', friends: [{ name: 'Ron', surname: 'Weasley' }] })
-            })
+      it('Should not submit form when not valid', () => {
+        cy.get('@name').type('Harry')
+        cy.button('submit').click()
 
-            it('Should not submit form when not valid', () => {
-                cy.get('@name').type('Harry')
-                cy.button('submit').click()
+        cy.shouldNotSubmit()
+      })
+    })
 
-                cy.shouldNotSubmit()
-            })
-        })
+    describe('Reset', () => {
+      beforeEach(() => {
+        cy.get('input').eq(0).as('name')
+        cy.get('input').eq(1).as('surname')
+        cy.get('input').eq(2).as('friendName')
+        cy.get('input').eq(3).as('friendSurname')
+      })
 
-        describe('Reset', () => {
-            beforeEach(() => {
-                cy.get('input').eq(0).as('name')
-                cy.get('input').eq(1).as('surname')
-                cy.get('input').eq(2).as('friendName')
-                cy.get('input').eq(3).as('friendSurname')
-            })
+      it('Reset button should exist', () => {
+        cy.button('reset').should('exist')
+      })
 
-            it('Reset button should exist', () => {
-                cy.button('reset').should('exist')
-            })
+      describe('Can be reset to original state', () => {
+        it('Should reset name field', () => {
+          cy.get('@name').type('Ada')
+          cy.button('reset').click()
 
-            describe('Can be reset to original state', () => {
-                it('Should reset name field', () => {
-                    cy.get('@name').type('Ada')
-                    cy.button('reset').click()
+          cy.get('@name').should('be.empty')
+        })
 
-                    cy.get('@name').should('be.empty')
-                })
+        it('Should reset surname field', () => {
+          cy.get('@surname').type('Lovelace')
+          cy.button('reset').click()
 
-                it('Should reset surname field', () => {
-                    cy.get('@surname').type('Lovelace')
-                    cy.button('reset').click()
+          cy.get('@surname').should('be.empty')
+        })
 
-                    cy.get('@surname').should('be.empty')
-                })
+        const friendName = '@friendName'
 
-                describe('<Friends />', () => {
-                    beforeEach(() => {
-                        cy.get('@friendName').type('Ron')
-                        cy.get('@friendSurname').type('Weasley')
+        describe('<Friends />', () => {
+          beforeEach(() => {
+            cy.get(friendName).type('Ron')
+            cy.get('@friendSurname').type('Weasley')
 
-                        cy.get('.c-form-multiple__add').click()
-                    })
+            cy.get('.c-form-multiple__add').click()
+          })
 
-                    it('Should reset friend name field', () => {
-                        cy.button('reset').click()
+          it('Should reset friend name field', () => {
+            cy.button('reset').click()
 
-                        cy.get('@friendName').should('be.empty')
-                    })
+            cy.get(friendName).should('be.empty')
+          })
 
-                    it('Should reset friend surname field', () => {
-                        cy.button('reset').click()
+          it('Should reset friend surname field', () => {
+            cy.button('reset').click()
 
-                        cy.get('@friendName').should('be.empty')
-                    })
-                })
-            })
+            cy.get(friendName).should('be.empty')
+          })
         })
-
+      })
     })
-
-})
+  })
+})