From ebc0201d44a10f124158c2f020e153aee7ff53c9 Mon Sep 17 00:00:00 2001 From: Julien Wajsberg Date: Thu, 15 Oct 2020 18:26:02 +0200 Subject: [PATCH 01/12] Use button for menu buttons --- .../shared/ButtonWithPanel/index.js | 9 ++-- .../ButtonWithPanel.test.js.snap | 42 +++++++++++-------- .../ListOfPublishedProfiles.test.js.snap | 7 ++-- .../__snapshots__/MenuButtons.test.js.snap | 14 ++++--- .../UploadedRecordingsHome.test.js.snap | 7 ++-- 5 files changed, 45 insertions(+), 34 deletions(-) diff --git a/src/components/shared/ButtonWithPanel/index.js b/src/components/shared/ButtonWithPanel/index.js index a1a0eb77c9..1ca5e8d386 100644 --- a/src/components/shared/ButtonWithPanel/index.js +++ b/src/components/shared/ButtonWithPanel/index.js @@ -52,7 +52,7 @@ type State = {| export class ButtonWithPanel extends React.PureComponent { _panel: ArrowPanel | null = null; - _buttonRef = React.createRef(); + _buttonRef = React.createRef(); _wrapperRef = React.createRef(); constructor(props: Props) { @@ -169,15 +169,16 @@ export class ButtonWithPanel extends React.PureComponent { className={classNames('buttonWithPanel', className, { open })} ref={this._wrapperRef} > - + > + {label} + - + > + My Button +
@@ -35,13 +36,14 @@ exports[`shared/ButtonWithPanel opens the panel when the button is clicked and c
- + > + My Button +
@@ -67,12 +69,13 @@ exports[`shared/ButtonWithPanel opens the panel when the button is clicked and c
- + > + My Button +
@@ -98,13 +101,14 @@ exports[`shared/ButtonWithPanel opens the panel when the button is clicked and c
- + > + My Button +
@@ -130,12 +134,13 @@ exports[`shared/ButtonWithPanel renders a button with a panel 1`] = `
- + > + My Button +
@@ -161,12 +166,13 @@ exports[`shared/ButtonWithPanel renders the ButtonWithPanel with a closed panel
- + > + My Button +
`; diff --git a/src/test/components/__snapshots__/ListOfPublishedProfiles.test.js.snap b/src/test/components/__snapshots__/ListOfPublishedProfiles.test.js.snap index 601a17d3c1..30ffea1b10 100644 --- a/src/test/components/__snapshots__/ListOfPublishedProfiles.test.js.snap +++ b/src/test/components/__snapshots__/ListOfPublishedProfiles.test.js.snap @@ -343,13 +343,14 @@ exports[`ListOfPublishedProfiles renders action buttons when appropriate 1`] = `
- + > + Delete +
diff --git a/src/test/components/__snapshots__/MenuButtons.test.js.snap b/src/test/components/__snapshots__/MenuButtons.test.js.snap index ebb8075d3f..42aca49358 100644 --- a/src/test/components/__snapshots__/MenuButtons.test.js.snap +++ b/src/test/components/__snapshots__/MenuButtons.test.js.snap @@ -600,22 +600,24 @@ exports[`app/MenuButtons matches the snapshot for the closed state 1`] - + > + Delete +
From 5c41176776e9d7bb25ad0061b3025c66ce7ab348 Mon Sep 17 00:00:00 2001 From: Julien Wajsberg Date: Thu, 8 Oct 2020 22:21:49 +0200 Subject: [PATCH 02/12] Implement a function to determine the upload status --- src/components/app/MenuButtons/index.js | 30 +++++++++++++++++-- src/test/components/ProfileViewer.test.js | 36 ++++++++++++++++++----- 2 files changed, 57 insertions(+), 9 deletions(-) diff --git a/src/components/app/MenuButtons/index.js b/src/components/app/MenuButtons/index.js index 5cdd4f230f..7593f4f634 100644 --- a/src/components/app/MenuButtons/index.js +++ b/src/components/app/MenuButtons/index.js @@ -32,6 +32,7 @@ import { getUploadPhase, getHasPrePublishedState, } from 'firefox-profiler/selectors/publish'; +import { assertExhaustiveCheck } from 'firefox-profiler/utils/flow'; import { resymbolicateProfile } from 'firefox-profiler/actions/receive-profile'; @@ -78,8 +79,32 @@ class MenuButtonsImpl extends React.PureComponent { this.props.dismissNewlyPublished(); } + _getUploadedStatus(dataSource: DataSource) { + switch (dataSource) { + case 'public': + case 'compare': + case 'from-url': + return 'uploaded'; + case 'from-addon': + case 'from-file': + return 'local'; + case 'none': + case 'uploaded-recordings': + case 'local': + throw new Error(`The datasource ${dataSource} shouldn't happen here.`); + default: + throw assertExhaustiveCheck(dataSource); + } + } + _renderMetaInfoButton() { - const { profile, symbolicationStatus, resymbolicateProfile } = this.props; + const { + profile, + symbolicationStatus, + resymbolicateProfile, + dataSource, + } = this.props; + const uploadedStatus = this._getUploadedStatus(dataSource); return ( { ); } - const isRepublish = dataSource === 'public' || dataSource === 'compare'; + const uploadedStatus = this._getUploadedStatus(dataSource); + const isRepublish = uploadedStatus === 'uploaded'; const isError = uploadPhase === 'error'; let label = 'Publish…'; diff --git a/src/test/components/ProfileViewer.test.js b/src/test/components/ProfileViewer.test.js index 9a3f992f61..8deda92582 100644 --- a/src/test/components/ProfileViewer.test.js +++ b/src/test/components/ProfileViewer.test.js @@ -6,14 +6,19 @@ import * as React from 'react'; import ReactDOM from 'react-dom'; -import { ProfileViewer } from '../../components/app/ProfileViewer'; import { render } from '@testing-library/react'; import { Provider } from 'react-redux'; -import { storeWithProfile } from '../fixtures/stores'; + +import { ProfileViewer } from 'firefox-profiler/components/app/ProfileViewer'; +import { getTimelineHeight } from 'firefox-profiler/selectors/app'; +import { updateUrlState } from 'firefox-profiler/actions/app'; +import { viewProfile } from 'firefox-profiler/actions/receive-profile'; +import { stateFromLocation } from 'firefox-profiler/app-logic/url-handling'; + +import { blankStore } from '../fixtures/stores'; import { getProfileWithNiceTracks } from '../fixtures/profiles/tracks'; import { getBoundingBox } from '../fixtures/utils'; import mockCanvasContext from '../fixtures/mocks/canvas-context'; -import { getTimelineHeight } from '../../selectors/app'; import mockRaf from '../fixtures/mocks/request-animation-frame'; describe('ProfileViewer', function() { @@ -37,12 +42,23 @@ describe('ProfileViewer', function() { .mockImplementation(() => ctx); }); - it('calculates the full timeline height correctly', () => { + function setup() { // WithSize uses requestAnimationFrame const flushRafCalls = mockRaf(); - const store = storeWithProfile(getProfileWithNiceTracks()); - render( + const store = blankStore(); + store.dispatch( + updateUrlState( + stateFromLocation({ + pathname: '/from-addon', + search: '', + hash: '', + }) + ) + ); + store.dispatch(viewProfile(getProfileWithNiceTracks())); + + const renderResult = render( @@ -51,7 +67,13 @@ describe('ProfileViewer', function() { // Flushing the requestAnimationFrame calls so we can see the actual height of tracks. flushRafCalls(); + return { ...renderResult, ...store }; + } + + it('calculates the full timeline height correctly', () => { + const { getState } = setup(); + // Note: You should update this total height if you changed the height calculation algorithm. - expect(getTimelineHeight(store.getState())).toBe(1250); + expect(getTimelineHeight(getState())).toBe(1250); }); }); From 11b88a1b3670ffd5b9ade55600fdb1ae3c4685ed Mon Sep 17 00:00:00 2001 From: Greg Tatum Date: Tue, 10 Nov 2020 11:34:11 -0600 Subject: [PATCH 03/12] Add 12x12 icons --- res/img/svg/cloud-dark-12.svg | 13 +++++++++++++ res/img/svg/cloud-off-dark-12.svg | 11 +++++++++++ res/img/svg/link-dark-12.svg | 10 ++++++++++ res/img/svg/share-dark-12.svg | 10 ++++++++++ res/img/svg/undo-dark-12.svg | 9 +++++++++ 5 files changed, 53 insertions(+) create mode 100644 res/img/svg/cloud-dark-12.svg create mode 100644 res/img/svg/cloud-off-dark-12.svg create mode 100644 res/img/svg/link-dark-12.svg create mode 100644 res/img/svg/share-dark-12.svg create mode 100644 res/img/svg/undo-dark-12.svg diff --git a/res/img/svg/cloud-dark-12.svg b/res/img/svg/cloud-dark-12.svg new file mode 100644 index 0000000000..5c8b706662 --- /dev/null +++ b/res/img/svg/cloud-dark-12.svg @@ -0,0 +1,13 @@ + + + + + + diff --git a/res/img/svg/cloud-off-dark-12.svg b/res/img/svg/cloud-off-dark-12.svg new file mode 100644 index 0000000000..9d33d6b782 --- /dev/null +++ b/res/img/svg/cloud-off-dark-12.svg @@ -0,0 +1,11 @@ + + + + + diff --git a/res/img/svg/link-dark-12.svg b/res/img/svg/link-dark-12.svg new file mode 100644 index 0000000000..b2cdca02af --- /dev/null +++ b/res/img/svg/link-dark-12.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/res/img/svg/share-dark-12.svg b/res/img/svg/share-dark-12.svg new file mode 100644 index 0000000000..7d0f166df5 --- /dev/null +++ b/res/img/svg/share-dark-12.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/res/img/svg/undo-dark-12.svg b/res/img/svg/undo-dark-12.svg new file mode 100644 index 0000000000..e242d48d52 --- /dev/null +++ b/res/img/svg/undo-dark-12.svg @@ -0,0 +1,9 @@ + + + + + + + From 878a7383459cc5cc44b82ea955d13c2e64410b4d Mon Sep 17 00:00:00 2001 From: Julien Wajsberg Date: Thu, 8 Oct 2020 22:21:49 +0200 Subject: [PATCH 04/12] Menu buttons refresh --- src/components/app/MenuButtons/Permalink.css | 4 + src/components/app/MenuButtons/Permalink.js | 3 +- src/components/app/MenuButtons/Publish.css | 35 +++- src/components/app/MenuButtons/Publish.js | 4 +- src/components/app/MenuButtons/index.css | 59 ++++++- src/components/app/MenuButtons/index.js | 29 ++-- src/components/app/ProfileName.css | 12 +- src/test/components/MenuButtons.test.js | 50 ++++-- .../__snapshots__/MenuButtons.test.js.snap | 164 +++++++++++++++++- 9 files changed, 310 insertions(+), 50 deletions(-) diff --git a/src/components/app/MenuButtons/Permalink.css b/src/components/app/MenuButtons/Permalink.css index d44f9a4527..af420f59e8 100644 --- a/src/components/app/MenuButtons/Permalink.css +++ b/src/components/app/MenuButtons/Permalink.css @@ -2,6 +2,10 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ +.menuButtonsPermalinkButtonButton::before { + background-image: url(firefox-profiler-res/img/svg/link-dark.svg); +} + .menuButtonsPermalinkPanel .arrowPanelContent { /* Override the default padding for ArrowPanel */ padding: 4px; diff --git a/src/components/app/MenuButtons/Permalink.js b/src/components/app/MenuButtons/Permalink.js index d83347e258..9c07e75ee0 100644 --- a/src/components/app/MenuButtons/Permalink.js +++ b/src/components/app/MenuButtons/Permalink.js @@ -71,8 +71,7 @@ export class MenuButtonsPermalink extends React.PureComponent { render() { return ( .menuButtonsShareButtonError, +.menuButtonsShareButtonError:hover:active { + background-color: var(--red-80); +} + +.menuButtonsShareButtonError::before { + background-image: url(firefox-profiler-res/img/svg/error.svg); +} + .menuButtonsPublishPanel { --width: 510px; } diff --git a/src/components/app/MenuButtons/Publish.js b/src/components/app/MenuButtons/Publish.js index 0784b8b805..9a8c596b8c 100644 --- a/src/components/app/MenuButtons/Publish.js +++ b/src/components/app/MenuButtons/Publish.js @@ -121,7 +121,7 @@ class MenuButtonsPublishImpl extends React.PureComponent {

{isRepublish - ? 'Re-publish Performance Profile' + ? 'Re-upload Performance Profile' : 'Share Performance Profile'}

@@ -167,7 +167,7 @@ class MenuButtonsPublishImpl extends React.PureComponent { className="photon-button photon-button-primary menuButtonsPublishButton menuButtonsPublishButtonsUpload" > - Publish + Upload

diff --git a/src/components/app/MenuButtons/index.css b/src/components/app/MenuButtons/index.css index b2e7208cd7..eb84a90e93 100644 --- a/src/components/app/MenuButtons/index.css +++ b/src/components/app/MenuButtons/index.css @@ -6,9 +6,8 @@ display: flex; height: 100%; align-items: center; - padding: 0 20px; + padding: 0 12px; border: 0; - border-left: 1px solid var(--grey-30); margin: 0; background: none; @@ -27,16 +26,62 @@ background-color: rgba(0, 0, 0, 0.2); } +/* Use this class if a button has an icon */ +.menuButtonsButtonButton__hasIcon::before { + /* The icon size and width and height are defined as 1em so that it's adjusted automatically + * with the font-size. Then it has 4px padding on the right side (because it's + * at the left of the content), and the image is at the left of this space. + * So here is the layout for this element: + * <-left padding-> <-ICON (1em)-> <-4px-> CONTENT + */ + width: 1em; + height: 1em; + padding-right: 4px; + background: no-repeat left/1em; + content: ''; +} + .menuButtonsLink { position: relative; /* This allows positioning the ::before element. */ cursor: default; text-decoration: none; } +/* We're using ::after because ::before is used for icons. Even if the docs link + * doesn't define its icon like this yet, this is more future-proof. + */ +.menuButtonsLink::after { + position: absolute; + top: 4px; + left: 0; + width: 1px; + height: calc(100% - 8px); + background: var(--grey-30); + content: ''; +} + +/* This icon is defined as a separate element, so that it can possibly be reused + * in other places. */ .open-in-new { - padding: 10px; - background-image: url(firefox-profiler-res/img/svg/open-in-new.svg); - background-position: center; - background-repeat: no-repeat; - background-size: 11px; + /* The icon size and width and height are defined as 1em so that it's adjusted automatically + * with the font-size. Then it has 4px padding on the left side (because it's + * at the right of the content), and the image is at the right of this space. + */ + width: 1em; + height: 1em; + padding-left: 4px; + background: url(firefox-profiler-res/img/svg/open-in-new.svg) no-repeat right / + 1em; +} + +.menuButtonsMetaInfoButtonButton__uploaded::before { + background-image: url(firefox-profiler-res/img/svg/material/cloud_on.svg); +} + +.menuButtonsMetaInfoButtonButton__local::before { + background-image: url(firefox-profiler-res/img/svg/material/cloud_off.svg); +} + +.menuButtonsRevertButton::before { + background-image: url(firefox-profiler-res/img/svg/undo-dark.svg); } diff --git a/src/components/app/MenuButtons/index.js b/src/components/app/MenuButtons/index.js index 7593f4f634..46130d2119 100644 --- a/src/components/app/MenuButtons/index.js +++ b/src/components/app/MenuButtons/index.js @@ -108,8 +108,10 @@ class MenuButtonsImpl extends React.PureComponent { return ( { return (
matches the snapshot for the closed state 1`]
`; +exports[`app/MenuButtons matches the snapshot for the menu buttons and the opened panel for an already uploaded profile 1`] = ` + +`; + +exports[`app/MenuButtons matches the snapshot for the menu buttons and the opened panel for an already uploaded profile 2`] = ` +
+ +`; + exports[`app/MenuButtons matches the snapshot for the opened panel for a nightly profile 1`] = `
matches the snapshot for the opened panel for - Publish + Upload
@@ -833,7 +983,7 @@ exports[`app/MenuButtons matches the snapshot for the opened panel for - Publish + Upload
From 39ae656b3d9a506190b9cc39059a6a9601d213ae Mon Sep 17 00:00:00 2001 From: Julien Wajsberg Date: Tue, 17 Nov 2020 14:42:56 +0100 Subject: [PATCH 05/12] Review comment: Extract the menu buttons border into their own classes This isn't strictly necessary, but now this is more self-documented. --- src/components/app/MenuButtons/index.css | 18 ++++++++++++------ src/components/app/MenuButtons/index.js | 2 +- src/components/app/ProfileName.css | 14 -------------- src/components/app/ProfileName.js | 2 +- .../__snapshots__/MenuButtons.test.js.snap | 4 ++-- .../__snapshots__/ProfileName.test.js.snap | 2 +- 6 files changed, 17 insertions(+), 25 deletions(-) diff --git a/src/components/app/MenuButtons/index.css b/src/components/app/MenuButtons/index.css index eb84a90e93..85a0da7a98 100644 --- a/src/components/app/MenuButtons/index.css +++ b/src/components/app/MenuButtons/index.css @@ -3,6 +3,7 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ .menuButtonsButton { + position: relative; /* This allows to absolutely position its children */ display: flex; height: 100%; align-items: center; @@ -42,24 +43,29 @@ } .menuButtonsLink { - position: relative; /* This allows positioning the ::before element. */ cursor: default; text-decoration: none; } -/* We're using ::after because ::before is used for icons. Even if the docs link - * doesn't define its icon like this yet, this is more future-proof. - */ -.menuButtonsLink::after { +/* We're using ::after for borders because ::before is used for icons. */ +.menuButtonsButton-hasRightBorder::after, +.menuButtonsButton-hasLeftBorder::after { position: absolute; top: 4px; - left: 0; width: 1px; height: calc(100% - 8px); background: var(--grey-30); content: ''; } +.menuButtonsButton-hasLeftBorder::after { + left: 0; +} + +.menuButtonsButton-hasRightBorder::after { + right: 0; +} + /* This icon is defined as a separate element, so that it can possibly be reused * in other places. */ .open-in-new { diff --git a/src/components/app/MenuButtons/index.js b/src/components/app/MenuButtons/index.js index 46130d2119..ff0bb73b7f 100644 --- a/src/components/app/MenuButtons/index.js +++ b/src/components/app/MenuButtons/index.js @@ -212,7 +212,7 @@ class MenuButtonsImpl extends React.PureComponent { Docs diff --git a/src/components/app/ProfileName.css b/src/components/app/ProfileName.css index 74c6caa5fd..5c9b23fc90 100644 --- a/src/components/app/ProfileName.css +++ b/src/components/app/ProfileName.css @@ -15,28 +15,14 @@ } .profileNameButton { - position: relative; /* to be able to position the right border */ overflow: hidden; padding: 0 9px; - border: none; - color: var(--grey-60); - font: inherit; font-weight: 700; margin-inline-end: 5px; text-overflow: ellipsis; white-space: nowrap; } -.profileNameButton::after { - position: absolute; - top: 4px; - right: 0; - width: 1px; - height: calc(100% - 8px); - background: var(--grey-30); - content: ''; -} - /* Using the style for links rather than for normal inputs, because we don't * want to trigger a border that would move things around. */ .profileNameInput:focus { diff --git a/src/components/app/ProfileName.js b/src/components/app/ProfileName.js index b172f8cc50..96ff5075f6 100644 --- a/src/components/app/ProfileName.js +++ b/src/components/app/ProfileName.js @@ -124,7 +124,7 @@ class ProfileNameImpl extends React.PureComponent { display: isFocused ? 'none' : 'block', }} title={title} - className="profileNameButton menuButtonsButton" + className="profileNameButton menuButtonsButton menuButtonsButton-hasRightBorder" onFocus={this.handleButtonFocus} onClick={this.handleButtonFocus} > diff --git a/src/test/components/__snapshots__/MenuButtons.test.js.snap b/src/test/components/__snapshots__/MenuButtons.test.js.snap index fa7d3caa1c..74ecee177a 100644 --- a/src/test/components/__snapshots__/MenuButtons.test.js.snap +++ b/src/test/components/__snapshots__/MenuButtons.test.js.snap @@ -620,7 +620,7 @@ exports[`app/MenuButtons matches the snapshot for the closed state 1`]
matches the snapshot for the menu buttons and
matches the snapshot for the menu buttons and
Date: Tue, 17 Nov 2020 19:41:40 +0100 Subject: [PATCH 11/12] Add a few comments to the menu buttons CSS files --- src/components/app/MenuButtons/Permalink.css | 2 ++ src/components/app/MenuButtons/index.css | 17 +++++++++++++---- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/src/components/app/MenuButtons/Permalink.css b/src/components/app/MenuButtons/Permalink.css index e751597488..3c0d53c1bb 100644 --- a/src/components/app/MenuButtons/Permalink.css +++ b/src/components/app/MenuButtons/Permalink.css @@ -2,6 +2,8 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ +/* This background image builds on the generic styles defined in + * MenuButtons/index.css when using an icon. */ .menuButtonsPermalinkButtonButton::before { background-image: url(firefox-profiler-res/img/svg/link-dark-12.svg); } diff --git a/src/components/app/MenuButtons/index.css b/src/components/app/MenuButtons/index.css index e07723d78f..81a18effca 100644 --- a/src/components/app/MenuButtons/index.css +++ b/src/components/app/MenuButtons/index.css @@ -2,6 +2,8 @@ * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ +/* Use this class to implement a button in the top menu bar. + * This overrides most browser styles, for both links and buttons. */ /* stylelint-disable order/properties-order */ .menuButtonsButton { position: relative; /* This allows to absolutely position its children */ @@ -12,11 +14,12 @@ border: 0; margin: 0; background: none; + white-space: nowrap; - /* Inherit the color rather than using the browser's */ + /* Inherit some properties values from the environment, rather than using the + * browser default for buttons or links. */ color: inherit; - font-size: 100%; - white-space: nowrap; + font-size: inherit; /* These 2 styles are specific for links. */ cursor: default; @@ -49,7 +52,10 @@ content: ''; } -/* We're using ::after for borders because ::before is used for icons. */ +/* These classes define respectively a right or a left border. We use ::after for + * both of them, so one element won't be able to have both a right and a left + * borders with this technique. + * We're using ::after for borders because ::before is used for icons. */ .menuButtonsButton-hasRightBorder::after, .menuButtonsButton-hasLeftBorder::after { position: absolute; @@ -83,6 +89,8 @@ right / 12px; } +/* These classes define respective states for the metainfo button. They change + * the icon whose generic styles are defined above. */ .menuButtonsMetaInfoButtonButton-uploaded::before { background-image: url(firefox-profiler-res/img/svg/cloud-dark-12.svg); } @@ -91,6 +99,7 @@ background-image: url(firefox-profiler-res/img/svg/cloud-off-dark-12.svg); } +/* This is the revert button, appearing after publishing a profile. */ .menuButtonsRevertButton::before { background-image: url(firefox-profiler-res/img/svg/undo-dark-12.svg); } From a8760084b72217aafafefd165feefee0130668ed Mon Sep 17 00:00:00 2001 From: Julien Wajsberg Date: Tue, 17 Nov 2020 20:05:27 +0100 Subject: [PATCH 12/12] Review comment: Change remaining UI still using the name 'publish' --- src/components/app/ListOfPublishedProfiles.js | 2 +- src/components/app/MenuButtons/Publish.js | 6 +++--- src/test/components/UploadedRecordingsHome.test.js | 2 +- .../__snapshots__/ListOfPublishedProfiles.test.js.snap | 2 +- src/test/components/__snapshots__/MenuButtons.test.js.snap | 2 +- .../__snapshots__/UploadedRecordingsHome.test.js.snap | 2 +- 6 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/app/ListOfPublishedProfiles.js b/src/components/app/ListOfPublishedProfiles.js index 5c16232931..65140ee45c 100644 --- a/src/components/app/ListOfPublishedProfiles.js +++ b/src/components/app/ListOfPublishedProfiles.js @@ -226,7 +226,7 @@ export class ListOfPublishedProfiles extends PureComponent { if (!profileDataList.length) { return ( -

No profile has been published yet!

+

No profile has been uploaded yet!

); } diff --git a/src/components/app/MenuButtons/Publish.js b/src/components/app/MenuButtons/Publish.js index 9a8c596b8c..80431cec6f 100644 --- a/src/components/app/MenuButtons/Publish.js +++ b/src/components/app/MenuButtons/Publish.js @@ -207,7 +207,7 @@ class MenuButtonsPublishImpl extends React.PureComponent { >
- Publishing profile… + Uploading profile…
{uploadProgressString} @@ -240,7 +240,7 @@ class MenuButtonsPublishImpl extends React.PureComponent { _renderErrorPanel() { const { error, resetUploadState } = this.props; let message: string = - 'There was an unknown error when trying to publish the profile.'; + 'There was an unknown error when trying to upload the profile.'; if ( error && typeof error === 'object' && @@ -259,7 +259,7 @@ class MenuButtonsPublishImpl extends React.PureComponent { data-testid="MenuButtonsPublish-container" >
- Uh oh, something went wrong when publishing the profile. + Uh oh, something went wrong when uploading the profile.
`; diff --git a/src/test/components/__snapshots__/MenuButtons.test.js.snap b/src/test/components/__snapshots__/MenuButtons.test.js.snap index c95a4a906b..349e75c3ce 100644 --- a/src/test/components/__snapshots__/MenuButtons.test.js.snap +++ b/src/test/components/__snapshots__/MenuButtons.test.js.snap @@ -579,7 +579,7 @@ exports[`app/MenuButtons matches the snapshot for an error 1`] = `
- Uh oh, something went wrong when publishing the profile. + Uh oh, something went wrong when uploading the profile.