frontend/settings: move editor symbol bar labels to editor settings, because it is just relevant for the editors

Author: haraldschilly

src/packages/frontend/account/account-preferences-appearance.tsx

@@ -267,18 +267,6 @@ export function AccountPreferencesAppearance() {
             hides some button tooltips (this is only partial)`}
           />
         </Switch>
-        <Switch
-          checked={!!other_settings.get("show_symbol_bar_labels")}
-          onChange={(e) =>
-            on_change("show_symbol_bar_labels", e.target.checked)
-          }
-        >
-          <FormattedMessage
-            id="account.other-settings.symbol_bar_labels"
-            defaultMessage={`<strong>Show Symbol Bar Labels:</strong>
-            show labels in the frame editor symbol bar`}
-          />
-        </Switch>
         <Switch
           checked={!!other_settings.get("time_ago_absolute")}
           onChange={(e) => on_change("time_ago_absolute", e.target.checked)}

src/packages/frontend/account/editor-settings/checkboxes.tsx

@@ -99,6 +99,11 @@ const EDITOR_SETTINGS_CHECKBOXES = {
     defaultMessage: `<strong>Disable the markdown code bar</strong> in all markdown documents.
       Checking this hides the extra run, copy, and explain buttons in fenced code blocks.`,
   }),
+  show_symbol_bar_labels: defineMessage({
+    id: "account.other-settings.symbol_bar_labels",
+    defaultMessage:
+      "<strong>Show Symbol Bar Labels:</strong> show labels in the frame editor symbol bar",
+  }),
 } as const;
 
 // Type for valid checkbox keys
@@ -111,6 +116,7 @@ const DISPLAY_SETTINGS: readonly CheckboxKey[] = [
   "jupyter_line_numbers",
   "show_trailing_whitespace",
   "show_my_other_cursors",
+  "show_symbol_bar_labels",
 ] as const;
 
 const EDITING_BEHAVIOR: readonly CheckboxKey[] = [
@@ -144,6 +150,16 @@ const UI_ELEMENTS: readonly CheckboxKey[] = [
   "disable_markdown_codebar",
 ] as const;
 
+// Settings that come from other_settings instead of editor_settings
+const OTHER_SETTINGS_KEYS: readonly CheckboxKey[] = [
+  "disable_markdown_codebar",
+  "show_symbol_bar_labels",
+] as const;
+
+function isOtherSetting(name: CheckboxKey): boolean {
+  return OTHER_SETTINGS_KEYS.includes(name);
+}
+
 interface Props {
   editor_settings;
   other_settings?;
@@ -156,7 +172,7 @@ export function EditorSettingsCheckboxes(props: Props) {
   const intl = useIntl();
 
   function renderName(name: CheckboxKey) {
-    if (name === "disable_markdown_codebar") return;
+    if (isOtherSetting(name)) return;
     return (
       <strong>
         {capitalize(
@@ -186,8 +202,8 @@ export function EditorSettingsCheckboxes(props: Props) {
     name: CheckboxKey,
     desc: IntlMessage | Rendered | string,
   ): Rendered {
-    // Special handling for disable_markdown_codebar which is in other_settings
-    const is_other_setting = name === "disable_markdown_codebar";
+    // Special handling for settings that are in other_settings
+    const is_other_setting = isOtherSetting(name);
     const checked = is_other_setting
       ? !!props.other_settings?.get(name)
       : !!props.editor_settings.get(name);

src/packages/frontend/account/settings-index.tsx

@@ -13,19 +13,19 @@ import { Icon } from "@cocalc/frontend/components";
 import AIAvatar from "@cocalc/frontend/components/ai-avatar";
 import { cloudFilesystemsEnabled } from "@cocalc/frontend/compute";
 import { labels } from "@cocalc/frontend/i18n";
+import { COLORS } from "@cocalc/util/theme";
+import {
+  VALID_PREFERENCES_SUB_TYPES,
+  type NavigatePath,
+  type PreferencesSubTabType,
+} from "@cocalc/util/types/settings";
 import { APPEARANCE_ICON_NAME } from "./account-preferences-appearance";
 import { COMMUNICATION_ICON_NAME } from "./account-preferences-communication";
 import { EDITOR_ICON_NAME } from "./account-preferences-editor";
 import { KEYBOARD_ICON_NAME } from "./account-preferences-keyboard";
 import { OTHER_ICON_NAME } from "./account-preferences-other";
 import { ACCOUNT_PROFILE_ICON_NAME } from "./account-preferences-profile";
 import { KEYS_ICON_NAME } from "./account-preferences-security";
-import {
-  VALID_PREFERENCES_SUB_TYPES,
-  type NavigatePath,
-  type PreferencesSubTabType,
-} from "@cocalc/util/types/settings";
-// import { COLORS } from "@cocalc/util/theme";
 
 const MESSAGES = defineMessages({
   title: {
@@ -40,7 +40,7 @@ const MESSAGES = defineMessages({
   appearance: {
     id: "account.settings.overview.appearance",
     defaultMessage:
-      "Customize the visual experience via color themes, dark mode, language, and visual settings.",
+      "Customize the visual experience via color themes, {dark_mode}, language, and visual settings.",
   },
   editor: {
     id: "account.settings.overview.editor",
@@ -183,7 +183,20 @@ export function SettingsOverview() {
           <Card.Meta
             avatar={<Icon name={APPEARANCE_ICON_NAME} />}
             title={intl.formatMessage(labels.appearance)}
-            description={intl.formatMessage(MESSAGES.appearance)}
+            description={intl.formatMessage(MESSAGES.appearance, {
+              dark_mode: (
+                <span
+                  style={{
+                    backgroundColor: COLORS.GRAY_DD,
+                    color: COLORS.GRAY_LLL,
+                    paddingLeft: "3px",
+                    paddingRight: "3px",
+                  }}
+                >
+                  dark mode
+                </span>
+              ),
+            })}
           />
         </Card>
         <Card

src/packages/frontend/antd-bootstrap.tsx

@@ -289,20 +289,19 @@ export function Switch(props: {
   labelStyle?: CSS;
   children?: any;
 }) {
-  const { style = {}, labelStyle = {} } = props;
-
   // Default font weight for label
-  const finalLabelStyle: CSS = {
+  const labelStyle: CSS = {
     fontWeight: 400,
-    ...labelStyle,
-  };
+    ...props.labelStyle,
+    cursor: props.disabled ? "default" : "pointer",
+  } as const;
 
-  const handleChange = (checked: boolean) => {
+  function handleChange(checked: boolean) {
     if (props.onChange) {
       // Call onChange with same signature as Checkbox - event object with target.checked
       props.onChange({ target: { checked } });
     }
-  };
+  }
 
   return (
     <div style={{ margin: "15px 0" }}>
@@ -311,7 +310,7 @@ export function Switch(props: {
           display: "flex",
           alignItems: "center",
           gap: 8,
-          ...style,
+          ...props.style,
         }}
       >
         <AntdSwitch
@@ -321,10 +320,7 @@ export function Switch(props: {
         />
         <span
           onClick={() => !props.disabled && handleChange(!props.checked)}
-          style={{
-            ...finalLabelStyle,
-            cursor: props.disabled ? "default" : "pointer",
-          }}
+          style={labelStyle}
         >
           {props.children}
         </span>

src/packages/frontend/i18n/trans/ar_EG.json

@@ -117,7 +117,7 @@
   "account.settings.email-verification.unknown": "غير معروف",
   "account.settings.email-verification.verified": "موثوق",
   "account.settings.overview.ai": "تهيئة إعدادات وتكاملات المساعد الذكي.",
-  "account.settings.overview.appearance": "تخصيص التجربة البصرية عبر ثيمات الألوان، الوضع الداكن، اللغة، والإعدادات البصرية.",
+  "account.settings.overview.appearance": "خصص التجربة المرئية عبر ثيمات الألوان، {dark_mode}، اللغة، والإعدادات المرئية.",
   "account.settings.overview.billing": "إدارة الاشتراكات والتراخيص ومعلومات الفوترة.",
   "account.settings.overview.cloud": "إدارة تخزين نظام الملفات السحابي.",
   "account.settings.overview.communication": "تفضيلات الإشعارات وإعدادات الاتصال.",
@@ -1037,6 +1037,7 @@
   "labels.keys": "مفاتيح API و SSH",
   "labels.language": "اللغة",
   "labels.last_active": "آخر نشاط",
+  "labels.last_edited": "آخر تعديل",
   "labels.latex_document": "LaTeX",
   "labels.license": "رخصة",
   "labels.licenses": "التراخيص",
@@ -1130,6 +1131,7 @@
   "labels.ssh_keys": "مفاتيح SSH",
   "labels.starred": "المفضلة",
   "labels.start_all": "ابدأ الكل",
+  "labels.state": "الحالة",
   "labels.statements": "البيانات",
   "labels.status": "الحالة",
   "labels.stop": "توقف",
@@ -1428,6 +1430,7 @@
   "projects.operations.delete.button": "{deleted, select, true {استعادة الكل} other {حذف الكل}}",
   "projects.operations.delete.confirm": "نعم، {deleted, select, true {استرجاع} other {حذف}}",
   "projects.operations.delete.description": "هل أنت متأكد أنك تريد {deleted, select, true {استعادة} other {حذف}} {count, plural, one {# مشروع} other {# مشاريع}}؟",
+  "projects.operations.delete.ownership": "{ownership, select, none {أنت لا تملك أيًا من المشاريع المدرجة.} some {أنت مالك {ownedCount} من {totalCount} المشاريع المدرجة.} all {أنت مالك كل المشاريع المدرجة.} other {} }",
   "projects.operations.delete.title": "{deleted, select, true {استعادة الحذف} other {حذف}} المشاريع",
   "projects.operations.delete.warning": "سيقوم هذا {deleted, select, true {باستعادة} other {بحذف}} {count, plural, one {المشروع} other {المشاريع}} لجميع المتعاونين.",
   "projects.operations.hide.button": "{hidden, select, true {إظهار الكل} other {إخفاء الكل}}",
@@ -1453,6 +1456,7 @@
   "projects.table-controls.hashtags.placeholder": "التصفية حسب الوسوم...",
   "projects.table-controls.hidden.label": "مخفي",
   "projects.table-controls.search.placeholder": "ابحث عن المشاريع...",
+  "projects.table.last-edited": "آخر تعديل",
   "purchases.automatic-payments-warning.description": "المدفوعات التلقائية هي <b>أكثر ملاءمة</b> بكثير، وست<b>وفر لك الوقت</b>، و<b>تضمن عدم إلغاء الاشتراكات</b> عن طريق الخطأ.",
   "purchases.automatic-payments-warning.title": "الدفع التلقائي ليس مطلوبًا للاشتراك",
   "purchases.automatic-payments.are-enabled": "المدفوعات التلقائية مفعلة",

src/packages/frontend/i18n/trans/de_DE.json

@@ -117,7 +117,7 @@
   "account.settings.email-verification.unknown": "Unbekannt",
   "account.settings.email-verification.verified": "Verifiziert",
   "account.settings.overview.ai": "Konfigurieren Sie die Einstellungen und Integrationen des KI-Assistenten.",
-  "account.settings.overview.appearance": "Passen Sie das visuelle Erlebnis über Farbthemen, den Dunkelmodus, die Sprache und visuelle Einstellungen an.",
+  "account.settings.overview.appearance": "Passen Sie das visuelle Erlebnis durch Farbthemen, {dark_mode}, Sprache und visuelle Einstellungen an.",
   "account.settings.overview.billing": "Verwalten Sie Abonnements, Lizenzen und Abrechnungsinformationen.",
   "account.settings.overview.cloud": "Verwalten Sie den Cloud-Dateisystemspeicher.",
   "account.settings.overview.communication": "Benachrichtigungseinstellungen und Kommunikationseinstellungen.",
@@ -1037,6 +1037,7 @@
   "labels.keys": "API- & SSH-Schlüssel",
   "labels.language": "Sprache",
   "labels.last_active": "Zuletzt aktiv",
+  "labels.last_edited": "Zuletzt bearbeitet",
   "labels.latex_document": "LaTeX",
   "labels.license": "Lizenz",
   "labels.licenses": "Lizenzen",
@@ -1130,6 +1131,7 @@
   "labels.ssh_keys": "SSH Schlüssel",
   "labels.starred": "Markiert",
   "labels.start_all": "Alle starten",
+  "labels.state": "Zustand",
   "labels.statements": "Belege",
   "labels.status": "Status",
   "labels.stop": "Stop",
@@ -1428,6 +1430,7 @@
   "projects.operations.delete.button": "{deleted, select, true {Alle wiederherstellen} other {Alle löschen}}",
   "projects.operations.delete.confirm": "Ja, {deleted, select, true {wiederherstellen} other {löschen}}",
   "projects.operations.delete.description": "Sind Sie sicher, dass Sie {deleted, select, true {wiederherstellen} other {löschen}} {count, plural, one {# Projekt} other {# Projekte}} möchten?",
+  "projects.operations.delete.ownership": "{ownership, select, none {Sie besitzen keines der aufgeführten Projekte.} some {Sie sind der Eigentümer von {ownedCount} der {totalCount} aufgeführten Projekte.} all {Sie sind der Eigentümer jedes aufgeführten Projekts.} other {} }",
   "projects.operations.delete.title": "{deleted, select, true {Wiederherstellen} other {Löschen}} Projekte",
   "projects.operations.delete.warning": "Dies wird {deleted, select, true {wiederherstellen} other {löschen}} das {count, plural, one {Projekt} other {Projekte}} für alle Mitwirkenden.",
   "projects.operations.hide.button": "{hidden, select, true {Alle einblenden} other {Alle ausblenden}}",
@@ -1453,6 +1456,7 @@
   "projects.table-controls.hashtags.placeholder": "Nach Hashtags filtern...",
   "projects.table-controls.hidden.label": "Versteckt",
   "projects.table-controls.search.placeholder": "Projekte durchsuchen...",
+  "projects.table.last-edited": "Zuletzt bearbeitet",
   "purchases.automatic-payments-warning.description": "Automatische Zahlungen sind viel <b>bequemer</b>, <b>ersparen Ihnen Zeit</b> und <b>stellen sicher, dass Abonnements nicht versehentlich gekündigt werden</b>.",
   "purchases.automatic-payments-warning.title": "Automatische Zahlungen sind NICHT erforderlich, um ein Abonnement zu haben",
   "purchases.automatic-payments.are-enabled": "Automatische Zahlungen sind aktiviert",

src/packages/frontend/i18n/trans/es_ES.json

@@ -117,7 +117,7 @@
   "account.settings.email-verification.unknown": "Desconocido",
   "account.settings.email-verification.verified": "Verificado",
   "account.settings.overview.ai": "Configurar ajustes e integraciones del asistente de IA.",
-  "account.settings.overview.appearance": "Personaliza la experiencia visual mediante temas de color, modo oscuro, idioma y configuraciones visuales.",
+  "account.settings.overview.appearance": "Personaliza la experiencia visual a través de temas de color, {dark_mode}, idioma y configuraciones visuales.",
   "account.settings.overview.billing": "Gestionar suscripciones, licencias e información de facturación.",
   "account.settings.overview.cloud": "Gestionar el almacenamiento del sistema de archivos en la nube.",
   "account.settings.overview.communication": "Preferencias de notificación y configuración de comunicación.",
@@ -1037,6 +1037,7 @@
   "labels.keys": "Claves API y SSH",
   "labels.language": "Idioma",
   "labels.last_active": "Última actividad",
+  "labels.last_edited": "Última edición",
   "labels.latex_document": "LaTeX",
   "labels.license": "Licencia",
   "labels.licenses": "Licencias",
@@ -1130,6 +1131,7 @@
   "labels.ssh_keys": "Claves SSH",
   "labels.starred": "Destacados",
   "labels.start_all": "Iniciar Todo",
+  "labels.state": "Estado",
   "labels.statements": "Declaraciones",
   "labels.status": "Estado",
   "labels.stop": "Detener",
@@ -1428,6 +1430,7 @@
   "projects.operations.delete.button": "{deleted, select, true {Restaurar todo} other {Eliminar todo}}",
   "projects.operations.delete.confirm": "Sí, {deleted, select, true {restaurar} other {eliminar}}",
   "projects.operations.delete.description": "¿Está seguro de que desea {deleted, select, true {recuperar} other {eliminar}} {count, plural, one {# proyecto} other {# proyectos}}?",
+  "projects.operations.delete.ownership": "{ownership, select, none {No posees ninguno de los proyectos listados.} some {Eres el propietario de {ownedCount} de los {totalCount} proyectos listados.} all {Eres el propietario de todos los proyectos listados.} other {} }",
   "projects.operations.delete.title": "{deleted, select, true {Recuperar} other {Eliminar}} Proyectos",
   "projects.operations.delete.warning": "Esto {deleted, select, true {restaurará} other {eliminará}} el {count, plural, one {proyecto} other {proyectos}} para todos los colaboradores.",
   "projects.operations.hide.button": "{hidden, select, true {Mostrar todo} other {Ocultar todo}}",
@@ -1453,6 +1456,7 @@
   "projects.table-controls.hashtags.placeholder": "Filtrar por hashtags...",
   "projects.table-controls.hidden.label": "Oculto",
   "projects.table-controls.search.placeholder": "Buscar proyectos...",
+  "projects.table.last-edited": "Última edición",
   "purchases.automatic-payments-warning.description": "Los pagos automáticos son mucho <b>más convenientes</b>, te <b>ahorrarán tiempo</b> y <b>asegurarán que las suscripciones no se cancelen</b> por accidente.",
   "purchases.automatic-payments-warning.title": "Los pagos automáticos NO son necesarios para tener una suscripción",
   "purchases.automatic-payments.are-enabled": "Los pagos automáticos están habilitados",

src/packages/frontend/i18n/trans/es_PV.json

@@ -117,7 +117,7 @@
   "account.settings.email-verification.unknown": "Ezezaguna",
   "account.settings.email-verification.verified": "Egiaztatua",
   "account.settings.overview.ai": "Konfiguratu AI laguntzailearen ezarpenak eta integrazioak.",
-  "account.settings.overview.appearance": "Pertsonalizatu ikusizko esperientzia kolore gai, modu ilun, hizkuntza eta ikusizko ezarpenen bidez.",
+  "account.settings.overview.appearance": "Pertsonalizatu ikus-entzunezko esperientzia kolore gaiak, {dark_mode}, hizkuntza eta ikusizko ezarpenak erabiliz.",
   "account.settings.overview.billing": "Kudeatu harpidetzak, lizentziak eta fakturazio-informazioa.",
   "account.settings.overview.cloud": "Kudeatu hodeiko fitxategi-sistemaren biltegiratzea.",
   "account.settings.overview.communication": "Jakinarazpen hobespenak eta komunikazio ezarpenak.",
@@ -1037,6 +1037,7 @@
   "labels.keys": "API eta SSH gakoak",
   "labels.language": "Hizkuntza",
   "labels.last_active": "Azken Aktiboa",
+  "labels.last_edited": "Azken aldaketa",
   "labels.latex_document": "LaTeX Dokumentua",
   "labels.license": "Lizentzia",
   "labels.licenses": "Lizentziak",
@@ -1130,6 +1131,7 @@
   "labels.ssh_keys": "SSH Giltzak",
   "labels.starred": "Izarretakoak",
   "labels.start_all": "Hasi Guztiak",
+  "labels.state": "Egoera",
   "labels.statements": "Aitorpenak",
   "labels.status": "Egoera",
   "labels.stop": "Gelditu",
@@ -1428,6 +1430,7 @@
   "projects.operations.delete.button": "{deleted, select, true {Berreskuratu Guztiak} other {Ezabatu Guztiak}}",
   "projects.operations.delete.confirm": "Bai, {deleted, select, true {berreskuratu} other {ezabatu}}",
   "projects.operations.delete.description": "Ziur zaude {deleted, select, true {berreskuratu} other {ezabatu}} nahi duzula {count, plural, one {# proiektu} other {# proiektu}}?",
+  "projects.operations.delete.ownership": "{ownership, select, none {Ez duzu zerrendatutako proiektuen jaberik.} some {Zerrendatutako {totalCount} proiektuen artean {ownedCount} proiekturen jabea zara.} all {Zerrendatutako proiektu guztien jabea zara.} other {} }",
   "projects.operations.delete.title": "{deleted, select, true {Berreskuratu} other {Ezabatu}} Proiektuak",
   "projects.operations.delete.warning": "Honek lankide guztientzako {deleted, select, true {berrezarri} other {ezabatu}} {count, plural, one {proiektua} other {proiektuak}}.",
   "projects.operations.hide.button": "{hidden, select, true {Denak Agertu} other {Denak Ezkutatu}}",
@@ -1453,6 +1456,7 @@
   "projects.table-controls.hashtags.placeholder": "Iragazi etiketen arabera...",
   "projects.table-controls.hidden.label": "Ezkutua",
   "projects.table-controls.search.placeholder": "Proiektuak bilatu...",
+  "projects.table.last-edited": "Azken aldiz editatua",
   "purchases.automatic-payments-warning.description": "Ordainketa automatikoak askoz <b>erosoagoak</b> dira, <b>denbora aurreztuko dizute</b> eta <b>harpidetzak ez direla istripuz bertan behera geldituko</b> ziurtatuko dute.",
   "purchases.automatic-payments-warning.title": "Ez da beharrezkoa ordainketa automatikoak izatea harpidetza izateko",
   "purchases.automatic-payments.are-enabled": "Ordainketa Automatikoak Gaituta Daude",