build: switch from yarn to npm to manage js dependencies and move js contents to root

yarn v1 is being deprecated and starts to have some issues

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

.credo.exs

@@ -22,7 +22,7 @@
         # In the latter case `**/*.{ex,exs}` will be used.
         #
         included: ["lib/", "src/", "test/"],
-        excluded: [~r"/_build/", ~r"/deps/", ~r"/js/"]
+        excluded: [~r"/_build/", ~r"/deps/", ~r"/src/"]
       },
       #
       # If you create your own checks, you must specify the source files for

.dockerignore

@@ -15,5 +15,5 @@ Makefile
 README.md
 SECURITY.md
 ssh_match_hostname
-.js/package-lock.json
+package-lock.json
-js/node_modules
+node_modules

.gitignore

@@ -46,7 +46,12 @@ release/
 .weblate
 docker/production/.env
 test-junit-report.xml
-js/junit.xml
+junit.xml
 .env
 demo/
 codeclimate.json
+
+node_modules
+stats.html
+/coverage
+/playwright-report/

.gitlab-ci.yml

@@ -13,7 +13,6 @@ stages:
 
 variables:
   MIX_ENV: "test"
-  YARN_CACHE_FOLDER: "js/.yarn"
   # DB Variables for Postgres / Postgis
   POSTGRES_DB: mobilizon_test
   POSTGRES_USER: postgres
@@ -38,8 +37,8 @@ cache:
   paths:
     - deps/
     - _build/
-    - js/node_modules
+    - node_modules
-    - js/.yarn
+    - .npm
 
 # Installed dependencies are cached across the pipeline
 # So there is no need to reinstall them all the time
@@ -47,7 +46,7 @@ cache:
 install:
   stage: install
   script:
-    - yarn --cwd "js" install --frozen-lockfile
+    - npm ci
     - mix deps.get
     - mix compile
 
@@ -74,10 +73,10 @@ lint-front:
   stage: check
   before_script:
     - export EXITVALUE=0
-    - yarn --cwd "js" install --frozen-lockfile
+    - npm ci
   script:
-    - yarn --cwd "js" run lint || export EXITVALUE=1
+    - npm run lint || export EXITVALUE=1
-    - yarn --cwd "js" run prettier -c . || export EXITVALUE=1
+    - npm run prettier -c . || export EXITVALUE=1
     - exit $EXITVALUE
 
 build-frontend:
@@ -87,8 +86,8 @@ build-frontend:
     - apt update
     - apt install -y --no-install-recommends python build-essential webp imagemagick gifsicle jpegoptim optipng pngquant
   script:
-    - yarn --cwd "js" install --frozen-lockfile
+    - npm install --frozen-lockfile
-    - yarn --cwd "js" run build
+    - npm run build
   artifacts:
     expire_in: 5 days
     paths:
@@ -118,7 +117,7 @@ deps:
   script:
     - export EXITVALUE=0
     - mix hex.outdated || export EXITVALUE=1
-    - yarn --cwd "js" outdated || export EXITVALUE=1
+    - npm outdated || export EXITVALUE=1
     - exit $EXITVALUE
   allow_failure: true
   needs:
@@ -151,16 +150,16 @@ vitest:
   needs:
     - lint-front
   before_script:
-    - yarn --cwd "js" install --frozen-lockfile
+    - npm install --frozen-lockfile
   script:
-    - yarn --cwd "js" run coverage --reporter=default --reporter=junit --outputFile.junit=./junit.xml
+    - npm run coverage --reporter=default --reporter=junit --outputFile.junit=./junit.xml
   artifacts:
     when: always
     paths:
-      - js/coverage
+      - coverage
     reports:
       junit:
-        - js/junit.xml
+        - junit.xml
     expire_in: 30 days
 
 e2e:
@@ -175,11 +174,10 @@ e2e:
     - mix ecto.create
     - mix ecto.migrate
     - mix run priv/repo/e2e.seed.exs
-    - cd js && yarn install && yarn run build && npx playwright install && cd ../
+    - npm install && npm run build && npx playwright install
     - mix phx.digest
   script:
     - mix phx.server &
