1
/*
2
 *  This file is part of CoCalc: Copyright © 2020 Sagemath, Inc.
3
 *  License: MS-RSL – see LICENSE.md for details
4
 */
5

6
import { Component, Rendered } from "@cocalc/frontend/app-framework";
7
import { Button } from "@cocalc/frontend/antd-bootstrap";
8
import {
9
  CopyToClipBoard,
10
  Icon,
11
  ErrorDisplay,
12
} from "@cocalc/frontend/components";
13
import { webapp_client } from "../../webapp-client";
14
import { appBasePath } from "@cocalc/frontend/customize/app-base-path";
15

16
interface Props {
17
  account_id: string;
18
  email_address: string;
19
}
20

21
interface State {
22
  error?: string;
23
  running: boolean;
24
  link?: string;
25
}
26

27
export class PasswordReset extends Component<Props, State> {
28
  mounted: boolean = true;
29

30
  constructor(props: any) {
31
    super(props);
32
    this.state = { running: false };
33
  }
34

35
  componentWillUnmount(): void {
36
    this.mounted = false;
37
  }
38

39
  async do_request(): Promise<void> {
40
    this.setState({ running: true });
41
    let link: string;
42
    try {
43
      link = await webapp_client.conat_client.hub.system.adminResetPasswordLink(
44
        { user_account_id: this.props.account_id },
45
      );
46
    } catch (err) {
47
      if (!this.mounted) return;
48
      this.setState({ error: `${err}`, running: false });
49
      return;
50
    }
51
    if (!this.mounted) return;
52
    link = `${document.location.origin}${
53
      appBasePath.length <= 1 ? "" : appBasePath
54
    }${link}`;
55
    this.setState({ link, running: false });
56
  }
57

58
  render_password_reset_button(): Rendered {
59
    return (
60
      <Button
61
        disabled={this.state.running}
62
        onClick={() => {
63
          this.do_request();
64
        }}
65
      >
66
        <Icon
67
          name={this.state.running ? "sync" : "lock-open"}
68
          spin={this.state.running}
69
        />{" "}
70
        Request Password Reset Link...
71
      </Button>
72
    );
73
  }
74

75
  render_error(): Rendered {
76
    if (!this.state.error) {
77
      return;
78
    }
79
    return (
80
      <ErrorDisplay
81
        style={{ margin: "30px" }}
82
        error={this.state.error}
83
        onClose={() => {
84
          this.setState({ error: undefined });
85
        }}
86
      />
87
    );
88
  }
89

90
  render_password_reset_link(): Rendered {
91
    if (!this.state.link) return;
92
    return (
93
      <div>
94
        <div style={{ marginTop: "20px" }}>
95
          {" "}
96
          Send this somehow to{" "}
97
          <a
98
            href={`mailto:${this.props.email_address}`}
99
            target="_blank"
100
            rel="noopener noreferrer"
101
          >
102
            {this.props.email_address}.
103
          </a>
104
          <br />
105
          <CopyToClipBoard value={this.state.link} />
106
        </div>
107
      </div>
108
    );
109
  }
110

111
  render(): Rendered {
112
    if (!this.props.email_address) {
113
      return (
114
        <div>
115
          User does not have an email address set, so password reset does not
116
          make sense.
117
        </div>
118
      );
119
    }
120
    return (
121
      <div>
122
        <b>Password Reset:</b>
123
        <br />
124
        {this.render_error()}
125
        {this.render_password_reset_button()}
126
        {this.render_password_reset_link()}
127
        <br />
128
        <br />
129
      </div>
130
    );
131
  }
132
}
133

134