Update logic and labels for settings updates preferences in Cloud and Enterprise (#16920)

frontend/src/metabase/admin/settings/components/SettingsUpdatesForm.jsx

@@ -3,6 +3,8 @@ import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { t, jt } from "ttag";
 import { Flex, Box } from "grid-styled";
+import cx from "classnames";
+
 import MetabaseSettings from "metabase/lib/settings";
 import SettingsSetting from "./SettingsSetting";
 
@@ -17,22 +19,25 @@ export default class SettingsUpdatesForm extends Component {
   };
 
   renderVersionUpdateNotice() {
+    const currentVersion = formatVersion(MetabaseSettings.currentVersion());
+
+    if (MetabaseSettings.isHosted()) {
+      return (
+        <div>{jt`Metabase Cloud keeps your instance up-to-date. You're currently on version ${currentVersion}. Thanks for being a customer!`}</div>
+      );
+    }
+
     if (MetabaseSettings.versionIsLatest()) {
-      const currentVersion = MetabaseSettings.currentVersion();
+      const shouldShowHostedCta = !MetabaseSettings.isEnterprise();
       return (
         <div>
           <div className="p2 bg-brand bordered rounded border-brand text-white text-bold">
-            {jt`You're running Metabase ${formatVersion(
-              currentVersion,
-            )} which is the latest and greatest!`}
+            {jt`You're running Metabase ${currentVersion} which is the latest and greatest!`}
           </div>
-          {!MetabaseSettings.isHosted() && !MetabaseSettings.isEnterprise() && (
-            <HostingCTA />
-          )}
+          {shouldShowHostedCta && <HostingCTA />}
         </div>
       );
     } else if (MetabaseSettings.newVersionAvailable()) {
-      const currentVersion = MetabaseSettings.currentVersion();
       const latestVersion = MetabaseSettings.latestVersion();
       const versionInfo = MetabaseSettings.versionInfo();
       return (
@@ -40,7 +45,7 @@ export default class SettingsUpdatesForm extends Component {
           <div className="p2 bg-green bordered rounded border-success flex flex-row align-center justify-between">
             <span className="text-white text-bold">
               {jt`Metabase ${formatVersion(latestVersion)} is available.`}{" "}
-              {jt`You're running ${formatVersion(currentVersion)}`}
+              {jt`You're running ${currentVersion}`}
             </span>
             <ExternalLink
               data-metabase-event={
@@ -75,10 +80,7 @@ export default class SettingsUpdatesForm extends Component {
         </div>
       );
     } else {
-      return (
-        <div>{t`Sorry, we were unable to check for updates at this time. Last successful check was
-         ${MetabaseSettings.versionInfoLastChecked()}.`}</div>
-      );
+      return <div>{t`No successful checks yet.`}</div>;
     }
   }
 
@@ -96,10 +98,14 @@ export default class SettingsUpdatesForm extends Component {
 
     return (
       <div style={{ width: "585px" }}>
-        <ul>{settings}</ul>
+        {!MetabaseSettings.isHosted() && <ul>{settings}</ul>}
 
         <div className="px2">
-          <div className="pt3 border-top">
+          <div
+            className={cx("pt3", {
+              "border-top": !MetabaseSettings.isHosted(),
+            })}
+          >
             {this.renderVersionUpdateNotice()}
           </div>
         </div>
@@ -131,6 +137,10 @@ function Version({ version }) {
 }
 
 function HostingCTA() {
+  if (MetabaseSettings.isEnterprise()) {
+    return null;
+  }
+
   return (
     <Flex
       justifyContent="space-between"

frontend/src/metabase/admin/settings/containers/SettingsEditorApp.jsx

@@ -3,9 +3,11 @@ import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { Link } from "react-router";
 import { connect } from "react-redux";
+import { t } from "ttag";
+
 import title from "metabase/hoc/Title";
 import MetabaseAnalytics from "metabase/lib/analytics";
-import { t } from "ttag";
+import MetabaseSettings from "metabase/lib/settings";
 import AdminLayout from "metabase/components/AdminLayout";
 import { NotFound } from "metabase/containers/ErrorPages";
 
@@ -185,17 +187,19 @@ export default class SettingsEditorApp extends Component {
         );
 
         // if this is the Updates section && there is a new version then lets add a little indicator
-        let newVersionIndicator;
-        if (slug === "updates" && newVersionAvailable) {
-          newVersionIndicator = (
-            <span
-              style={{ padding: "4px 8px 4px 8px" }}
-              className="bg-brand rounded text-white text-bold h6"
-            >
-              1
-            </span>
-          );
-        }
+        const shouldDisplayNewVersionIndicator =
+          slug === "updates" &&
+          newVersionAvailable &&
+          !MetabaseSettings.isHosted();
+
+        const newVersionIndicator = shouldDisplayNewVersionIndicator ? (
+          <span
+            style={{ padding: "4px 8px 4px 8px" }}
+            className="bg-brand rounded text-white text-bold h6"
+          >
+            1
+          </span>
+        ) : null;
 
         return (
           <li key={slug}>