-    - cd js
     - npx wait-on http://localhost:4000
     - npx playwright test --project $BROWSER
   parallel:
@@ -188,8 +186,8 @@ e2e:
   artifacts:
     expire_in: 2 days
     paths:
-      - js/playwright-report/
+      - playwright-report/
-      - js/test-results/
+      - test-results/
 
 pages:
   stage: deploy
@@ -198,8 +196,8 @@ pages:
     - mix deps.get
     - mix docs
     - mv doc public/backend
-  #     #- yarn run --cwd "js" styleguide:build
+  #     #- npm run styleguide:build
-  #     #- mv js/styleguide public/frontend
+  #     #- mv styleguide public/frontend
   rules:
     - if: '$CI_COMMIT_BRANCH == "main"'
   artifacts:

.husky/pre-commit

@@ -1,4 +1,3 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
-cd js
+npm run pre-commit
-yarn run lint-staged

Dockerfile

@@ -1,6 +1,6 @@
 FROM elixir:alpine
 
-RUN apk add --no-cache inotify-tools postgresql-client yarn file make gcc libc-dev argon2 imagemagick cmake build-base libwebp-tools bash ncurses git python3
+RUN apk add --no-cache inotify-tools postgresql-client file make gcc libc-dev argon2 imagemagick cmake build-base libwebp-tools bash ncurses git python3
 
 RUN mix local.hex --force && mix local.rebar --force
 

Makefile

@@ -4,7 +4,7 @@ init:
 
 setup: stop
 	@bash docker/message.sh "Compiling everything"
-	docker-compose run --rm api bash -c 'mix deps.get; yarn --cwd "js"; yarn --cwd "js" build:pictures; mix ecto.create; mix ecto.migrate'
+	docker-compose run --rm api bash -c 'mix deps.get; npm ci; npm run build:pictures; mix ecto.create; mix ecto.migrate'
 migrate:
 	docker-compose run --rm api mix ecto.migrate
 logs:

apollo.config.js

@@ -7,6 +7,6 @@ module.exports = {
       localSchemaFile: "./schema.graphql",
     },
     // Files processed by the extension
-    includes: ["js/src/**/*.vue", "js/src/**/*.js"],
+    includes: ["src/**/*.vue", "src/**/*.js"],
   },
 };

config/dev.exs

@@ -16,7 +16,6 @@ config :mobilizon, Mobilizon.Web.Endpoint,
   watchers: [
     node: [
       "node_modules/.bin/vite",
-      cd: Path.expand("../js", __DIR__)
     ]
   ]
 

config/e2e.exs

@@ -16,7 +16,7 @@ config :mobilizon, Mobilizon.Web.Endpoint,
   check_origin: false,
   # Somehow this can't be merged properly with the dev config so we got this…
   watchers: [
-    yarn: [cd: Path.expand("../js", __DIR__)]
+    npm: []
   ]
 
 config :vite_phx,

docker/multiarch/Dockerfile

@@ -18,9 +18,8 @@ ENV NODE_VERSION 18
 RUN apt-get update -yq && apt-get install -yq build-essential cmake postgresql-client git curl gnupg unzip exiftool webp imagemagick gifsicle
 RUN apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*
 
-# # Install Node & yarn
+# # Install Node
 # RUN curl -sL https://deb.nodesource.com/setup_16.x | bash && apt-get install nodejs -yq
-# RUN npm install -g yarn
 
 # Install build tools
 RUN source /root/.bashrc && \
@@ -32,8 +31,8 @@ COPY ./ /mobilizon
 WORKDIR /mobilizon
 
 # # Build front-end
-# RUN yarn --cwd "js" install --frozen-lockfile
+# RUN npm install
-# RUN yarn --cwd "js" run build
+# RUN npm run build
 
 # Elixir release
 RUN source /root/.bashrc && \

docker/production/Dockerfile

@@ -3,11 +3,10 @@ FROM node:18-alpine as assets
 
 RUN apk add --no-cache python3 build-base libwebp-tools bash imagemagick ncurses
 WORKDIR /build
