Some more fixes.

docs/src/contributing_websocket_http_api.md

@@ -425,9 +425,11 @@ These expire after 10 minutes.
 {
   op: "GetCaptcha",
   data: {
-    png: String, // A Base64 encoded png
-    wav: Option<String>, // A Base64 encoded wav audio file
-    uuid: String, // will return 'disabled' if server has these disabled
+    ok?: { // Will be undefined if captchas are disabled
+      png: String, // A Base64 encoded png
+      wav: Option<String>, // A Base64 encoded wav audio file
+      uuid: String,
+    }
   }
 }
 ```

server/src/api/user.rs

@@ -78,9 +78,14 @@ pub struct GetCaptcha {}
 
 #[derive(Serialize, Deserialize)]
 pub struct GetCaptchaResponse {
+  ok: Option<CaptchaResponse>,
+}
+
+#[derive(Serialize, Deserialize)]
+pub struct CaptchaResponse {
   png: String,         // A Base64 encoded png
   wav: Option<String>, // A Base64 encoded wav audio
-  uuid: String,        // will be 'disabled' if captchas are disabled
+  uuid: String,
 }
 
 #[derive(Serialize, Deserialize)]
@@ -491,11 +496,7 @@ impl Perform for Oper<GetCaptcha> {
     let captcha_settings = Settings::get().captcha;
 
     if !captcha_settings.enabled {
-      return Ok(GetCaptchaResponse {
-        png: "disabled".to_string(),
-        uuid: "disabled".to_string(),
-        wav: None,
-      });
+      return Ok(GetCaptchaResponse { ok: None });
     }
 
     let captcha = match captcha_settings.difficulty.as_str() {
@@ -525,7 +526,9 @@ impl Perform for Oper<GetCaptcha> {
       ws.chatserver.do_send(captcha_item);
     }
 
-    Ok(GetCaptchaResponse { png, uuid, wav })
+    Ok(GetCaptchaResponse {
+      ok: Some(CaptchaResponse { png, uuid, wav }),
+    })
   }
 }
 

server/src/websocket/server.rs

@@ -656,7 +656,7 @@ impl Handler<StandardMessage> for ChatServer {
     Box::pin(async move {
       match fut.await {
         Ok(m) => {
-          info!("Message Sent: {}", m);
+          // info!("Message Sent: {}", m);
           Ok(m)
         }
         Err(e) => {

ui/src/components/login.tsx

@@ -263,6 +263,7 @@ export class Login extends Component<any, State> {
             <label class="col-sm-2" htmlFor="register-captcha">
               <span class="mr-2">{i18n.t('enter_code')}</span>
               <button
+                type="button"
                 class="btn btn-secondary"
                 onClick={linkEvent(this, this.handleRegenCaptcha)}
               >
@@ -325,30 +326,25 @@ export class Login extends Component<any, State> {
   showCaptcha() {
     return (
       <div class="col-sm-4">
-        {this.state.captcha.uuid && (
+        {this.state.captcha.ok && (
           <>
             <img
               class="rounded-top img-fluid"
               src={this.captchaPngSrc()}
               style="border-bottom-right-radius: 0; border-bottom-left-radius: 0;"
             />
-            {this.state.captcha.wav && (
+            {this.state.captcha.ok.wav && (
               <button
                 class="rounded-bottom btn btn-sm btn-secondary btn-block"
                 style="border-top-right-radius: 0; border-top-left-radius: 0;"
                 title={i18n.t('play_captcha_audio')}
                 onClick={linkEvent(this, this.handleCaptchaPlay)}
+                type="button"
                 disabled={this.state.captchaPlaying}
               >
-                {!this.state.captchaPlaying ? (
-                  <svg class="icon icon-play">
-                    <use xlinkHref="#icon-play"></use>
-                  </svg>
-                ) : (
-                  <svg class="icon icon-pause">
-                    <use xlinkHref="#icon-pause"></use>
-                  </svg>
-                )}
+                <svg class="icon icon-play">
+                  <use xlinkHref="#icon-play"></use>
+                </svg>
               </button>
             )}
           </>
@@ -429,7 +425,7 @@ export class Login extends Component<any, State> {
 
   handleCaptchaPlay(i: Login) {
     event.preventDefault();
-    let snd = new Audio('data:audio/wav;base64,' + i.state.captcha.wav);
+    let snd = new Audio('data:audio/wav;base64,' + i.state.captcha.ok.wav);
     snd.play();
     i.state.captchaPlaying = true;
     i.setState(i.state);
@@ -441,7 +437,7 @@ export class Login extends Component<any, State> {
   }
 
   captchaPngSrc() {
-    return `data:image/png;base64,${this.state.captcha.png}`;
+    return `data:image/png;base64,${this.state.captcha.ok.png}`;
   }
 
   parseMessage(msg: WebSocketJsonResponse) {
@@ -449,6 +445,7 @@ export class Login extends Component<any, State> {
     if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       this.state = this.emptyState;
+      this.state.registerForm.captcha_answer = undefined;
       // Refetch another captcha
       WebSocketService.Instance.getCaptcha();
       this.setState(this.state);
@@ -471,9 +468,9 @@ export class Login extends Component<any, State> {
         this.props.history.push('/communities');
       } else if (res.op == UserOperation.GetCaptcha) {
         let data = res.data as GetCaptchaResponse;
-        if (data.uuid != 'disabled') {
+        if (data.ok) {
           this.state.captcha = data;
-          this.state.registerForm.captcha_uuid = data.uuid;
+          this.state.registerForm.captcha_uuid = data.ok.uuid;
           this.setState(this.state);
         }
       } else if (res.op == UserOperation.PasswordReset) {

ui/src/components/symbols.tsx

@@ -18,9 +18,6 @@ export class Symbols extends Component<any, any> {
           <symbol id="icon-refresh-cw" viewBox="0 0 24 24">
             <path d="M4.453 9.334c0.737-2.083 2.247-3.669 4.096-4.552s4.032-1.059 6.114-0.322c1.186 0.42 2.206 1.088 2.983 1.88l2.83 2.66h-3.476c-0.552 0-1 0.448-1 1s0.448 1 1 1h5.997c0.005 0 0.009 0 0.014 0 0.137-0.001 0.268-0.031 0.386-0.082 0.119-0.051 0.229-0.126 0.324-0.225 0.012-0.013 0.024-0.026 0.036-0.039 0.075-0.087 0.133-0.183 0.173-0.285s0.064-0.211 0.069-0.326c0.001-0.015 0.001-0.029 0.001-0.043v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1v3.689l-2.926-2.749c-0.992-1.010-2.271-1.843-3.743-2.364-2.603-0.921-5.335-0.699-7.643 0.402s-4.199 3.086-5.12 5.689c-0.185 0.52 0.088 1.091 0.608 1.276s1.092-0.088 1.276-0.609zM2 16.312l2.955 2.777c1.929 1.931 4.49 2.908 7.048 2.909s5.119-0.975 7.072-2.927c1.104-1.104 1.901-2.407 2.361-3.745 0.18-0.522-0.098-1.091-0.621-1.271s-1.091 0.098-1.271 0.621c-0.361 1.050-0.993 2.091-1.883 2.981-1.563 1.562-3.609 2.342-5.657 2.342s-4.094-0.782-5.679-2.366l-2.8-2.633h3.475c0.552 0 1-0.448 1-1s-0.448-1-1-1h-5.997c-0.005 0-0.009 0-0.014 0-0.137 0.001-0.268 0.031-0.386 0.082-0.119 0.051-0.229 0.126-0.324 0.225-0.012 0.013-0.024 0.026-0.036 0.039-0.075 0.087-0.133 0.183-0.173 0.285s-0.064 0.211-0.069 0.326c-0.001 0.015-0.001 0.029-0.001 0.043v6c0 0.552 0.448 1 1 1s1-0.448 1-1z"></path>
           </symbol>
-          <symbol id="icon-pause" viewBox="0 0 24 24">
-            <path d="M6 3c-0.552 0-1 0.448-1 1v16c0 0.552 0.448 1 1 1h4c0.552 0 1-0.448 1-1v-16c0-0.552-0.448-1-1-1zM7 5h2v14h-2zM14 3c-0.552 0-1 0.448-1 1v16c0 0.552 0.448 1 1 1h4c0.552 0 1-0.448 1-1v-16c0-0.552-0.448-1-1-1zM15 5h2v14h-2z"></path>
-          </symbol>
           <symbol id="icon-play" viewBox="0 0 24 24">
             <path d="M5.541 2.159c-0.153-0.1-0.34-0.159-0.541-0.159-0.552 0-1 0.448-1 1v18c-0.001 0.182 0.050 0.372 0.159 0.541 0.299 0.465 0.917 0.599 1.382 0.3l14-9c0.114-0.072 0.219-0.174 0.3-0.3 0.299-0.465 0.164-1.083-0.3-1.382zM6 4.832l11.151 7.168-11.151 7.168z"></path>
           </symbol>

ui/src/interfaces.ts

@@ -578,9 +578,11 @@ export interface RegisterForm {
 }
 
 export interface GetCaptchaResponse {
-  png: string;
-  wav?: string;
-  uuid: string;
+  ok?: {
+    png: string;
+    wav?: string;
+    uuid: string;
+  };
 }
 
 export interface LoginResponse {