frontend/i18n: bugfixing; more on jupyter and "new"

Author: haraldschilly

src/packages/frontend/account/account-page.tsx

@@ -265,10 +265,12 @@ export const AccountPage: React.FC = () => {
 
   function renderI18N(): JSX.Element | null {
     if (
+      i18n_enabled == null ||
       i18n_enabled.isEmpty() ||
       (i18n_enabled.size === 1 && i18n_enabled.includes("en"))
-    )
+    ) {
       return null;
+    }
 
     const i18n: Locale = getLocale(other_settings);
 

src/packages/frontend/account/sign-out.tsx

@@ -93,7 +93,7 @@ export const SignOut: React.FC<Props> = (props: Readonly<Props>) => {
         },
         { everywhere },
       )}
-      cancelText={intl.formatMessage(labels.button_cancel)}
+      cancelText={intl.formatMessage(labels.cancel)}
     >
       <Button
         icon={<LogoutOutlined />}

src/packages/frontend/app/render.tsx

@@ -9,12 +9,11 @@ import { createRoot } from "react-dom/client";
 import {
   redux,
   Redux,
-  useEffect,
+  useAsyncEffect,
   useTypedRedux,
 } from "@cocalc/frontend/app-framework";
 import {
   getLocale,
-  Locale,
   LOCALIZATIONS,
   OTHER_SETTINGS_LOCALE_KEY,
 } from "@cocalc/frontend/i18n";
@@ -28,13 +27,19 @@ function App({ children }) {
   const { setLocale } = useLocalizationCtx();
   const other_settings = useTypedRedux("account", "other_settings");
 
-  useEffect(() => {
+  // setting via ?lang=[locale] takes precedece over account settings
+  useAsyncEffect(async () => {
     const lang = QueryParams.get("lang");
     if (lang != null) {
       if (lang in LOCALIZATIONS) {
         console.warn(
           `URL query parameter 'lang=${lang}' – overriding user configuration.`,
         );
+        const store = redux.getStore("account");
+        // we have to ensure the account store is available, because this code runs very early
+        await store.async_wait({
+          until: () => store.get_account_id() != null,
+        });
         redux
           .getActions("account")
           .set_other_settings(OTHER_SETTINGS_LOCALE_KEY, lang);
@@ -45,11 +50,12 @@ function App({ children }) {
           `Known values: ${Object.keys(LOCALIZATIONS)}`,
         );
       }
+      // removing the parameter, otherwise this conflicts with further changes of account settings
+      QueryParams.remove("lang");
     } else {
-      const i18n: Locale = getLocale(other_settings);
-      setLocale(i18n);
+      setLocale(getLocale(other_settings));
     }
-  }, [other_settings]);
+  }, [getLocale(other_settings)]);
 
   return <AppContext.Provider value={appState}>{children}</AppContext.Provider>;
 }

src/packages/frontend/customize.tsx

