Merge remote-tracking branch 'upstream/develop' into refactor/fronten…

…d-404 # Conflicts: # client/modules/Preview/EmbedFrame.jsx
processing · Sep 24, 2023 · b074688 · b074688
2 parents d51e156 + ca74574
commit b074688
Show file tree

Hide file tree

Showing 7 changed files with 96 additions and 76 deletions.
diff --git a/client/components/Nav/NavBar.jsx b/client/components/Nav/NavBar.jsx
@@ -71,7 +71,10 @@ function NavBar({ children, className }) {
         onFocus: clearHideTimeout
       }),
       createMenuItemHandlers: (dropdown) => ({
-        onMouseUp: () => {
+        onMouseUp: (e) => {
+          if (e.button === 2) {
+            return;
+          }
           setDropdownOpen('none');
         },
         onBlur: handleBlur,

diff --git a/client/modules/IDE/actions/assets.js b/client/modules/IDE/actions/assets.js
@@ -11,20 +11,18 @@ function setAssets(assets, totalSize) {
 }
 
 export function getAssets() {
-  return (dispatch) => {
+  return async (dispatch) => {
     dispatch(startLoader());
-    apiClient
-      .get('/S3/objects')
-      .then((response) => {
-        dispatch(setAssets(response.data.assets, response.data.totalSize));
-        dispatch(stopLoader());
-      })
-      .catch(() => {
-        dispatch({
-          type: ActionTypes.ERROR
-        });
-        dispatch(stopLoader());
+    try {
+      const response = await apiClient.get('/S3/objects');
+      dispatch(setAssets(response.data.assets, response.data.totalSize));
+      dispatch(stopLoader());
+    } catch (error) {
+      dispatch({
+        type: ActionTypes.ERROR
       });
+      dispatch(stopLoader());
+    }
   };
 }
 
@@ -36,16 +34,14 @@ export function deleteAsset(assetKey) {
 }
 
 export function deleteAssetRequest(assetKey) {
-  return (dispatch) => {
-    apiClient
-      .delete(`/S3/${assetKey}`)
-      .then((response) => {
-        dispatch(deleteAsset(assetKey));
-      })
-      .catch(() => {
-        dispatch({
-          type: ActionTypes.ERROR
-        });
+  return async (dispatch) => {
+    try {
+      await apiClient.delete(`/S3/${assetKey}`);
+      dispatch(deleteAsset(assetKey));
+    } catch (error) {
+      dispatch({
+        type: ActionTypes.ERROR
       });
+    }
   };
 }
diff --git a/client/modules/Preview/EmbedFrame.jsx b/client/modules/Preview/EmbedFrame.jsx
@@ -252,7 +252,7 @@ function injectLocalFiles(files, htmlFile, options) {
       'PREVIEW_SCRIPTS_URL'
     )}`;
     previewScripts.setAttribute('crossorigin', '');
-    sketchDoc.head.appendChild(previewScripts);
+    sketchDoc.body.appendChild(previewScripts);
 
     const sketchDocString = `<!DOCTYPE HTML>\n${sketchDoc.documentElement.outerHTML}`;
     const scriptOffs = getAllScriptOffsets(sketchDocString);

diff --git a/client/modules/User/components/LoginForm.jsx b/client/modules/User/components/LoginForm.jsx
@@ -20,13 +20,7 @@ function LoginForm() {
       validate={validateLogin}
       onSubmit={onSubmit}
     >
-      {({
-        handleSubmit,
-        submitError,
-        pristine,
-        submitting,
-        modifiedSinceLastSubmit
-      }) => (
+      {({ handleSubmit, submitError, submitting, modifiedSinceLastSubmit }) => (
         <form className="form" onSubmit={handleSubmit}>
           <Field name="email">
             {(field) => (
@@ -71,7 +65,7 @@ function LoginForm() {
           {submitError && !modifiedSinceLastSubmit && (
             <span className="form-error">{submitError}</span>
           )}
-          <Button type="submit" disabled={submitting || pristine}>
+          <Button type="submit" disabled={submitting}>
             {t('LoginForm.Submit')}
           </Button>
         </form>

diff --git a/client/modules/User/pages/EmailVerificationView.jsx b/client/modules/User/pages/EmailVerificationView.jsx
@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { useEffect } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { withTranslation } from 'react-i18next';
@@ -9,57 +9,51 @@ import { verifyEmailConfirmation } from '../actions';
 import RootPage from '../../../components/RootPage';
 import Nav from '../../IDE/components/Header/Nav';
 
-class EmailVerificationView extends React.Component {
-  static defaultProps = {
-    emailVerificationTokenState: null
-  };
-
-  componentWillMount() {
-    const verificationToken = this.verificationToken();
-    if (verificationToken != null) {
-      this.props.verifyEmailConfirmation(verificationToken);
-    }
-  }
+const EmailVerificationView = (props) => {
+  const { emailVerificationTokenState, location, t } = props;
 
-  verificationToken = () => {
-    const { location } = this.props;
+  const verificationTokenFromLocation = () => {
     const searchParams = new URLSearchParams(location.search);
     return searchParams.get('t');
   };
 
-  render() {
-    let status = null;
-    const { emailVerificationTokenState } = this.props;
-
-    if (this.verificationToken() == null) {
-      status = <p>{this.props.t('EmailVerificationView.InvalidTokenNull')}</p>;
-    } else if (emailVerificationTokenState === 'checking') {
-      status = <p>{this.props.t('EmailVerificationView.Checking')}</p>;
-    } else if (emailVerificationTokenState === 'verified') {
-      status = <p>{this.props.t('EmailVerificationView.Verified')}</p>;
-      setTimeout(() => browserHistory.push('/'), 1000);
-    } else if (emailVerificationTokenState === 'invalid') {
-      status = <p>{this.props.t('EmailVerificationView.InvalidState')}</p>;
+  useEffect(() => {
+    const verificationToken = verificationTokenFromLocation();
+    if (verificationToken != null) {
+      props.verifyEmailConfirmation(verificationToken);
     }
+  }, [location, props]);
 
-    return (
-      <RootPage>
-        <Nav layout="dashboard" />
-        <div className="form-container">
-          <Helmet>
-            <title>{this.props.t('EmailVerificationView.Title')}</title>
-          </Helmet>
-          <div className="form-container__content">
-            <h2 className="form-container__title">
-              {this.props.t('EmailVerificationView.Verify')}
-            </h2>
-            {status}
-          </div>
-        </div>
-      </RootPage>
-    );
+  let status = null;
+
+  if (verificationTokenFromLocation() == null) {
+    status = <p>{t('EmailVerificationView.InvalidTokenNull')}</p>;
+  } else if (emailVerificationTokenState === 'checking') {
+    status = <p>{t('EmailVerificationView.Checking')}</p>;
+  } else if (emailVerificationTokenState === 'verified') {
+    status = <p>{t('EmailVerificationView.Verified')}</p>;
+    setTimeout(() => browserHistory.push('/'), 1000);
+  } else if (emailVerificationTokenState === 'invalid') {
+    status = <p>{t('EmailVerificationView.InvalidState')}</p>;
   }
-}
+
+  return (
+    <RootPage>
+      <Nav layout="dashboard" />
+      <div className="form-container">
+        <Helmet>
+          <title>{t('EmailVerificationView.Title')}</title>
+        </Helmet>
+        <div className="form-container__content">
+          <h2 className="form-container__title">
+            {t('EmailVerificationView.Verify')}
+          </h2>
+          {status}
+        </div>
+      </div>
+    </RootPage>
+  );
+};
 
 function mapStateToProps(state) {
   return {
@@ -76,6 +70,10 @@ function mapDispatchToProps(dispatch) {
   );
 }
 
+EmailVerificationView.defaultProps = {
+  emailVerificationTokenState: null
+};
+
 EmailVerificationView.propTypes = {
   emailVerificationTokenState: PropTypes.oneOf([
     'checking',

diff --git a/client/styles/components/_form-container.scss b/client/styles/components/_form-container.scss
@@ -33,6 +33,7 @@
 	flex-direction: column;
 	justify-content: center;
 	align-items: center;
+	margin-bottom: 20px;
 }
 
 .form-container--align-left .form-container__content {
@@ -71,3 +72,6 @@
 .form-container__stack > * + * {
 	margin-top: #{10 / $base-font-size}rem;
 }
+.form__navigation-options a {
+	font-weight: bold;
+  }
diff --git a/contributor_docs/release.md b/contributor_docs/release.md
@@ -25,3 +25,28 @@ This project release guide is based on
 
 Travis CI will automatically deploy the release to production, as well as push a production tagged Docker image to DockerHub.
 
+
+## Steps for a Patch Release
+Sometimes you might need to push a release for an isolated and small bug fix without what's currently been merged into the `develop` branch. The steps for pushing a Patch Release are similar to a standard Release, except you work with the `release` branch as opposed to `develop`.
+
+1. `$ git checkout release`
+2. `$ git pull origin release`
+3. `$ git checkout -b release-<newversion>` (increment patch version)
+4. Do all of the release branch testing necessary. This could be as simple as running `npm test:ci`, or it could take user testing over a few days.
+5. `$ npm version <newversion>` (see [npm-version](https://docs.npmjs.com/cli/version) for valid values of )(npm version patch).
+6. `$ git checkout release`
+7. `$ git merge --no-ff release-<newversion>`
+8. `$ git push && git push --tags`
+9. `$ git checkout develop`
+10. `$ git merge --no-ff release-<newversion>`
+11. `$ git push origin develop`
+12. [Draft a new release on Github](https://github.com/processing/p5.js-web-editor/releases/new). Choose the tag that is the release version you just created, and then title it `v<newversion>`. Then click "Generate release notes". Publish the release and you are finished!
+
+### What if the PR Bug Fix is branched from `develop`?
+
+1. Make a copy of the branch locally: `gh pr checkout ##`
+2. `git checkout release`
+3. `git pull origin release`
+4. `git checkout -b <descriptive-branch-name>`
+5. `git cherry-pick <every sha in PR branch>`
+6. Make a new PR that merges into `release` (has a base branch `release`)