<commit_before>import React, { Component, useState } from 'react';
import ChatRoom from '../components/ChatRoom';
import '../style/index.scss';

// const initialState = {
//   username: '',
//   uid: '',
//   socket: io()
// };
const userState = (initialState) => {
  const [user, setUser] = useState(initialState);
  return [user, setUser];
};

const generateUid = () => {
  return new Date().getTime() + '' + Math.floor(Math.random() * 9 + 1);
};
const App = (props) => {
  const [user, setUser] = userState({ username: '', uid: '', socket: io() });
  console.log(user);
  return (
    <div>
      {user.uid ? (
        <ChatRoom uid={user.uid} username={user.username} socket={user.socket} />
      ) : (
        <div className="login-box">
          <h2>登 陆</h2>
          <div className="input">
            <input
              type="text"
              placeholder="请输入用户名"
              onChange={(e) => {
                // 异步操作，事件需要维持
                e.persist();
                setUser((prevState) => ({ ...prevState, ...{ username: e.target.value } }));
              }} /* onKeyPress={this.handleKeyPress.bind(this)} */
            />
          </div>
          <div className="submit">
            <button
              type="button"
              onClick={() => {
                const uid = generateUid();
                const username = user.username ? user.username : `游客${uid}`;
                setUser((prevState) => ({ ...prevState, ...{ uid, username } }));
                user.socket.emit('login', { uid, username });
              }}
            >
              提交
            </button>
          </div>
        </div>
      )}
    </div>
  );
};
export default App;
// export default class App extends Component {
//   constructor(props) {
//     super(props);
//     this.state = {
//       username: '',
//       uid: '',
//       socket: io()
//     };
//   }

//   // 生成用户id

//   // 监控名称变化
//   handleChange(e) {
//     this.setState({ username: e.target.value });
//   }<commit_msg>extract public method<commit_after>import React, { Component, useState } from 'react';
import ChatRoom from '../components/ChatRoom';
import '../style/index.scss';

// const initialState = {
//   username: '',
//   uid: '',
//   socket: io()
// };
const userState = (initialState) => {
  const [user, setUser] = useState(initialState);
  return [user, setUser];
};

const generateUid = () => {
  return new Date().getTime() + '' + Math.floor(Math.random() * 999 + 1);
};
const App = (props) => {
  const [user, setUser] = userState({ username: '', uid: '', socket: io() });
  const handleLogin = () => {
    const uid = generateUid();
    const username = user.username ? user.username : `游客${uid}`;
    setUser((prevState) => ({ ...prevState, ...{ uid, username } }));
    user.socket.emit('login', { uid, username });
  };
  const handleKeyPress = (e) => {
    if (e.key == 'Enter') {
      handleLogin();
    }
    return false;
  };
  return (
    <div>
      {user.uid ? (
        <ChatRoom uid={user.uid} username={user.username} socket={user.socket} />
      ) : (
        <div className="login-box">
          <h2>登 陆</h2>
          <div className="input">
            <input
              type="text"
              placeholder="请输入用户名"
              onChange={(e) => {
                // 异步操作，事件需要维持
                e.persist();
                setUser((prevState) => ({ ...prevState, ...{ username: e.target.value } }));
              }}
              onKeyPress={handleKeyPress}
            />
          </div>
          <div className="submit">
            <button type="button" onClick={handleLogin}>
              提交
            </button>
          </div>
        </div>
      )}
    </div>
  );
};
export default App;
// export default class App extends Component {
//   constructor(props) {
//     super(props);
//     this.state = {
//       username: '',
//       uid: '',
//       socket: io()
//     };
//   }

//   // 生成用户id

//   // 监控名称变化
//   handleChange(e) {
//     this.setState({ username: e.target.value });
//   }
{'fraction_non_alphanumeric': 0.19093372751909338, 'fraction_numerical': 0.002463661000246366, 'mean_word_length': 1.730329522528581, 'pattern_counts': {'":': 0, '<': 31, '<?xml version=': 0, '>': 46, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3584399', 'n_tokens_mistral': 1268, 'n_tokens_neox': 1286, 'n_words': 252}