@@ -172,7 +172,7 @@ export interface CustomizeState {
   default_llm?: string;
   user_defined_llm: boolean;
 
-  i18n: List<Locale>;
+  i18n?: List<Locale>;
 }
 
 export class CustomizeStore extends Store<CustomizeState> {

src/packages/frontend/frame-editors/frame-tree/commands/generic-commands.tsx

@@ -620,10 +620,7 @@ addCommands({
 
   word_count: {
     group: "get-info",
-    label: defineMessage({
-      id: "command.generic.word_count.label",
-      defaultMessage: "Word Count",
-    }),
+    label: labels.word_count,
     title: defineMessage({
       id: "command.generic.word_count.title",
       defaultMessage:
@@ -1085,7 +1082,7 @@ addCommands({
             })}
           </div>
         ),
-        cancelText: intl.formatMessage(labels.button_cancel),
+        cancelText: intl.formatMessage(labels.cancel),
         okText: intl.formatMessage({
           id: "commands.generic.toggle_button_bar.confirm.ok",
           defaultMessage: "Hide Menu Toolbar",

src/packages/frontend/frame-editors/latex-editor/editor.ts

@@ -8,7 +8,7 @@ Spec for editing LaTeX documents.
 */
 
 import { IS_IOS, IS_IPAD } from "@cocalc/frontend/feature";
-import { editor } from "@cocalc/frontend/i18n";
+import { editor, labels } from "@cocalc/frontend/i18n";
 import { set } from "@cocalc/util/misc";
 import { CodemirrorEditor } from "../code-editor/codemirror-editor";
 import { createEditor } from "../frame-tree/editor";
@@ -159,8 +159,8 @@ const EDITOR_SPEC = {
   } as EditorDescription,
 
   word_count: {
-    short: "Word Count",
-    name: "Word Count",
+    short: labels.word_count,
+    name: labels.word_count,
     icon: "file-alt",
     commands: set(["word_count"]),
     component: LatexWordCount,

src/packages/frontend/i18n/README.md

@@ -67,10 +67,13 @@ CoCalc specific rules for implementing translations, of which I think are good t
 - **Explicit ID**: Technically, the ID is optional. Then it is computed as a hash upon extraction. However, this has two negative sides:
   - If the message changes, it's hash changes, and you have to start over with the translation. This is good from an idealistic standpoint, but if you just tweak a word or correct a typo, the existing translations are still ok. If the meaning changes completely, it's better to create a new ID. (Of course, changes to the `defaultMessage` need to go through the `extract → upload` step, except that the English translation uses the `defaultMessage` directly.)
   - Sorting: All the translations and also online tools like SimpleLocalize sort the translations by their keys. Look at the translated `i18n/de_DE.json` and you'll see that messages that are related are also next to each other. This also makes it possible to filter for a specific
+  - Never reference an ID directly – always reference the object of the "defined message", such that label changes (for updating the translation) or typos do not cause problems.
+  - Extracting the IDs check for duplicates, so, no worries about that.
 - Pitfall **No variables in properties**: I think the extraction process does not know how to deal with variables, when extracting strings from properties. So, either define the message objects elsewhere (like it is done with `labels`) or write a multiline string in place. See the examples below for what works.
 - **No `en` translation**: English is the default. The `defaultMessage` is already in the code. We do not download the supposedly translated `en` file and just let the fallback mechanism kick in. This also means that changes to the `defaultMessage` will show up with the next build, even without touching any of the translations.
 - **richTextElements**: in `app/localize.tsx`, a few default `richTextElements` are defined – just for convenience. Anchor tags must be defined individually, because link text and href can't be wrapped that way.
 - **Query parameter**: A new `?lang=en` (or `=de`, `=zh`, ...) query parameters lets you change the language as well. This also changes the account setting. Hence, a URL with `?lang=en` can be used to reset the account setting to English.
+- **Descriptions**: add descriptions, especially for jupyter notebooks or latex, to add more context. The description is not only shown in the translation tool, but also passed on to the language model doing the automatic translations.
 
 ## Style
 

src/packages/frontend/i18n/common.ts

@@ -1,7 +1,7 @@
 import { defineMessages } from "react-intl";
 
 export const labels = defineMessages({
-  button_cancel: {
+  cancel: {
     id: "labels.button.cancel",
     defaultMessage: "Cancel",
     description:
@@ -200,7 +200,7 @@ export const labels = defineMessages({
   copy: { id: "labels.copy", defaultMessage: "Copy" },
   undo: { id: "labels.undo", defaultMessage: "Undo" },
   paste: { id: "labels.paste", defaultMessage: "Paste" },
-  redo: { id: "labels.redo", defaultMessage: "redo" },
+  redo: { id: "labels.redo", defaultMessage: "Redo" },
   reload_title: {
     id: "labels.reload_title",
     defaultMessage: "Reload this document",
@@ -222,6 +222,42 @@ export const labels = defineMessages({
     defaultMessage: "Stop",
     description: "Label on a button to stop an ongoing process",
   },
+  restart: {
+    id: "labels.restart",
+    defaultMessage: "Restart",
+    description:
+      "Label on a button to restart a job, or Jupyter Notebook kernel, etc.",
+  },
+  validate: {
+    id: "labels.validate",
+    defaultMessage: "Validate",
+  },
+  clear: {
+    id: "labels.clear",
+    defaultMessage: "Clear",
+    description: "Clean or clear something out, such that it empty",
+  },
+  word_count: {
+    id: "labels.word_count",
+    defaultMessage: "Word Count",
+    description: "Tool to count words in a document",
+  },
+  latex_document: {
+    id: "labels.latex_document",
+    defaultMessage: "LaTeX Document",
+    description:
+      "Indicating a LaTeX Documents on a button label or frame title",
+  },
+  sagemath_worksheet: {
+    id: "labels.sagemath_worksheet",
+    defaultMessage: "SageMath Worksheet",
+    description: "A SageMath Worksheet label on a button or frame title",
+  },
+  linux_terminal: {
+    id: "labels.linux_terminal",
+    defaultMessage: "Linux Terminal",
+    description: "On a label or frame title describing a Linux Terminal"
+  }
 });
 
 export const menu = defineMessages({
@@ -435,6 +471,22 @@ export const jupyter = {
     },
   }),
   commands: defineMessages({
+    insert_cell_above: {
+      id: "jupyter.commands.insert_cell_above",
+      defaultMessage: "Insert Cell Above",
+    },
+    insert_cell_below: {
+      id: "jupyter.commands.insert_cell_below",
+      defaultMessage: "Insert Cell Below",
+    },
+    enter_command_mode: {
+      id: "jupyter.commands.enter_command_mode",
+      defaultMessage: "Enter command mode",
+    },
+    enter_edit_mode: {
+      id: "jupyter.commands.enter_edit_mode",
+      defaultMessage: "Enter edit mode",
+    },
     toggle_all_line_numbers: {
       id: "jupyter.commands.toggle_all_line_numbers",
       defaultMessage: "Toggle Line Numbers of All Cells",
@@ -448,6 +500,11 @@ export const jupyter = {
       defaultMessage: "Change Kernel...",
       description: "Change the Kernel in the Jupyter Notebook",
     },
+    close_and_halt_menu: {
+      id: "jupyter.commands.close_and_halt.menu",
+      defaultMessage: "Close and halt",
+      description: "Close and halt the Kernel and Jupyter Notebook",
+    },
     change_kernel_title: {
       id: "jupyter.commands.change_kernel_title",
       defaultMessage: "Select from any of the available kernels.",
@@ -464,16 +521,62 @@ export const jupyter = {
       defaultMessage: "None",
       description: "Jupyter Notebook cell toolbar 'None' hides the toolbar",
     },
+
+    restart_kernel_noconf_menu: {
+      id: "jupyter.commands.restart_kernel_noconf.menu",
+      defaultMessage: "Restart kernel",
+      description: "Restart Kernel of a Jupyter Notebook",
+    },
+    restart_kernel_clear_noconf_menu: {
+      id: "jupyter.commands.restart_kernel_clear_noconf.menu",
+      defaultMessage: "Restart kernel and clear output",
+      description: "Restart Kernel of a Jupyter Notebook and clear all output",
+    },
+    restart_kernel_label: {
+      id: "jupyter.commands.restart_kernel.label",
+      defaultMessage: "Restart Kernel...",
+      description: "Restart Kernel of a Jupyter Notebook",
+    },
+    restart_kernel_button: {
+      id: "jupyter.commands.restart_kernel.button",
+      defaultMessage: "Kernel",
+      description: "Restart Kernel of a Jupyter Notebook",
+    },
     restart_kernel_run_all_cells: {
       id: "jupyter.commands.restart_kernel_run_all_cells",
       defaultMessage: "Restart and Run All Cells...",
       describe: "In a Jupyter Notebook, restart kernel and run all cells",
     },
     restart_kernel_run_all_cells_button: {
-      id: "jupyter.commands.restart_kernel_run_all_cells_button",
+      id: "jupyter.commands.restart_kernel_run_all_cells.button",
+      defaultMessage: "Run all...",
+      describe: "In a Jupyter Notebook, restart kernel and run all cells",
+    },
+    restart_kernel_run_all_cells_noconf: {
+      id: "jupyter.commands.restart_kernel_run_all_cells_noconf",
+      defaultMessage: "Restart Kernel and Run All Cells",
+      describe: "In a Jupyter Notebook, restart kernel and run all cells",
+    },
+    restart_kernel_run_all_cells_noconf_button: {
+      id: "jupyter.commands.restart_kernel_run_all_cells_noconf_button",
       defaultMessage: "Run All",
       describe: "In a Jupyter Notebook, restart kernel and run all cells",
     },
+    restart_kernel_run_all_cells_menu: {
+      id: "jupyter.commands.restart_kernel_run_all_cells_menu",
+      defaultMessage: "Run all...",
+      describe: "In a Jupyter Notebook, restart kernel and run all cells",
+    },
+    restart_kernel_run_all_cells_without_halting: {
+      id: "jupyter.commands.restart_kernel_run_all_cells_without_halting",
+      defaultMessage: "Restart and Run All (do not stop on errors)...",
+      describe: "In a Jupyter Notebook, restart kernel and run all cells",
+    },
+    restart_kernel_clear_output_menu: {
+      id: "jupyter.commands.restart_kernel_clear_output.menu",
+      defaultMessage: "Restart Kernel and Clear All Outputs...",
+      describe: "In a Jupyter Notebook, restart kernel and clear output",
+    },
     run_cell_and_insert_below: {
       id: "jupyter.commands.run_cell_and_insert_below",
       defaultMessage: "Run Selected Cells and Insert Below",
@@ -508,7 +611,91 @@ export const jupyter = {
     interrupt_kernel: {
       id: "jupyter.commands.interrupt_kernel",
       defaultMessage: "Interrupt Kernel (Stop)",
-      description: "In a Jupyter Notebook, interrup the running kernel",
+      description: "In a Jupyter Notebook, interrupt the running kernel",
+    },
+    shutdown_kernel_button: {
+      id: "jupyter.commands.shutdown_kernel.button",
+      defaultMessage: "Off",
+      description: "In a Jupyter Notebook, turn the running kernel off",
+    },
+    shutdown_kernel_menu: {
+      id: "jupyter.commands.shutdown_kernel.menu",
+      defaultMessage: "Shutdown Kernel...",
+      description: "In a Jupyter Notebook, turn the running kernel off",
+    },
+    shutdown_kernel_confirm_title: {
+      id: "jupyter.commands.shutdown_kernel.title",
+      defaultMessage: "Shutdown kernel?",
+      description: "In a Jupyter Notebook",
+    },
+    shutdown_kernel_confirm_body: {
+      id: "jupyter.commands.shutdown_kernel.body",
+      defaultMessage:
+        "Do you want to shutdown the current kernel? All variable values will be lost.",
+      description: "In a Jupyter Notebook",
+    },
+    shutdown_kernel_confirm_label_shutdown: {
+      id: "jupyter.commands.shutdown_kernel.label.shutdown",
+      defaultMessage: "Shutdown",
+      description: "Shutting down a Kernel of a Jupyter Notebook",
+    },
+    shutdown_kernel_confirm_label_continue: {
+      id: "jupyter.commands.shutdown_kernel.label.continue",
+      defaultMessage: "Continue running",
+      description: "Continue running the Kernel of a Jupyter Notebook",
+    },
+    halt_kernel_menu: {
+      id: "jupyter.commands.halt_kernel_menu.menu",
+      defaultMessage: "Halt kernel...",
+      description: "Halting a Kernel of a Jupyter Notebook",
+    },
+    validate_label: {
+      id: "jupyter.commands.validate.label",
+      defaultMessage: "Validate",
+      description: "Validate a Jupyter Notebook",
+    },
+    validate_tooltip: {
+      id: "jupyter.commands.validate.tooltip",
+      defaultMessage:
+        "Restart Jupyter Notebook and run all cells to validate that it works.",
+      description: "Validate a Jupyter Notebook",
+    },
+    validate_title: {
+      id: "jupyter.commands.validate.title",
+      defaultMessage: "Validate notebook?",
+      description: "Validate a Jupyter Notebook",
+    },
+    validate_body: {
+      id: "jupyter.commands.validate.body",
+      defaultMessage:
+        "Validating the notebook will restart the kernel and run all cells in order, even those with errors.  This will ensure that all output is exactly what results from running all cells in order.",
+      description: "Validate a Jupyter Notebook",
+    },
+    refresh_kernels: {
+      id: "jupyter.commands.refresh_kernels",
+      defaultMessage: "Refresh Kernel List",
+      description: "Reload list of all Kernels for Jupyter Notebooks",
+    },
+    refresh_kernels_tooltip: {
+      id: "jupyter.commands.refresh_kernels.tooltip",
+      defaultMessage:
+        "Reload list of all available Kernels for running Jupyter Notebooks",
+    },
+    run_all_cells_menu: {
+      id: "jupyter.commands.run_all_cells.menu",
+      defaultMessage: "Run All Cells",
+      description: "Run all cells in a Jupyter Notebook",
+    },
+    run_all_cells_above_menu: {
+      id: "jupyter.commands.run_all_cells_above.menu",
+      defaultMessage: "Run All Above Selected Cell",
+      description: "Run all cells above selected cell in a Jupyter Notebook",
+    },
+    run_all_cells_below_menu: {
+      id: "jupyter.commands.run_all_cells_below.menu",
+      defaultMessage: "Run Selected Cell and All Below",
+      description:
+        "Run selected cell and all cells below selected cell in a Jupyter Notebook",
     },
   }),
 };

src/packages/frontend/i18n/components.tsx

@@ -3,5 +3,5 @@ import { FormattedMessage } from "react-intl";
 import { labels } from "./common";
 
 export function CancelText() {
-  return <FormattedMessage {...labels.button_cancel} />;
+  return <FormattedMessage {...labels.cancel} />;
 }