Skip to content

Commit

Permalink
fix ci/cd (#274)
Browse files Browse the repository at this point in the history
* feat: 🔧 change package manager to pnpm

* chore: 🔧 update linting rules

* style: 🎨 format code

* ci: 👷 update github actions

* ci: 💚 fix github actions

* revert: 🔥 remove build artifacts

* chore: 🔧 fix config

* fix: 🚨 fix lint

* fix: 🐛 fix import

* chore: 🔧 update package.json

remove package manager setting

* change package maneger to pnpm in package.jason

* typo in package.json

---------

Co-authored-by: Filip Skaug <[email protected]>
  • Loading branch information
phibkro and FilipSkaug authored May 1, 2024
1 parent 34c4e83 commit 3563f09
Show file tree
Hide file tree
Showing 123 changed files with 15,601 additions and 19,609 deletions.
41 changes: 10 additions & 31 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
module.exports = {
extends: [
"eslint:recommended",
"plugin:react/recommended",
"airbnb",
"airbnb-typescript",
"airbnb/hooks"
"plugin:prettier/recommended",
],
plugins: ['react', '@typescript-eslint'],
parser: "@typescript-eslint/parser",
parserOptions: {
project: "./tsconfig.json",
Expand All @@ -20,35 +18,16 @@ module.exports = {
version: "detect", // Tells eslint-plugin-react to automatically detect the version of React to use
},
},
"ignorePatterns": [
"/*",
"!/src",
],

ignorePatterns: ["/*", "!/src"],
rules: {
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
// e.g. "@typescript-eslint/explicit-function-return-type": "off",
"react/function-component-definition": [
"warn",
{
namedComponents: "arrow-function",
unnamedComponents: "arrow-function",
},
],
quotes: [
"warn",
"double",
{ avoidEscape: true, allowTemplateLiterals: true },
],
"react/require-default-props": "off",
"linebreak-style": "off",
"@typescript-eslint/quotes": "off",
"arrow-body-style": "off",
"import/no-extraneous-dependencies": [
"error",
{ "devDependencies": ["**/*.test.{ts,tsx,js}", "src/setupTests.ts"] }
],
"max-len": "off", // Disable max-len rule
"jsx-a11y/alt-text": "off" // Disable alt-text rule
"react/react-in-jsx-scope": "off",
"no-undef": "off",
"no-unused-vars": "off",
// Temporary rules
// TODO: remove
"react/prop-types": "off",
"react/jsx-key": "off",
},
};
3 changes: 3 additions & 0 deletions .github/pull_request_template.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
### Describe your changes 📖

<text here>

### Linear ticket: 🔖

VF-XXX

### Checklist before requesting a review ✔️

- [ ] I have performed a self-review of my code
- [ ] I have verified that the code works as intended
- [ ] Pipeline runs successfully
Expand Down
36 changes: 24 additions & 12 deletions .github/workflows/node.js.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,46 +18,55 @@ jobs:

steps:
- uses: actions/checkout@v3
- uses: pnpm/action-setup@v3
with:
version: 8
- name: Use Node.js ${{ env.NODE_VERSION }}
uses: actions/setup-node@v3
with:
node-version: ${{env.NODE_VERSION}}
cache: "yarn"
- name: yarn build
cache: "pnpm"
- name: Install dependencies
run: |
yarn install --immutable
yarn build
pnpm install
pnpm build
- name: store build artifact
uses: actions/upload-artifact@v3
with:
name: build
path: build

lint:
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v3
- uses: pnpm/action-setup@v3
with:
version: 8
- name: Lint with eslint
uses: actions/setup-node@v3
with:
node-version: ${{env.NODE_VERSION}}
cache: "yarn"
- name: yarn lint
cache: "pnpm"
- name: pnpm lint
run: |
yarn install --immutable
yarn eslint . --ext .js,.jsx,.ts,.tsx
pnpm install
pnpm lint
vitest_tests:
needs: build
runs-on: ubuntu-latest

steps:
- uses: actions/checkout@v3
- uses: pnpm/action-setup@v3
with:
version: 8
- name: Run tests
run: |
yarn install --immutable
yarn test:vitest
pnpm install
pnpm test:vitest
cypress_tests:
needs: build
Expand All @@ -72,6 +81,9 @@ jobs:
options: --user 1001
steps:
- uses: actions/checkout@v3
- uses: pnpm/action-setup@v3
with:
version: 8
- name: Download the build folders
uses: actions/download-artifact@v3
with:
Expand All @@ -80,4 +92,4 @@ jobs:
- uses: cypress-io/github-action@v4
with:
browser: ${{ matrix.browser }}
build: yarn build
build: pnpm build
6 changes: 6 additions & 0 deletions .prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"semi": true,
"tabWidth": 2,
"printWidth": 80,
"singleQuote": false
}
8 changes: 3 additions & 5 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
{
"codetogether.virtualCursorJoin": "sharedVirtualCursor",
"cSpell.words": [
"Vektorprogrammet"
]
}
"codetogether.virtualCursorJoin": "sharedVirtualCursor",
"cSpell.words": ["Vektorprogrammet"]
}
363 changes: 0 additions & 363 deletions .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs

