Desktop app now supports cloud variables

TurboWarp · May 16, 2024 · 0d87b07 · 0d87b07
1 parent 2f57551
commit 0d87b07
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 27 deletions.
diff --git a/src/components/prompt/prompt.jsx b/src/components/prompt/prompt.jsx
@@ -8,6 +8,7 @@ import Modal from '../../containers/modal.jsx';
 
 import styles from './prompt.css';
 import {SCRATCH_MAX_CLOUD_VARIABLES} from '../../lib/tw-cloud-limits.js';
+import isScratchDesktop from '../../lib/isScratchDesktop.js';
 
 
 const messages = defineMessages({
@@ -40,6 +41,17 @@ const messages = defineMessages({
     }
 });
 
+const Packager = () => (
+    <a
+        href="https://packager.turbowarp.org"
+        target="_blank"
+        rel="noopener noreferrer"
+    >
+        {/* Should not be translated */}
+        {'TurboWarp Packager'}
+    </a>
+);
+
 const PromptComponent = props => (
     <Modal
         className={styles.modalContent}
@@ -140,24 +152,28 @@ const PromptComponent = props => (
 
             {props.cloudSelected && props.canAddCloudVariable && (
                 <Box className={styles.infoMessage}>
-                    <FormattedMessage
-                        /* eslint-disable-next-line max-len */
-                        defaultMessage="Although you can create cloud variables, they won't work unless this project is uploaded to Scratch or converted using a tool like the {packager}."
-                        description="Reminder that cloud variables may not work when the editor is open"
-                        values={{
-                            packager: (
-                                <a
-                                    href="https://packager.turbowarp.org"
-                                    target="_blank"
-                                    rel="noopener noreferrer"
-                                >
-                                    {/* Should not be translated */}
-                                    {'TurboWarp Packager'}
-                                </a>
-                            )
-                        }}
-                        id="tw.cantUseCloud"
-                    />
+                    {isScratchDesktop() ? (
+                        <FormattedMessage
+                            // eslint-disable-next-line max-len
+                            defaultMessage="In the desktop app, cloud variables sync between all desktop app windows on this computer. Upload the project to Scratch or use a tool like the {packager} for them to sync globally."
+                            description="Appears when creating a cloud variable in the desktop app"
+                            values={{
+                                packager: <Packager />
+                            }}
+                            id="tw.desktopCloud"
+                        />
+                    ) : (
+                        <FormattedMessage
+                            /* eslint-disable-next-line max-len */
+                            defaultMessage="Although you can create cloud variables, they won't work unless this project is uploaded to Scratch or converted using a tool like the {packager}."
+                            // eslint-disable-next-line max-len
+                            description="Reminder that cloud variables may not work when the editor is open. {packager} is replaced with a link to open the TurboWarp Packager, always English."
+                            values={{
+                                packager: <Packager />
+                            }}
+                            id="tw.cantUseCloud"
+                        />
+                    )}
                 </Box>
             )}
 

diff --git a/src/containers/tw-cloud-toggler.jsx b/src/containers/tw-cloud-toggler.jsx
@@ -4,19 +4,13 @@ import React from 'react';
 import {defineMessages, injectIntl, intlShape} from 'react-intl';
 import {connect} from 'react-redux';
 import {setCloud} from '../reducers/tw';
-import isScratchDesktop from '../lib/isScratchDesktop';
 
 const messages = defineMessages({
     cloudUnavailableAlert: {
         defaultMessage: 'Cannot use cloud variables, most likely because you opened the editor.',
         // eslint-disable-next-line max-len
         description: 'Message displayed when clicking on the option to toggle cloud variables when cloud variables are not available',
         id: 'tw.menuBar.cloudUnavailableAlert'
-    },
-    cloudUnavailableDesktop: {
-        defaultMessage: 'Cannot use cloud variables in desktop app.',
-        description: 'Message displayed when clicking on the option to toggle cloud variables in desktop app',
-        id: 'tw.menuBar.cloudUnavailableDesktop'
     }
 });
 
@@ -29,9 +23,7 @@ class CloudVariablesToggler extends React.Component {
     }
     toggleCloudVariables () {
         if (!this.props.canUseCloudVariables) {
-            const message = this.props.intl.formatMessage(
-                isScratchDesktop() ? messages.cloudUnavailableDesktop : messages.cloudUnavailableAlert
-            );
+            const message = this.props.intl.formatMessage(messages.cloudUnavailableAlert);
             // eslint-disable-next-line no-alert
             alert(message);
             return;