The Wayback Machine - https://web.archive.org/web/20210421081535/https://github.com/RocketChat/Rocket.Chat/pull/21318
Skip to content

/ Rocket.Chat

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[NEW] New set of rules for client code #21318

Merged
merged 143 commits into from Apr 8, 2021
Merged

[NEW] New set of rules for client code #21318

merged 143 commits into from Apr 8, 2021
+82,529 −66,638

Conversation

@tassoevan
Copy link
Contributor

@tassoevan tassoevan commented Mar 26, 2021 •
edited

Proposed changes (including videos or screenshots)

This small PR does the following:

  • Now React is the web client's first-class citizen, being loaded before Blaze. Thus, BlazeLayout calls render templates inside of a React component (BlazeLayoutWrapper);
  • Main client startup code, including polyfills, is written in TypeScript;
  • At the moment, routes are treated as regular startup code; it's expected that FlowRouter will be deprecated in favor of a new routing library;
  • React was updated to major version 17, deprecating the usage of React as namespace (e.g. use memo() instead of React.memo());
  • The client/ and ee/client/ directory are linted with a custom ESLint configuration that includes:
    • Prettier;
    • react-hooks/* rules for TypeScript files;
    • react/no-multi-comp, enforcing the rule of one single React component per module;
    • react/display-name, which enforces that React components must have a name for debugging;
    • import/named, avoiding broken named imports.
  • A bunch of components were refactored to match the new ESLint rules.

Issue(s)

Steps to test or reproduce

Further comments

Target browser changes:

-and_chr 84
-and_ff 68
+and_chr 89
+and_ff 86
 and_qq 10.4
 and_uc 12.12
-android 81
+android 89
 baidu 7.12
 bb 10
 bb 7
-chrome 84
-chrome 83
-edge 84
-edge 83
-firefox 79
-firefox 78
+chrome 89
+chrome 88
+edge 89
+edge 88
+firefox 87
+firefox 86
 ie 11
 ie 10
 ie_mob 11
 ie_mob 10
-ios_saf 13.4-13.5
-ios_saf 13.3
+ios_saf 14.0-14.5
+ios_saf 13.4-13.7
 kaios 2.5
 op_mini all
-op_mob 46
+op_mob 62
 op_mob 12.1
-opera 69
-opera 68
+opera 73
+opera 72
+safari 14
 safari 13.1
-safari 13
+samsung 13.0
 samsung 12.0
-samsung 11.1-11.2
tassoevan added 30 commits Mar 23, 2021
@tassoevan
Use client entrypoint in TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
fa08546
@tassoevan
Migrate polyfills to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
f1550b9
@tassoevan
Migrate some startup scripts
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
ce7a507
@tassoevan
Migrate some startup modules to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
9afe330
@tassoevan
Convert reactAdapters module to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
81a1f9a
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
38d05e2 
…/client-init
@tassoevan
Migrate routes module to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
885faa0
@tassoevan
Move more initialization modules
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
fce79b4
@tassoevan
Migrate some startup modules to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
5f8b0d4
@tassoevan
Add custom eslint config to startup and Prettier
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
7e3efdf
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
4d77782 
…/client-init
@tassoevan
Convert last startup modules to TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
2679910
@tassoevan
Promote eslint configuration to the entire client/ directory
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
67cd663
@tassoevan
Mount React root at startup
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
29af9ed
@tassoevan
Render BlazeLayout as a React component
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
a58d677
@tassoevan
Add custom eslint config to /ee/client
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
9008c15
@tassoevan
Move AppRoot
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
5844784
@tassoevan
Warn against multiples components per module
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
25dc120
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
6fd679c 
…/client-init
@tassoevan
Update React and Storybook
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
1f0c32e
@tassoevan
Move startup modules away from import/
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
8d9d7cc
@tassoevan
Use react-hooks eslint rules in TypeScript
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
2cd9e19
@tassoevan
Aggregate templates created from components
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
19a8778
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
bb6959e 
…/client-init
@tassoevan
Remove async reference to react and react-dom
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
1407aba
@tassoevan
Split some components
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
f425e36
@tassoevan
Split some components
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
3d78649
@tassoevan
Replace React.memo with memo
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
7c6064d
@tassoevan
Replace React.forwardRef with forwardRef
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
6288a1f
@tassoevan
Remove last usages `React` as namespace
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
ba6438b
tassoevan and others added 23 commits Mar 29, 2021
@tassoevan
Refactor RemoveUsersModal
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
66279c2
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
2956fa5 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
96eefbe 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
891901e 
…/client-init
@tassoevan
Fix stylelint issue
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
953e70e
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
775c4ad 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
5bdb651 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
031d0e2 
…/client-init
@tassoevan
Fix broken reference
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
5b0f2e2
@tassoevan
Fix Storybook webpack config
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
e0e3ffb
@tassoevan
Use Fuselage's package typings
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
ba40aa4
@tassoevan
Properly handle unmounts on BlazeLayoutWrapper
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
32d9d8d
@tassoevan
Fix sidebar avatars
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
9d98ece
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
d19fc0a 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
77c3469 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
1ac5891 
…/client-init
@tassoevan
Refactor OmnichannelProvider to avoid children remounting
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
85ae02d
@tassoevan
Replace connection status bar
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
5a3705f
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
c359eb9 
…/client-init
@tassoevan
Merge branch 'develop' into perf/client-init
Verified
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: 4AEE18F83AFDEB23 Learn about signing commits
Loading status checks…
837c9bc
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
3dff30a 
…/client-init
@tassoevan
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Verified
This commit was signed with the committer’s verified signature.
tassoevan Tasso Evangelista
GPG key ID: 9EA06BE6FD613A03 Learn about signing commits
Loading status checks…
2ba0f67 
…/client-init
@ggazzo
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into perf…
Loading status checks…
70cd421 
…/client-init
@ggazzo
ggazzo approved these changes Apr 8, 2021
View changes
@ggazzo ggazzo changed the title New set of rules for client code [NEW] New set of rules for client code Apr 8, 2021
@ggazzo ggazzo merged commit d8a24b0 into develop Apr 8, 2021
11 checks passed
11 checks passed
build
Details
CodeQL-Build CodeQL-Build
Details
CodeQL-Build CodeQL-Build
Details
build-image-pr
Details
test (12.21.0, 3.4)
Details
test (12.21.0, 3.6)
Details
test (12.21.0, 4.0)
Details
CodeQL No new or fixed alerts
Details
LGTM analysis: JavaScript No new or fixed alerts
Details
license/cla Contributor License Agreement is signed.
Details
security/snyk (rodrigok) 5 security tests have passed
Details
@ggazzo ggazzo deleted the perf/client-init branch Apr 8, 2021
@ankar84
Copy link

@ankar84 ankar84 commented Apr 8, 2021

Great job @tassoevan and @ggazzo you guys rocks!
gabriellsh added a commit that referenced this pull request Apr 15, 2021
@gabriellsh
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into fix/…
bd11c1b 
…user_info

* 'develop' of github.com:RocketChat/Rocket.Chat: (40 commits)
  [FIX] Typos/missing elements in the French translation (#21525)
  [FIX] Archive permissions for room moderator (#21563)
  [FIX] Checking 'start-discussion' Permission for MessageBox Actions (#21564)
  [FIX] Correcting the case there are no result in admin users list (#21556)
  [FIX] Don't allow whitespace on bold, italic and strike (#21483)
  [FIX] Message Block ordering (#21464)
  [IMPROVE] Add proxy for data export (#20998)
  [FIX] Updating a message causing URLs to be parsed even within markdown code (#21489)
  Bump version to 3.13.2
  [FIX] Fix the bugs opening discussions (#21557)
  A React-based replacement for BlazeLayout (#21527)
  Language update from LingoHub 🤖 on 2021-04-12Z (#21530)
  Chore: Increase testing coverage on password policy class (#21482)
  Chore: Meteor update to 2.1.1 (#21494)
  Chore: Do not stop animations on Test Mode (#21484)
  Chore: Remove control character from room model operation (#21493)
  [NEW] New set of rules for client code (#21318)
  Bump version to 3.13.1
  [FIX] Header component breaking if user is not part of teams room (#21465)
  [FIX] Admin Users list pagination (#21469)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
3 participants
@tassoevan @ankar84 @ggazzo