diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index e37ebe8b6a62..000000000000 --- a/.eslintignore +++ /dev/null @@ -1,24 +0,0 @@ -# The build artifacts of the jitsi-meet project. -build/* - -doc/* - -# Third-party source code which we (1) do not want to modify or (2) try to -# modify as little as possible. -libs/* -resources/* -react/features/stream-effects/virtual-background/vendor/* -react/features/face-landmarks/resources/* - -# ESLint will by default ignore its own configuration file. However, there does -# not seem to be a reason why we will want to risk being inconsistent with our -# remaining JavaScript source code. -!.eslintrc.js - -# Not worth it. -actionTypes.ts - -# It's not complete until all files are copied at build time. -react-native-sdk/ - -*.d.ts diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index c81c31085de3..000000000000 --- a/.eslintrc.js +++ /dev/null @@ -1,7 +0,0 @@ -module.exports = { - "extends": "@internxt/eslint-config-internxt", - 'ignorePatterns': [ '*.d.ts' ], - rules: { - 'linebreak-style': ['error', 'unix'], - }, -}; diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 7fb80d2cfe45..39fc45bbd972 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -7,89 +7,66 @@ jobs: name: Lint runs-on: ubuntu-latest steps: - - uses: actions/checkout@v4 - - uses: actions/setup-node@v4 - with: - node-version: 18 - cache: 'npm' - registry-url: 'https://npm.pkg.github.com' - - name: Backup original .npmrc - run: | - if [ -f .npmrc ]; then - cp .npmrc .npmrc.original - fi - - name: Configure NPM - run: | - echo "registry=https://registry.yarnpkg.com/" > .npmrc - echo "@internxt:registry=https://npm.pkg.github.com" >> .npmrc - echo "//npm.pkg.github.com/:_authToken=${{ secrets.PERSONAL_ACCESS_TOKEN }}" >> .npmrc - echo "always-auth=true" >> .npmrc - npm config set legacy-peer-deps true - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} - - name: Get changed files - id: changed-files - uses: jitsi/changed-files@main - - name: Get changed lang files - id: lang-files - run: echo "all=$(echo "${{ steps.changed-files.outputs.all_changed_files }}" | grep -oE 'lang\/\S+' | tr '\n' ' ')" >> "$GITHUB_OUTPUT" - - run: npm install --legacy-peer-deps - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} - - name: Restore original .npmrc - run: | - if [ -f .npmrc.original ]; then - mv .npmrc.original .npmrc - else - rm .npmrc - fi - - name: Check git status - run: git status - - name: Normalize lang files to ensure sorted - if: steps.lang-files.outputs.all - run: npm run lang-sort - - name: Check lang files are formatted correctly - if: steps.lang-files.outputs.all - run: npm run lint:lang - - name: Check if the git repository is clean - run: $(exit $(git status --porcelain --untracked-files=no | head -255 | wc -l)) || (echo "Dirty git tree"; git diff; exit 1) - - run: npm run lint:ci && npm run tsc:ci + - name: Checkout + uses: actions/checkout@v4 + + - name: Setup Node + uses: actions/setup-node@v4 + with: + node-version: '24.x' + cache: yarn + + - name: Add .npmrc + run: cp .npmrc.template .npmrc + + - name: Install dependencies + run: yarn + + - name: Get changed files + id: changed-files + uses: jitsi/changed-files@main + + - name: Get changed lang files + id: lang-files + run: echo "all=$(echo "${{ steps.changed-files.outputs.all_changed_files }}" | grep -oE 'lang\/\S+' | tr '\n' ' ')" >> "$GITHUB_OUTPUT" + + - name: Check git status + run: git status + + - name: Normalize lang files to ensure sorted + if: steps.lang-files.outputs.all + run: npm run lang-sort + + - name: Check lang files are formatted correctly + if: steps.lang-files.outputs.all + run: npm run lint:lang + + - name: Check if the git repository is clean + run: $(exit $(git status --porcelain --untracked-files=no | head -255 | wc -l)) || (echo "Dirty git tree"; git diff; exit 1) + + - run: npm run lint:ci && npm run tsc:ci linux-build: name: Build Frontend (Linux) runs-on: ubuntu-latest steps: - - uses: actions/checkout@v4 - - uses: actions/setup-node@v4 - with: - node-version: 18 - cache: 'npm' - registry-url: 'https://npm.pkg.github.com' - - name: Backup original .npmrc - run: | - if [ -f .npmrc ]; then - cp .npmrc .npmrc.original - fi - - name: Configure NPM - run: | - echo "registry=https://registry.yarnpkg.com/" > .npmrc - echo "@internxt:registry=https://npm.pkg.github.com" >> .npmrc - echo "//npm.pkg.github.com/:_authToken=${{ secrets.PERSONAL_ACCESS_TOKEN }}" >> .npmrc - echo "always-auth=true" >> .npmrc - npm config set legacy-peer-deps true - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} - - run: npm install --legacy-peer-deps - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} - - name: Restore original .npmrc - run: | - if [ -f .npmrc.original ]; then - mv .npmrc.original .npmrc - else - rm .npmrc - fi - - run: make + - name: Checkout + uses: actions/checkout@v4 + + - name: Setup Node + uses: actions/setup-node@v4 + with: + node-version: '24.x' + cache: yarn + + - name: Add .npmrc + run: cp .npmrc.template .npmrc + + - name: Install dependencies + run: yarn + + - run: make + # macos-ci: # name: Build Frontend (macOS) # runs-on: macOS-latest diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml index a6d6466cfc04..c8f6c2380b01 100644 --- a/.github/workflows/publish.yml +++ b/.github/workflows/publish.yml @@ -16,31 +16,22 @@ jobs: deployments: write pull-requests: write name: Publish to Cloudflare Pages + steps: - name: Checkout - uses: actions/checkout@v3 + uses: actions/checkout@v4 - - name: Setup Node.js - uses: actions/setup-node@v3 + - name: Setup Node + uses: actions/setup-node@v4 with: - node-version: '16' - registry-url: 'https://npm.pkg.github.com' - scope: '@internxt' + node-version: '24.x' + cache: yarn - - name: Configure NPM - run: | - echo "registry=https://registry.yarnpkg.com/" > .npmrc - echo "@internxt:registry=https://npm.pkg.github.com" >> .npmrc - echo "//npm.pkg.github.com/:_authToken=${{ secrets.PERSONAL_ACCESS_TOKEN }}" >> .npmrc - echo "always-auth=true" >> .npmrc - npm config set legacy-peer-deps true - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} + - name: Add .npmrc + run: cp .npmrc.template .npmrc - name: Install dependencies - run: npm install --legacy-peer-deps - env: - NODE_AUTH_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }} + run: yarn - name: Configure environment run: | @@ -64,6 +55,7 @@ jobs: accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }} projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }} directory: . + - name: Comment Preview Link on PR if: github.event_name == 'pull_request' uses: actions/github-script@v6 diff --git a/.github/workflows/sonarcloud-analysis.yml b/.github/workflows/sonarcloud-analysis.yml index de07d4ad933a..1a5ad40cab86 100644 --- a/.github/workflows/sonarcloud-analysis.yml +++ b/.github/workflows/sonarcloud-analysis.yml @@ -9,34 +9,25 @@ jobs: sonarcloud: name: SonarCloud runs-on: ubuntu-latest - strategy: - matrix: - node-version: [22.12.0] + steps: - - uses: actions/checkout@v3 - with: - fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis + - name: Checkout + uses: actions/checkout@v4 - - name: Set up Node.js ${{ matrix.node-version }} + - name: Setup Node uses: actions/setup-node@v4 with: - node-version: ${{ matrix.node-version }} - registry-url: "https://npm.pkg.github.com" + node-version: '24.x' + cache: yarn - - run: echo "registry=https://registry.yarnpkg.com/" > .npmrc - - run: echo "@internxt:registry=https://npm.pkg.github.com" >> .npmrc - # You cannot read packages from other private repos with GITHUB_TOKEN - # You have to use a PAT instead https://github.com/actions/setup-node/issues/49 - - run: echo //npm.pkg.github.com/:_authToken=${{ secrets.PERSONAL_ACCESS_TOKEN }} >> .npmrc - - run: echo "always-auth=true" >> .npmrc + - name: Add .npmrc + run: cp .npmrc.template .npmrc - name: Install dependencies - run: | - npm i --legacy-peer-deps - npm install --no-save --force @rollup/rollup-linux-x64-gnu + run: yarn - name: Test and coverage - run: npm run test:coverage + run: yarn test:coverage - name: SonarCloud Scan uses: SonarSource/sonarcloud-github-action@v3 diff --git a/.npmrc.template b/.npmrc.template index 3906d9c299fe..a098528c88dd 100644 --- a/.npmrc.template +++ b/.npmrc.template @@ -1,8 +1,3 @@ -package-lock=true -; FIXME Set legacy-peer-deps=false when we upgrade RN. -legacy-peer-deps=true registry=https://registry.yarnpkg.com/ - -@internxt:registry=https://npm.pkg.github.com -//npm.pkg.github.com/:_authToken=TOKEN -always-auth=true \ No newline at end of file + +@internxt:registry=https://registry.yarnpkg.com/ diff --git a/README.md b/README.md index 263769c7a90f..9d1fe52603b4 100644 --- a/README.md +++ b/README.md @@ -25,8 +25,7 @@ Our development standards include: ### Prerequisites - Node.js 20.x or higher -- npm 9.x or higher -- Access to Internxt GitHub packages (for private dependencies) +- yarn 1.x or higher ### Installation @@ -41,37 +40,35 @@ Our development standards include: cp .npmrc.template .npmrc ``` -3. Replace `TOKEN` in the `.npmrc` file with your own [GitHub Personal Access Token](https://docs.github.com/en/github/authenticating-to-github/keeping-your-account-and-data-secure/creating-a-personal-access-token) with `read:packages` permission **ONLY**. - -4. Install dependencies: +3. Install dependencies: ```bash - npm install + yarn install ``` -5. Create an environment file from the template: +4. Create an environment file from the template: ```bash cp .env.template .env ``` -6. Configure the required environment variables in `.env` file. +5. Configure the required environment variables in `.env` file. ### Scripts -#### `npm start` or `make dev` +#### `yarn start` or `make dev` Runs the app in development mode using webpack-dev-server. Open [http://127.0.0.1:8080/](http://127.0.0.1:8080/) to view it in the browser. The page will reload if you make edits. -#### `npm test` +#### `yarn test` Launches the Vitest test runner in interactive watch mode. -#### `npm test:coverage` +#### `yarn test:coverage` Runs tests with coverage reports generated in the `coverage` directory. -#### `npm run lint` +#### `yarn lint` Runs ESLint to check code quality and style issues across JavaScript and TypeScript files. -#### `npm run lint-fix` +#### `yar lint-fix` Automatically fixes linting issues where possible. #### `make` @@ -106,4 +103,4 @@ The application is built on React and uses the following architecture: ### Styling - Tailwind CSS for styling -- Internxt UI components for consistent design \ No newline at end of file +- Internxt UI components for consistent design diff --git a/eslint.config.mjs b/eslint.config.mjs new file mode 100644 index 000000000000..4b07d0256285 --- /dev/null +++ b/eslint.config.mjs @@ -0,0 +1,31 @@ +import eslintConfigInternxt from '@internxt/eslint-config-internxt'; + +export default [ + { + ignores: [ + 'build/', + 'doc/', + 'libs/', + 'resources/', + 'react/features/stream-effects/virtual-background/vendor/', + 'react/features/face-landmarks/resources/', + 'actionTypes.ts', + 'react-native-sdk/', + '*.d.ts', + 'webpack.config.js', + 'tests/' + ] + }, + ...eslintConfigInternxt, + { + rules: { + 'linebreak-style': ['error', 'unix'], + 'quotes': 'off', + 'max-len': 'warn', + 'no-undef': 'warn', + '@typescript-eslint/no-explicit-any': 'warn', + '@typescript-eslint/no-unused-vars': 'warn', + '@typescript-eslint/no-unsafe-function-type': 'warn' + } + } +]; \ No newline at end of file diff --git a/modules/UI/videolayout/LargeVideoManager.js b/modules/UI/videolayout/LargeVideoManager.js index 5b6a95100a3e..7c10c40f911c 100644 --- a/modules/UI/videolayout/LargeVideoManager.js +++ b/modules/UI/videolayout/LargeVideoManager.js @@ -531,12 +531,11 @@ export default class LargeVideoManager { */ updateAvatar() { ReactDOM.render( - - - , + React.createElement( + Provider, + { store: APP.store }, + React.createElement(Avatar, { id: "dominantSpeakerAvatar", participantId: this.id, size: 200 }) + ), this._dominantSpeakerAvatarContainer ); } @@ -572,14 +571,20 @@ export default class LargeVideoManager { if (presenceLabelContainer) { ReactDOM.render( - - - - - , - presenceLabelContainer); + React.createElement( + Provider, + { store: APP.store }, + React.createElement( + I18nextProvider, + { i18n: i18next }, + React.createElement(PresenceLabel, { + participantID: id, + className: "presence-label" + }) + ) + ), + presenceLabelContainer + ); } } diff --git a/modules/UI/videolayout/VideoContainer.js b/modules/UI/videolayout/VideoContainer.js index 1c65569e327c..d9f31bb5a24c 100644 --- a/modules/UI/videolayout/VideoContainer.js +++ b/modules/UI/videolayout/VideoContainer.js @@ -693,16 +693,13 @@ export class VideoContainer extends LargeContainer { } ReactDOM.render( -