-COPY js .
+COPY . .
 
 # Network timeout because it's slow when cross-compiling
-RUN yarn install --network-timeout 100000 \
+RUN npm install && npm run build
-    && yarn run build
 
 # Then, build the application binary
 FROM elixir:1.15-alpine AS builder

docker/tests/Dockerfile

@@ -4,7 +4,7 @@ LABEL maintainer="Thomas Citharel <tcit@tcit.fr>"
 ENV REFRESHED_AT=2023-08-17
 RUN apt-get update -yq && apt-get install -yq build-essential inotify-tools postgresql-client git curl gnupg xvfb libgtk-3-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 cmake exiftool python3-pip python3-setuptools
 RUN curl -sL https://deb.nodesource.com/setup_20.x | bash && apt-get install nodejs -yq
-RUN npm install -g yarn wait-on
+RUN npm install -g wait-on
 RUN apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*
 RUN mix local.hex --force && mix local.rebar --force
 RUN pip3 install -Iv weasyprint pyexcel_ods3

docs/dev.md

@@ -19,7 +19,7 @@ Mobilizon is an app that uses:
 
   * `config` backend compile-time and runtime configuration
   * `docker` 🐳
-  * `js/src` Front-end
+  * `src` Front-end
   * `lib/federation` Handling all the federation stuff (sending and receving activities, converting activities, signatures, helpers…)
   * `lib/graphql/schema` The schema declarations for the GraphQL API
   * `lib/graphql/resolvers` The logic behind the GraphQL API

js/.gitignore

@@ -1,27 +0,0 @@
-.DS_Store
-node_modules
-/dist
-
-/coverage
-stats.html
-
-# local env files
-.env.local
-.env.*.local
-
-# Log files
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-
-# Editor directories and files
-.idea
-.vscode
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
-/test-results/
-/playwright-report/
-/playwright/.cache/

js/tsconfig.json

@@ -1,40 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
-    "strict": true,
-    "jsx": "preserve",
-    "importHelpers": true,
-    "moduleResolution": "node",
-    "experimentalDecorators": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "sourceMap": true,
-    "baseUrl": ".",
-    "types": ["webpack-env", "jest", "vite/client", "vite-plugin-pwa/vue"],
-    "typeRoots": ["./@types", "./node_modules/@types"],
-    "paths": {
-      "@/*": ["src/*"]
-    },
-    "lib": [
-      "esnext",
-      "dom",
-      "es2017.intl",
-      "dom.iterable",
-      "scripthost",
-      "webworker"
-    ]
-  },
-  "include": [
-    "src/**/*.ts",
-    "src/**/*.tsx",
-    "src/**/*.vue",
-    "tests/**/*.ts",
-    "tests/**/*.tsx",
-    "env.d.ts"
-  ],
-  "exclude": ["node_modules"]
-}

mix.exs

@@ -268,7 +268,7 @@ defmodule Mobilizon.Mixfile do
         "deps.get",
         "ecto.create --quiet",
         "ecto.migrate",
-        "cmd cd js && yarn install && cd ../",
+        "cmd npm ci",
         "phx.server"
       ]
     ]

package.json

@@ -5,9 +5,9 @@
   "scripts": {
     "dev": "vite",
     "preview": "vite preview",
-    "build": "yarn run build:assets && yarn run build:pictures",
+    "build": "npm run build:assets && npm run build:pictures",
     "lint": "eslint --ext .ts,.vue --ignore-path .gitignore --fix src",
-    "format": "prettier .  --write",
+    "format": "prettier . --write",
     "build:assets": "vite build",
     "build:pictures": "bash ./scripts/build/pictures.sh",
     "story:dev": "histoire dev",
@@ -15,7 +15,8 @@
     "story:preview": "histoire preview",
     "test": "vitest",
     "coverage": "vitest run --coverage",
-    "prepare": "cd ../ && husky install"
+    "prepare": "husky install",
+    "pre-commit": "lint-staged"
   },
   "lint-staged": {
     "**/*.{js,ts,vue}": [