Allow enabling end-to-end encryption again (#265)

packages/desktop-client/src/components/modals/CreateEncryptionKey.js

@@ -20,7 +20,6 @@ import { colors } from 'loot-design/src/style';
 export default function CreateEncryptionKey({
   modalProps,
   actions,
-  budgetId,
   options = {}
 }) {
   let [password, setPassword] = useState('');
@@ -79,8 +78,8 @@ export default function CreateEncryptionKey({
                   <li>
                     <strong>Important:</strong> if you forget this password{' '}
                     <em>and</em> you don't have any local copies of your data,
-                    you will lose access to all your data. We cannot decrypt
-                    your data.
+                    you will lose access to all your data. The data cannot be
+                    decrypted without the password.
                   </li>
                   <li>
                     This key only applies to this file. You will need to
@@ -91,6 +90,11 @@ export default function CreateEncryptionKey({
                     will need to reset them. Actual will automatically take you
                     through this process.
                   </li>
+                  <li>
+                    It is recommended for the encryption password to be
+                    different than the log-in password in order to better
+                    protect your data.
+                  </li>
                 </ul>
               </P>
             </>

packages/desktop-client/src/components/settings/Encryption.js

@@ -3,9 +3,12 @@ import React from 'react';
 import { Text, Button } from 'loot-design/src/components/common';
 import { colors } from 'loot-design/src/style';
 
+import { useServerURL } from '../../hooks/useServerURL';
 import { ButtonSetting } from './UI';
 
 export default function EncryptionSettings({ prefs, pushModal }) {
+  const serverURL = useServerURL();
+
   function onChangeKey() {
     pushModal('create-encryption-key', { recreate: true });
   }
@@ -19,30 +22,53 @@ export default function EncryptionSettings({ prefs, pushModal }) {
           End-to-end Encryption is turned on.
         </Text>{' '}
         Your data is encrypted with a key that only you have before sending it
-        out to the cloud . Local data remains unencrypted so if you forget your
-        password you can re-encrypt it.
+        it out to the cloud. Local data remains unencrypted so if you forget
+        your password you can re-encrypt it.{' '}
+        <a
+          href="https://actualbudget.github.io/docs/Getting-Started/sync/#encryption"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn more…
+        </a>
       </Text>
     </ButtonSetting>
-  ) : (
+  ) : serverURL ? (
     <ButtonSetting
       button={
-        <Button
-          onClick={() => {
-            alert(
-              'End-to-end encryption is not supported on the self-hosted service yet'
-            );
-            // pushModal('create-encryption-key');
-          }}
-        >
+        <Button onClick={() => pushModal('create-encryption-key')}>
           Enable encryption…
         </Button>
       }
     >
       <Text>
-        <strong>End-to-end encryption</strong> is not enabled. Any data on our
-        servers is still stored safely and securely, but it's not end-to-end
-        encrypted which means we have the ability to read it (but we won't). If
-        you want, you can use a password to encrypt your data on our servers.
+        <strong>End-to-end encryption</strong> is not enabled. Any data on the
+        server is still protected by the server password, but it's not
+        end-to-end encrypted which means the server owners have the ability to
+        read it. If you want, you can use an additional password to encrypt your
+        data on the server.{' '}
+        <a
+          href="https://actualbudget.github.io/docs/Getting-Started/sync/#encryption"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn more…
+        </a>
+      </Text>
+    </ButtonSetting>
+  ) : (
+    <ButtonSetting button={<Button disabled>Enable encryption…</Button>}>
+      <Text>
+        <strong>End-to-end encryption</strong> is not available when running
+        without a server. Budget files are always kept unencrypted locally, and
+        encryption is only applied when sending data to a server.{' '}
+        <a
+          href="https://actualbudget.github.io/docs/Getting-Started/sync/#encryption"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn more…
+        </a>
       </Text>
     </ButtonSetting>
   );