Merge remote-tracking branch 'origin/master' into npm-ts-5.7.3

src/packages/backend/sha1.test.ts

@@ -1,19 +1,31 @@
 import { sha1, uuidsha1 } from "./sha1";
 
+const cocalc = "CoCalc";
+const hash = "c898c97dca68742a5a6331f9fa0ca02483cbfd25";
+const uuid = "c898c97d-ca68-4742-a5a6-331f9fa0ca02";
+
 describe("compute some sha1 hashes", () => {
-  it("computes sha1 hash of old SageMathCloud", () => {
+  it("SageMathCloud/string", () => {
     expect(sha1("SageMathCloud")).toBe(
-      "31acd8ca91346abcf6a49d2b1d88333f439d57a6"
+      "31acd8ca91346abcf6a49d2b1d88333f439d57a6",
     );
   });
 
-  it("computes sha1 hash of new CoCalc", () => {
-    expect(sha1("CoCalc")).toBe("c898c97dca68742a5a6331f9fa0ca02483cbfd25");
+  it("CoCalc/string", () => {
+    expect(sha1(cocalc)).toBe(hash);
+  });
+
+  it("CoCalc/Buffer", () => {
+    expect(sha1(Buffer.from(cocalc))).toBe(hash);
   });
 });
 
-describe("compute some uuids", () => {
-  it("computes uuid associated to 'CoCalc'", () => {
-    expect(uuidsha1("CoCalc")).toBe("c898c97d-ca68-4742-a5a6-331f9fa0ca02");
+describe("UUIDs", () => {
+  it("CoCalc/string", () => {
+    expect(uuidsha1(cocalc)).toBe(uuid);
+  });
+
+  it("CoCalc/Buffer", () => {
+    expect(uuidsha1(Buffer.from(cocalc))).toBe(uuid);
   });
 });

src/packages/frontend/account/public-paths/public-paths.tsx

@@ -6,6 +6,7 @@
 import { Alert, Button, Checkbox, Space, Spin, Table } from "antd";
 import { join } from "path";
 import { FormattedMessage, useIntl } from "react-intl";
+
 import {
   React,
   redux,
@@ -298,7 +299,7 @@ function ComputeImage({ compute_image, project_id, path, setError }) {
     <>
       <ComputeImageSelector
         disabled={saving}
-        selected_image={selectedImage}
+        current_image={selectedImage}
         layout={"compact"}
         onSelect={async (img) => {
           setSelectedImage(img);

src/packages/frontend/app/verify-email-banner.tsx

@@ -75,7 +75,7 @@ export function VerifyEmail() {
         <FormattedMessage
           id="app.verify-email-banner.text"
           defaultMessage={`{sent, select,
-            true {Sent! Plesae check your email inbox (maybe spam) and click on the confirmation link.}
+            true {Sent! Please check your email inbox (and maybe spam) and click on the confirmation link.}
             other {Please check and verify your email address: <code>{email}</code>}}`}
           values={{
             sent,

src/packages/frontend/codemirror/css.js

@@ -6,9 +6,12 @@
 require("codemirror/lib/codemirror.css");
 require("codemirror/theme/3024-day.css");
 require("codemirror/theme/3024-night.css");
+require("codemirror/theme/abbott.css");
 require("codemirror/theme/abcdef.css");
 //require('codemirror/theme/ambiance-mobile.css') # doesn't highlight python, confusing
 require("codemirror/theme/ambiance.css");
+require("codemirror/theme/ayu-dark.css");
+require("codemirror/theme/ayu-mirage.css");
 require("codemirror/theme/base16-dark.css");
 require("codemirror/theme/base16-light.css");
 require("codemirror/theme/bespin.css");
@@ -27,9 +30,13 @@ require("codemirror/theme/hopscotch.css");
 require("codemirror/theme/icecoder.css");
 require("codemirror/theme/idea.css");
 require("codemirror/theme/isotope.css");
+require("codemirror/theme/juejin.css");
 require("codemirror/theme/lesser-dark.css");
 require("codemirror/theme/liquibyte.css");
 require("codemirror/theme/lucario.css");
+require("codemirror/theme/material-darker.css");
+require("codemirror/theme/material-ocean.css");
+require("codemirror/theme/material-palenight.css");
 require("codemirror/theme/material.css");
 require("codemirror/theme/mbo.css");
 require("codemirror/theme/mdn-like.css");
@@ -58,6 +65,7 @@ require("codemirror/theme/vibrant-ink.css");
 require("codemirror/theme/xq-dark.css");
 require("codemirror/theme/xq-light.css");
 require("codemirror/theme/yeti.css");
+require("codemirror/theme/yonce.css");
 require("codemirror/theme/zenburn.css");
 
 require("./mode/mediawiki/mediawiki.css");

src/packages/frontend/components/password.tsx

@@ -3,14 +3,14 @@
 This is like Antd's Input.Password but the input does NOT have type='password'
 The motivation is that we want to store lots of information in admin config
 that is displayed like a password, i.e., hidden by default, but if you have
-an input with type='password', then your password manager may aggresively
+an input with type='password', then your password manager may aggressively
 autofill your password into these fields, thus leaking your personal top
 secret password... which is VERY VERY VERY BAD.
 
 If you really are actually creating a react component to enter the usual
 password, e.g., a sign in page, then use antd's Input.Password, not this.
 
-NOTE: A huge advantage of this is that we have another component here 
+NOTE: A huge advantage of this is that we have another component here
 PasswordTextArea that works like a multiline text area, but also allows
 hiding the input like a password, which is somethign that Input.Password
 doesn't provide, as is useful for any secret config that is multiline,

src/packages/frontend/cspell.json

@@ -0,0 +1,44 @@
+{
+  "version": "0.2",
+  "language": "en",
+  "enabled": true,
+  "words": [
+    "CoCalc",
+    "dplyr",
+    "ggplot",
+    "ipywidgets",
+    "katex",
+    "kucalc",
+    "mathjax",
+    "nbconvert",
+    "nbgrader",
+    "nbviewer",
+    "Ollama",
+    "onprem",
+    "plotly",
+    "rereturn",
+    "respawns",
+    "Rmarkdown",
+    "Sagemath",
+    "sagews",
+    "syncdb",
+    "syncstring",
+    "timetravel",
+    "undelete",
+    "undeleting"
+  ],
+  "ignoreWords": [
+    "antd",
+    "ipynb",
+    "kernelspec",
+    "mistralai",
+    "Popconfirm",
+    "vertexai",
+    "vfill"
+  ],
+  "flagWords": [],
+  "ignorePaths": ["node_modules/**", "dist/**", "dist-ts/**", "build/**"],
+  "allowCompoundWords": false,
+  "ignoreRegExpList": ["/import\\s+.*?\\s+from\\s+['\"].*?['\"]/g"],
+  "import": ["@cspell/dict-typescript/cspell-ext.json"]
+}

src/packages/frontend/custom-software/selector.tsx

@@ -3,8 +3,12 @@
  *  License: MS-RSL – see LICENSE.md for details
  */
 
-import { Col, Row, Alert, Button, Divider, List, Radio } from "antd";
+// cSpell:ignore descr disp dflt
+
+import { Alert, Button, Col, Divider, List, Radio, Row } from "antd";
 import { join } from "path";
+import { FormattedMessage, useIntl } from "react-intl";
+
 import {
   CSS,
   React,
@@ -27,6 +31,7 @@ import {
   SiteName,
 } from "@cocalc/frontend/customize";
 import { appBasePath } from "@cocalc/frontend/customize/app-base-path";
+import { labels } from "@cocalc/frontend/i18n";
 import { ComputeImageSelector } from "@cocalc/frontend/project/settings/compute-image-selector";
 import { KUCALC_COCALC_COM } from "@cocalc/util/db-schema/site-defaults";
 import { unreachable } from "@cocalc/util/misc";
@@ -101,7 +106,7 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
     "compute_images",
     "images",
   );
-
+  const intl = useIntl();
   const customize_kucalc = useTypedRedux("customize", "kucalc");
   const onCoCalcCom = customize_kucalc === KUCALC_COCALC_COM;
   const customize_software = useTypedRedux("customize", "software");
@@ -152,7 +157,7 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
     } else {
       // must be standard image
       const img = software_images.get(default_image);
-      const display = img != null ? (img.get("title") ?? "") : "";
+      const display = img != null ? img.get("title") ?? "" : "";
       set_state(default_image, display, "standard");
     }
   }, []);
@@ -242,21 +247,26 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
         <Alert
           type="info"
           banner
-          message={
-            <>
-              The selected <em>custom</em> software environment stays with the
-              project. Create a new project to work in a different software
-              environment. You can always{" "}
-              <A
-                href={
-                  "https://doc.cocalc.com/project-files.html#file-actions-on-one-file"
-                }
-              >
-                copy files between projects
-              </A>{" "}
-              as well.
-            </>
-          }
+          message={intl.formatMessage(
+            {
+              id: "custom-software.selector.message",
+              defaultMessage: `The selected <em>custom</em> software environment stays with the project.
+              Create a new project to work in a different software environment.
+              You can always <A>copy files between projects</A> as well.
+              `,
+            },
+            {
+              A: (c) => (
+                <A
+                  href={
+                    "https://doc.cocalc.com/project-files.html#file-actions-on-one-file"
+                  }
+                >
+                  {c}
+                </A>
+              ),
+            },
+          )}
         />
       </>
     );
@@ -324,15 +334,18 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
     return (
       <>
         <Paragraph>
-          Select the software enviornment. Either go with the default
-          environment, or select one of the more specialized ones. Whatever you
-          pick, you can change it later in Project Settings → Control → Software
-          Environment at any time.
+          <FormattedMessage
+            id="custom-software.selector.explanation"
+            defaultMessage={`Select the software environment.
+                Either go with the default environment, or select one of the more specialized ones.
+                Whatever choice you make, you can change it later in
+                Project Settings → Control → Software Environment at any time.`}
+          />
         </Paragraph>
         <Paragraph>
           <ComputeImageSelector
             size={"middle"}
-            selected_image={selected}
+            current_image={selected}
             layout={"horizontal"}
             onSelect={(img) => {
               const display = software_images.get(img)?.get("title");
@@ -345,17 +358,23 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
             <Alert
               type="info"
               banner
+              closable
               message={
                 <>
-                  You've selected a non-standard image:{" "}
+                  {intl.formatMessage({
+                    id: "custom-software.selector.non-standard",
+                    defaultMessage:
+                      "You selected a non-standard software environment",
+                  })}
+                  :{" "}
                   <Button
                     size="small"
                     type="link"
                     onClick={() => {
                       set_state(dflt_software_img, undefined, "standard");
                     }}
                   >
-                    Reset
+                    {intl.formatMessage(labels.reset)}
                   </Button>
                 </>
               }
@@ -497,7 +516,7 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
     return (
       <Col sm={24}>
         <ComputeImageSelector
-          selected_image={image_selected ?? dflt_software_img}
+          current_image={image_selected ?? dflt_software_img}
           layout={"horizontal"}
           onSelect={(img) => {
             const display = software_images.get(img)?.get("title");
@@ -513,7 +532,9 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
   function render_type_selection() {
     return (
       <>
-        {showTitle ? <div>Software environment</div> : undefined}
+        {showTitle ? (
+          <div>{intl.formatMessage(labels.software_environment)}</div>
+        ) : undefined}
 
         {onCoCalcCom ? (
           <div>
@@ -532,7 +553,7 @@ export const SoftwareEnvironment: React.FC<Props> = (props: Props) => {
     if (image_type === "default") return;
     return (
       <Divider orientation="left" plain>
-        Configuration
+        {intl.formatMessage(labels.configuration)}
       </Divider>
     );
   }