This file was deleted.

873 changes: 0 additions & 873 deletions .yarn/releases/yarn-3.5.0.cjs

This file was deleted.

7 changes: 0 additions & 7 deletions .yarnrc.yml

This file was deleted.

16 changes: 8 additions & 8 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,20 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo

In the project directory, you can run:

### `yarn start`
### `pnpm start`

Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.

The page will reload if you make edits.\
You will also see any lint errors in the console.

### `yarn test`
### `pnpm test`

Runs the cypress tests defined in (cypress)[./cypress].
To specify the tests to run in firefox specifically run `yarn test:firefox`
Runs the cypress tests defined in [cypress](./cypress).
To specify the tests to run in firefox specifically run `pnpm test:firefox`

### `yarn build`
### `pnpm build`

Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
Expand All @@ -29,7 +29,7 @@ Your app is ready to be deployed!

See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.

### `yarn eject`
### `pnpm eject`

**Note: this is a one-way operation. Once you `eject`, you can’t go back!**

Expand All @@ -39,13 +39,13 @@ Instead, it will copy all the configuration files and the transitive dependencie

You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.

## `yarn lint`
## `pnpm lint`

Runs the linter with `eslint */**/*.{js,ts,tsx}` linting all .js, .ts and .tsx files in the project.

The linter settings are stored in the [.eslintrc.js file](.eslintrc.js) which also enables TypeScript linting.

Running `yarn lint --fix` will fix small auto-fixable problems.
Running `pnpm lint --fix` will fix small auto-fixable problems.

## Learn More

Expand Down
10 changes: 5 additions & 5 deletions cypress/e2e/test.cy.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
describe('empty spec', () => {
it('passes', () => {
cy.visit('https://example.cypress.io')
})
})
describe("empty spec", () => {
it("passes", () => {
cy.visit("https://example.cypress.io");
});
});
10 changes: 5 additions & 5 deletions cypress/fixtures/example.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "[email protected]",
"body": "Fixtures are a great way to mock data for responses to routes"
}
{
"name": "Using fixtures to represent data",
"email": "[email protected]",
"body": "Fixtures are a great way to mock data for responses to routes"
}
74 changes: 37 additions & 37 deletions cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -1,37 +1,37 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
//
// declare global {
// namespace Cypress {
// interface Chainable {
// login(email: string, password: string): Chainable<void>
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// }
// }
// }
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
//
// declare global {
// namespace Cypress {
// interface Chainable {
// login(email: string, password: string): Chainable<void>
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// }
// }
// }
40 changes: 20 additions & 20 deletions cypress/support/e2e.ts
Original file line number Diff line number Diff line change
@@ -1,20 +1,20 @@
// ***********************************************************
// This example support/e2e.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.js using ES2015 syntax:
import './commands'

// Alternatively you can use CommonJS syntax:
// require('./commands')
// ***********************************************************
// This example support/e2e.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.js using ES2015 syntax:
import "./commands";

// Alternatively you can use CommonJS syntax:
// require('./commands')
Loading

0 comments on commit 3563f09

Please sign in to comment.