1
/*
2
Show an error if something goes wrong trying to save
3
the account settings table to the database.
4
*/
5

6
import ShowError from "@cocalc/frontend/components/error";
7
import { redux, useTypedRedux } from "@cocalc/frontend/app-framework";
8

9
export default function AccountTableError() {
10
  const tableError = useTypedRedux("account", "tableError");
11
  if (!tableError) return null;
12

13
  const { error, query } = tableError.toJS();
14

15
  let obj;
16
  try {
17
    // this should work.
18
    obj = query[0]["accounts"];
19
    delete query["account_id"];
20
  } catch (_err) {
21
    obj = query;
22
  }
23

24
  let description;
25
  if (obj?.["name"] != null) {
26
    // Issue trying to set the username.
27
    description =
28
      "Please try a different username.  Names can be between 1 and 39 characters, contain upper and lower case letters, numbers, and dashes.";
29
  } else {
30
    description = `
31
There was an error trying to save an account setting to the server. In
32
particular, the following change failed:
33

34
\`\`\`js
35
${JSON.stringify(obj, undefined, 2)}
36
\`\`\`
37
`;
38
  }
39

40
  return (
41
    <div style={{ width: "100%" }}>
42
      <ShowError
43
        error={`${error}\n\n${description}`}
44
        setError={() =>
45
          redux.getActions("account").setState({ tableError: undefined })
46
        }
47
        style={{ margin: "15px auto", maxWidth: "900px" }}
48
      />
49
    </div>
50
  );
51
}
52

53