Skip to content
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

docs: Adding Social Banner in Support of Ukraine #4397

Merged
merged 7 commits into from
Mar 2, 2022

Conversation

dmitryvinn-fb
Copy link
Contributor

Summary

Our mission at Meta Open Source is to empower communities through open source, and we believe that it means building a welcoming and safe environment for all. As a part of this work, we are adding this banner in support for Ukraine during this crisis.

Note: As a part of this work, I made a better distinction between Social banner which is more permanent element and Survey banner which is a part of temporary campaign that folks can dismiss.

Testing

image

image

image

@github-actions
Copy link

github-actions bot commented Mar 2, 2022

Size Changes

📦 Next.js Bundle Analysis

This analysis was generated by the next.js bundle analysis action 🤖

⚠️ Global Bundle Size Increased

Page Size (compressed)
global 95.16 KB (🟡 +52 B)
Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

One Hundred Eighty-seven Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page Size (compressed) First Load
/ 54.75 KB (🟡 +153 B) 149.91 KB
/404 53.86 KB (🟡 +154 B) 149.02 KB
/apis 54.44 KB (🟡 +153 B) 149.61 KB
/apis/reactdom 54.56 KB (🟡 +154 B) 149.72 KB
/apis/render 56.62 KB (🟡 +153 B) 151.78 KB
/apis/usecontext 62.35 KB (🟡 +153 B) 157.51 KB
/apis/useref 59.69 KB (🟡 +154 B) 154.86 KB
/apis/usestate 65.56 KB (🟡 +153 B) 160.73 KB
/blog 41.16 KB (🟡 +156 B) 136.32 KB
/blog/2013/06/02/jsfiddle-integration 65.14 KB (🟡 +156 B) 160.3 KB
/blog/2013/06/05/why-react 66.86 KB (🟡 +156 B) 162.03 KB
/blog/2013/06/12/community-roundup 66.57 KB (🟡 +156 B) 161.73 KB
/blog/2013/06/19/community-roundup-2 67.24 KB (🟡 +156 B) 162.4 KB
/blog/2013/06/21/react-v0-3-3 65.29 KB (🟡 +156 B) 160.45 KB
/blog/2013/06/27/community-roundup-3 67.6 KB (🟡 +156 B) 162.77 KB
/blog/2013/07/02/react-v0-4-autobind-by-default 65.9 KB (🟡 +156 B) 161.07 KB
/blog/2013/07/03/community-roundup-4 66.97 KB (🟡 +156 B) 162.14 KB
/blog/2013/07/11/react-v0-4-prop-validation-and-default-values 65.78 KB (🟡 +155 B) 160.94 KB
/blog/2013/07/17/react-v0-4-0 66.49 KB (🟡 +156 B) 161.65 KB
/blog/2013/07/23/community-roundup-5 67.37 KB (🟡 +156 B) 162.53 KB
/blog/2013/07/26/react-v0-4-1 65.25 KB (🟡 +156 B) 160.41 KB
/blog/2013/07/30/use-react-and-jsx-in-ruby-on-rails 65.85 KB (🟡 +156 B) 161.02 KB
/blog/2013/08/05/community-roundup-6 66.66 KB (🟡 +156 B) 161.82 KB
/blog/2013/08/19/use-react-and-jsx-in-python-applications 65.86 KB (🟡 +156 B) 161.03 KB
/blog/2013/08/26/community-roundup-7 66.83 KB (🟡 +156 B) 161.99 KB
/blog/2013/09/24/community-roundup-8 68.26 KB (🟡 +156 B) 163.42 KB
/blog/2013/10/03/community-roundup-9 67.2 KB (🟡 +156 B) 162.36 KB
/blog/2013/10/16/react-v0.5.0 66.88 KB (🟡 +156 B) 162.04 KB
/blog/2013/10/29/react-v0-5-1 65.24 KB (🟡 +156 B) 160.4 KB
/blog/2013/11/06/community-roundup-10 68.86 KB (🟡 +156 B) 164.02 KB
/blog/2013/11/18/community-roundup-11 67.94 KB (🟡 +156 B) 163.1 KB
/blog/2013/12/18/react-v0.5.2-v0.4.2 65.71 KB (🟡 +156 B) 160.87 KB
/blog/2013/12/19/react-v0.8.0 66.13 KB (🟡 +156 B) 161.29 KB
/blog/2013/12/23/community-roundup-12 67.59 KB (🟡 +156 B) 162.75 KB
/blog/2013/12/30/community-roundup-13 67.37 KB (🟡 +156 B) 162.54 KB
/blog/2014/01/02/react-chrome-developer-tools 65.63 KB (🟡 +156 B) 160.79 KB
/blog/2014/01/06/community-roundup-14 66.97 KB (🟡 +156 B) 162.13 KB
/blog/2014/02/05/community-roundup-15 68.18 KB (🟡 +154 B) 163.35 KB
/blog/2014/02/15/community-roundup-16 67.9 KB (🟡 +156 B) 163.06 KB
/blog/2014/02/16/react-v0.9-rc1 68.3 KB (🟡 +155 B) 163.46 KB
/blog/2014/02/20/react-v0.9 68.75 KB (🟡 +156 B) 163.91 KB
/blog/2014/02/24/community-roundup-17 67.61 KB (🟡 +156 B) 162.77 KB
/blog/2014/03/14/community-roundup-18 68.58 KB (🟡 +156 B) 163.74 KB
/blog/2014/03/19/react-v0.10-rc1 66.88 KB (🟡 +156 B) 162.05 KB
/blog/2014/03/21/react-v0.10 66.91 KB (🟡 +156 B) 162.07 KB
/blog/2014/03/28/the-road-to-1.0 67.02 KB (🟡 +156 B) 162.18 KB
/blog/2014/04/04/reactnet 65.66 KB (🟡 +156 B) 160.83 KB
/blog/2014/05/06/flux 65.79 KB (🟡 +156 B) 160.95 KB
/blog/2014/05/29/one-year-of-open-source-react 66.01 KB (🟡 +156 B) 161.17 KB
/blog/2014/06/27/community-roundup-19 67.55 KB (🟡 +156 B) 162.72 KB
/blog/2014/07/13/react-v0.11-rc1 67.94 KB (🟡 +156 B) 163.1 KB
/blog/2014/07/17/react-v0.11 69.2 KB (🟡 +156 B) 164.36 KB
/blog/2014/07/25/react-v0.11.1 66.15 KB (🟡 +157 B) 161.31 KB
/blog/2014/07/28/community-roundup-20 67.7 KB (🟡 +156 B) 162.86 KB
/blog/2014/07/30/flux-actions-and-the-dispatcher 67.33 KB (🟡 +156 B) 162.5 KB
/blog/2014/08/03/community-roundup-21 67.37 KB (🟡 +156 B) 162.53 KB
/blog/2014/09/03/introducing-the-jsx-specification 65.37 KB (🟡 +156 B) 160.53 KB
/blog/2014/09/12/community-round-up-22 67.85 KB (🟡 +156 B) 163.01 KB
/blog/2014/09/16/react-v0.11.2 66.14 KB (🟡 +156 B) 161.31 KB
/blog/2014/09/24/testing-flux-applications 69.32 KB (🟡 +156 B) 164.49 KB
/blog/2014/10/14/introducing-react-elements 68.28 KB (🟡 +156 B) 163.44 KB
/blog/2014/10/16/react-v0.12-rc1 68.24 KB (🟡 +156 B) 163.4 KB
/blog/2014/10/17/community-roundup-23 68.82 KB (🟡 +156 B) 163.98 KB
/blog/2014/10/27/react-js-conf 65.42 KB (🟡 +157 B) 160.58 KB
/blog/2014/10/28/react-v0.12 68.18 KB (🟡 +156 B) 163.35 KB
/blog/2014/11/24/react-js-conf-updates 65.8 KB (🟡 +156 B) 160.97 KB
/blog/2014/11/25/community-roundup-24 69.04 KB (🟡 +156 B) 164.2 KB
/blog/2014/12/18/react-v0.12.2 65.83 KB (🟡 +156 B) 160.99 KB
/blog/2014/12/19/react-js-conf-diversity-scholarship 66.23 KB (🟡 +156 B) 161.39 KB
/blog/2015/01/27/react-v0.13.0-beta-1 67.19 KB (🟡 +156 B) 162.36 KB
/blog/2015/02/18/react-conf-roundup-2015 69.18 KB (🟡 +156 B) 164.34 KB
/blog/2015/02/20/introducing-relay-and-graphql 68.33 KB (🟡 +156 B) 163.49 KB
/blog/2015/02/24/react-v0.13-rc1 67.23 KB (🟡 +156 B) 162.39 KB
/blog/2015/02/24/streamlining-react-elements 69.78 KB (🟡 +156 B) 164.95 KB
/blog/2015/03/03/react-v0.13-rc2 66.57 KB (🟡 +156 B) 161.73 KB
/blog/2015/03/04/community-roundup-25 67.53 KB (🟡 +156 B) 162.69 KB
/blog/2015/03/10/react-v0.13 67.85 KB (🟡 +156 B) 163.01 KB
/blog/2015/03/16/react-v0.13.1 65.67 KB (🟡 +155 B) 160.83 KB
/blog/2015/03/19/building-the-facebook-news-feed-with-relay 68.42 KB (🟡 +156 B) 163.59 KB
/blog/2015/03/26/introducing-react-native 65.56 KB (🟡 +156 B) 160.72 KB
/blog/2015/03/30/community-roundup-26 67.49 KB (🟡 +156 B) 162.66 KB
/blog/2015/04/17/react-native-v0.4 66.41 KB (🟡 +155 B) 161.57 KB
/blog/2015/04/18/react-v0.13.2 65.74 KB (🟡 +158 B) 160.91 KB
/blog/2015/05/01/graphql-introduction 70.23 KB (🟡 +156 B) 165.4 KB
/blog/2015/05/08/react-v0.13.3 65.63 KB (🟡 +156 B) 160.8 KB
/blog/2015/05/22/react-native-release-process 65.78 KB (🟡 +156 B) 160.95 KB
/blog/2015/06/12/deprecating-jstransform-and-react-tools 66.24 KB (🟡 +156 B) 161.4 KB
/blog/2015/07/03/react-v0.14-beta-1 67.75 KB (🟡 +156 B) 162.91 KB
/blog/2015/08/03/new-react-devtools-beta 66.35 KB (🟡 +156 B) 161.51 KB
/blog/2015/08/11/relay-technical-preview 66.41 KB (🟡 +156 B) 161.58 KB
/blog/2015/08/13/reacteurope-roundup 68 KB (🟡 +155 B) 163.16 KB
/blog/2015/09/02/new-react-developer-tools 65.77 KB (🟡 +158 B) 160.93 KB
/blog/2015/09/10/react-v0.14-rc1 71.45 KB (🟡 +156 B) 166.61 KB
/blog/2015/09/14/community-roundup-27 67.92 KB (🟡 +158 B) 163.09 KB
/blog/2015/10/01/react-render-and-top-level-api 66.9 KB (🟡 +156 B) 162.06 KB
/blog/2015/10/07/react-v0.14 71.94 KB (🟡 +156 B) 167.1 KB
/blog/2015/10/19/reactiflux-is-moving-to-discord 67.65 KB (🟡 +156 B) 162.81 KB
/blog/2015/10/28/react-v0.14.1 65.66 KB (🟡 +156 B) 160.82 KB
/blog/2015/11/02/react-v0.14.2 65.69 KB (🟡 +156 B) 160.85 KB
/blog/2015/11/18/react-v0.14.3 65.81 KB (🟡 +158 B) 160.97 KB
/blog/2015/12/04/react-js-conf-2016-diversity-scholarship 66.68 KB (🟡 +156 B) 161.85 KB
/blog/2015/12/16/ismounted-antipattern 66.28 KB (🟡 +156 B) 161.45 KB
/blog/2015/12/18/react-components-elements-and-instances 70.21 KB (🟡 +156 B) 165.37 KB
/blog/2015/12/29/react-v0.14.4 65.48 KB (🟡 +157 B) 160.64 KB
/blog/2016/01/08/A-implies-B-does-not-imply-B-implies-A 66.5 KB (🟡 +156 B) 161.66 KB
/blog/2016/01/12/discontinuing-ie8-support 65.3 KB (🟡 +156 B) 160.47 KB
/blog/2016/02/19/new-versioning-scheme 66.69 KB (🟡 +156 B) 161.85 KB
/blog/2016/03/07/react-v15-rc1 69.44 KB (🟡 +157 B) 164.6 KB
/blog/2016/03/16/react-v15-rc2 66.3 KB (🟡 +155 B) 161.46 KB
/blog/2016/03/29/react-v0.14.8 65.43 KB (🟡 +156 B) 160.6 KB
/blog/2016/04/07/react-v15 73.62 KB (🟡 +156 B) 168.79 KB
/blog/2016/04/08/react-v15.0.1 66.19 KB (🟡 +156 B) 161.35 KB
/blog/2016/07/11/introducing-reacts-error-code-system 65.9 KB (🟡 +156 B) 161.07 KB
/blog/2016/07/13/mixins-considered-harmful 74.05 KB (🟡 +156 B) 169.22 KB
/blog/2016/07/22/create-apps-with-no-configuration 69.38 KB (🟡 +156 B) 164.55 KB
/blog/2016/08/05/relay-state-of-the-state 69.42 KB (🟡 +156 B) 164.59 KB
/blog/2016/09/28/our-first-50000-stars 70.87 KB (🟡 +156 B) 166.03 KB
/blog/2016/11/16/react-v15.4.0 68.82 KB (🟡 +157 B) 163.99 KB
/blog/2017/04/07/react-v15.5.0 69.39 KB (🟡 +156 B) 164.55 KB
/blog/2017/05/18/whats-new-in-create-react-app 68.78 KB (🟡 +156 B) 163.95 KB
/blog/2017/06/13/react-v15.6.0 67.41 KB (🟡 +156 B) 162.57 KB
/blog/2017/07/26/error-handling-in-react-16 67.75 KB (🟡 +156 B) 162.92 KB
/blog/2017/09/08/dom-attributes-in-react-16 68.19 KB (🟡 +156 B) 163.35 KB
/blog/2017/09/25/react-v15.6.2 66.52 KB (🟡 +156 B) 161.68 KB
/blog/2017/09/26/react-v16.0 71.65 KB (🟡 +156 B) 166.81 KB
/blog/2017/11/28/react-v16.2.0-fragment-support 69.58 KB (🟡 +156 B) 164.75 KB
/blog/2017/12/07/introducing-the-react-rfc-process 66.1 KB (🟡 +156 B) 161.26 KB
/blog/2017/12/15/improving-the-repository-infrastructure 81.89 KB (🟡 +156 B) 177.06 KB
/blog/2018/03/01/sneak-peek-beyond-react-16 66.06 KB (🟡 +156 B) 161.22 KB
/blog/2018/03/27/update-on-async-rendering 71.3 KB (🟡 +156 B) 166.46 KB
/blog/2018/03/29/react-v-16-3 68.12 KB (🟡 +156 B) 163.29 KB
/blog/2018/05/23/react-v-16-4 68.26 KB (🟡 +156 B) 163.42 KB
/blog/2018/06/07/you-probably-dont-need-derived-state 71.92 KB (🟡 +156 B) 167.08 KB
/blog/2018/08/01/react-v-16-4-2 66.91 KB (🟡 +156 B) 162.07 KB
/blog/2018/09/10/introducing-the-react-profiler 68.52 KB (🟡 +156 B) 163.68 KB
/blog/2018/10/01/create-react-app-v2 69 KB (🟡 +156 B) 164.16 KB
/blog/2018/10/23/react-v-16-6 68.2 KB (🟡 +157 B) 163.36 KB
/blog/2018/11/13/react-conf-recap 65.91 KB (🟡 +157 B) 161.08 KB
/blog/2018/11/27/react-16-roadmap 72.1 KB (🟡 +156 B) 167.27 KB
/blog/2018/12/19/react-v-16-7 67.03 KB (🟡 +155 B) 162.2 KB
/blog/2019/02/06/react-v16.8.0 69.3 KB (🟡 +156 B) 164.46 KB
/blog/2019/02/23/is-react-translated-yet 68.86 KB (🟡 +156 B) 164.03 KB
/blog/2019/08/08/react-v16.9.0 71.8 KB (🟡 +156 B) 166.96 KB
/blog/2019/08/15/new-react-devtools 66.4 KB (🟡 +155 B) 161.57 KB
/blog/2019/10/22/react-release-channels 68.21 KB (🟡 +157 B) 163.38 KB
/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense 72.92 KB (🟡 +156 B) 168.08 KB
/blog/2020/02/26/react-v16.13.0 69.14 KB (🟡 +156 B) 164.3 KB
/blog/2020/08/10/react-v17-rc 75.42 KB (🟡 +156 B) 170.58 KB
/blog/all 57.16 KB (🟡 +156 B) 152.32 KB
/community 54.44 KB (🟡 +153 B) 149.6 KB
/community/acknowledgements 55.63 KB (🟡 +153 B) 150.8 KB
/community/meet-the-team 56.15 KB (🟡 +153 B) 151.32 KB
/learn 59.37 KB (🟡 +155 B) 154.53 KB
/learn/add-react-to-a-website 59.27 KB (🟡 +155 B) 154.43 KB
/learn/adding-interactivity 61.08 KB (🟡 +155 B) 156.24 KB
/learn/choosing-the-state-structure 66.81 KB (🟡 +155 B) 161.97 KB
/learn/conditional-rendering 59.04 KB (🟡 +154 B) 154.21 KB
/learn/describing-the-ui 58.26 KB (🟡 +155 B) 153.42 KB
/learn/editor-setup 55.57 KB (🟡 +155 B) 150.73 KB
/learn/escape-hatches 53.78 KB (🟡 +155 B) 148.94 KB
/learn/extracting-state-logic-into-a-reducer 64.44 KB (🟡 +155 B) 159.61 KB
/learn/importing-and-exporting-components 57.44 KB (🟡 +155 B) 152.6 KB
/learn/installation 55.1 KB (🟡 +155 B) 150.26 KB
/learn/javascript-in-jsx-with-curly-braces 57.51 KB (🟡 +154 B) 152.68 KB
/learn/keeping-components-pure 61.65 KB (🟡 +155 B) 156.81 KB
/learn/managing-state 60.37 KB (🟡 +155 B) 155.54 KB
/learn/manipulating-the-dom-with-refs 62.63 KB (🟡 +155 B) 157.79 KB
/learn/passing-data-deeply-with-context 61.79 KB (🟡 +155 B) 156.95 KB
/learn/passing-props-to-a-component 61.22 KB (🟡 +155 B) 156.38 KB
/learn/preserving-and-resetting-state 64.03 KB (🟡 +154 B) 159.19 KB
/learn/queueing-a-series-of-state-updates 59.01 KB (🟡 +155 B) 154.18 KB
/learn/react-developer-tools 54.97 KB (🟡 +155 B) 150.13 KB
/learn/reacting-to-input-with-state 63.49 KB (🟡 +155 B) 158.65 KB
/learn/referencing-values-with-refs 60.53 KB (🟡 +155 B) 155.7 KB
/learn/render-and-commit 57.51 KB (🟡 +154 B) 152.67 KB
/learn/rendering-lists 61.57 KB (🟡 +154 B) 156.73 KB
/learn/responding-to-events 60.56 KB (🟡 +155 B) 155.72 KB
/learn/scaling-up-with-reducer-and-context 58.58 KB (🟡 +155 B) 153.75 KB
/learn/sharing-state-between-components 59.29 KB (🟡 +155 B) 154.46 KB
/learn/start-a-new-react-project 55.94 KB (🟡 +155 B) 151.1 KB
/learn/state-a-components-memory 64.74 KB (🟡 +155 B) 159.9 KB
/learn/state-as-a-snapshot 58.56 KB (🟡 +155 B) 153.72 KB
/learn/thinking-in-react 60.38 KB (🟡 +155 B) 155.54 KB
/learn/updating-arrays-in-state 62.62 KB (🟡 +155 B) 157.78 KB
/learn/updating-objects-in-state 62.34 KB (🟡 +155 B) 157.5 KB
/learn/writing-markup-with-jsx 57.44 KB (🟡 +155 B) 152.61 KB
/learn/your-first-component 58.35 KB (🟡 +155 B) 153.51 KB
Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 10% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

Copy link
Member

@rickhanlonii rickhanlonii left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🇺🇦

@dmitryvinn-fb
Copy link
Contributor Author

Can anyone please help deciphering the lint errors? I can't figure out what I might have done wrong with formatting

@harish-sethuraman
Copy link
Collaborator

Try yarn format:source in the repo's root folder

@dmitryvinn-fb
Copy link
Contributor Author

Thank you - I just passed --check flag in a prettier command and found what the issue was. Had to format several files. Updating the PR now

@dmitryvinn-fb
Copy link
Contributor Author

Alrighty, it's good to go! We already added this banner to Jest, and working on other projects as we speak

@rickhanlonii
Copy link
Member

Thanks for this, I pushed some mobile fixes and added it to the beta site as well 🚀

@rickhanlonii rickhanlonii merged commit d90fd21 into reactjs:main Mar 2, 2022
@dushaobindoudou

This comment was marked as off-topic.

@zjp1300

This comment was marked as off-topic.

@jeffie

This comment was marked as off-topic.

@reactjs reactjs locked and limited conversation to collaborators Mar 3, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants