I’m a music engineer building a personal website using react. I’m tryna make a contact form where the person types a subject in an input field, a message in a textarea, then hits a “reach out” button and their mail client opens with the subject and body of the e-mail populated with the contents of the input field and textarea respectively. The trouble is I can’t seem to pass data from my react refs to the window.open function…the email pulls up with the subject reading “subject” and the body reading “body”. Relevant code follows, any help would be greatly appreciated

import React, { useRef } from 'react';
import './index.css';
import * as parts from   './UIComponents.js'

const subjectRef = useRef(null);
const messageRef = useRef(null);

export class Email extends  React.Component {
      goButton(i) {
          return(<parts.ButtonFactory onClick={() => this.go()} value={i} />);
  }
      go() {
         let subject = subjectRef.current.value;
         let body = messageRef.current.value;
         window.open('mailto:mixedbyinstinct@gmail.com?subject=subject&body=body');
  }
      render() {
        return (
          <div className="email-form">
          <div className="container">
          <div className="input-group">
            <label>Your Name:</label>
            <input type="text" ref={subjectRef} />
            <br />
            <label>Detailed Message:</label>
           <textarea rows="8" ref={messageRef} />
          </div>
          <div className="btn-group">
            {this.goButton('REACH OUT')}
          </div>
          </div>
          </div>
    );
}
}