<commit_before>import React, {Component} from 'react';

import {
  Avatar,
  Button,
  Card,
  Col,
  Collapse,
  Form,
  Input,
  Layout,
  Row
} from 'antd'
import {BrowserRouter, Link} from 'react-router-dom'
import firebase from './firebaseConfig'
import axios from 'axios'

import './dashboard.css'

const {Content, Sider} = Layout
const Panel = Collapse.Panel

class Dashboard extends Component {
  constructor() {
    super()
    this.state = {
      username: '',
      email: '',
      photoURL: '',
      roomList: [],
      topicTitle: ''
    }
  }

  createRoom() {
    axios.get(`https://us-central1-minutes-vart.cloudfunctions.net/watsonNLU?text=${this.state.topicTitle}`)
    let ref = firebase.database().ref(`/rooms/`)
    let roomData = {
      topic: {
        text: this.state.topicTitle
      }
    }
    ref.push().set(roomData)
  }

  getAllRooms() {
    let ref = firebase
      .database()
      .ref('/rooms')
    ref.on('value', snapshot => {
      let temp = []
      let list = Object.entries(snapshot.val())
      list.map(li => {
        temp.push({
          roomId: li[0],
          topic: li[1].topic.text || undefined
        })
      })
      this.setState({roomList: temp})
    })
  }

  topicTitleChange(e) {
    this.setState({topicTitle: e.target.value})
  }

  logout() {
    console.log('Logout')
    firebase
      .auth()
      .signOut()
      .then(() => {
        console.log('signed out')
      })
  }

  stateChangeListener() {
    firebase
      .auth()
      .onAuthStateChanged(user => {
        if (user) {
          console.log(user)
          this.setState({username: user.displayName, email: user.email, photoURL: user.photoURL})
        } else {
          this
            .props
            .history
            .push('/')
        }
      })
  }

  componentDidMount() {
    this.stateChangeListener()
    this.getAllRooms()
  }

  paketJoin(link) {
    let ref = firebase
      .database()
      .ref(`/rooms/${link}/participant`)
    ref
      .push()
      .set({username: this.state.username})
  }

  render() {
    return (
      <Layout>
        <Layout className='App'>
          <div className='kanban'>
            <div className='logo'>
              <div className='minutes'>
                <img
                  alt='logo'
                  src='https://www.freelogoservices.com/api/main/images/1j+ojVVCOMkX9Wyrexe4hGfU16jF6EIMjkLP2ig3M2RE9gxvkSYrhfNi47hlc1xFtFwKhhQIc8E6iyd9'/>
              </div>
              <div className='name'>
                <h1>Project Name</h1>
              </div>
            </div>
            <div className='kanbancontent'>
              <div style={{
                padding: '20px'
              }}>
                <Row gutter={5}>
                  <Col span={6}>
                    <Card title="Backlog" bordered={false}>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                    </Card>
                  </Col>
                  <Col span={6}>
                    <Card title="Todo" bordered={false}>Card content</Card>
                  </Col>
                  <Col span={6}>
                    <Card title="On Progress" bordered={false}>Card content</Card>
                  </Col>
                  <Col span={6}>
                    <Card title="Done" bordered={false}>Card content
                      <br />
                      Card content
                    </Card>
                  </Col>
                </Row>
              </div>
            </div>
          </div>
          <div className='discussion'>
            <div className='info'>
              <div className='userinfo'>
                <Avatar size="large" src={this.state.photoURL}/><br/>
                <b>
                  {this.state.username}
                </b>
              </div>
              <div className='logout'>
                <Button
                  type="primary"
                  onClick={this.logout}
                  style={{
                  background: '#13314D'
                }}>Logout</Button>
              </div>
            </div>
            <div className='active'>
              <Form onSubmit={(e) => this.createRoom(e)}>
                <Input
                onChange={e => this.topicTitleChange(e)}
                placeholder="Room Name..." />
                <Button icon="plus" size='large' htmlType='submit'>Add Discussion</Button>
              </Form>
              <br/>
              <br/>
              {
                this.state.roomList.map(room => {
                  return (
                    <Card
                      title={room.topic}
                      extra={< Link to={{ pathname: `/chatroom/${room.roomId}` }}> Join </Link>}
                      style={{ marginBottom: '10px', background: '#13314D' }}
                      bordered={false}>
                      <p style={{ color: 'white' }}>
                        Discussion topic
                      </p>
                    </Card>
                  )
                })
              }
            </div>
            <div className='history'>
              <Collapse bordered={false} className='collapse'>
                <Panel header="This is panel header 1" key="1" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
                <Panel header="This is panel header 2" key="2" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
                <Panel header="This is panel header 3" key="3" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
              </Collapse>
            </div>
          </div><commit_msg>ambil firebase kanban<commit_after>import React, {Component} from 'react';

import {
  Avatar,
  Button,
  Card,
  Col,
  Collapse,
  Form,
  Input,
  Layout,
  Row
} from 'antd'
import {BrowserRouter, Link} from 'react-router-dom'
import firebase from './firebaseConfig'
import axios from 'axios'

import './dashboard.css'

const {Content, Sider} = Layout
const Panel = Collapse.Panel

class Dashboard extends Component {
  constructor() {
    super()
    this.state = {
      username: '',
      email: '',
      photoURL: '',
      roomList: [],
      todoList: {
        backlog: [],
        done: [],
        onProgress: [],
        todo: []
      },
      topicTitle: ''
    }
  }

  createRoom() {
    axios.get(`https://us-central1-minutes-vart.cloudfunctions.net/watsonNLU?text=${this.state.topicTitle}`)
    let ref = firebase.database().ref(`/rooms/`)
    let roomData = {
      topic: {
        text: this.state.topicTitle
      }
    }
    ref.push().set(roomData)
  }

  getAllRooms() {
    let ref = firebase
      .database()
      .ref('/rooms')
    ref.on('value', snapshot => {
      let temp = []
      let list = Object.entries(snapshot.val())
      list.map(li => {
        temp.push({
          roomId: li[0],
          topic: li[1].topic.text || undefined
        })
      })
      this.setState({roomList: temp})
    })
  }

  getAllTodo() {
    let ref = firebase.database().ref('/kanban')
    ref.on('value', snapshot => {
      if (snapshot.val() !== null) {
        let list = Object.entries(snapshot.val())
        let todoList = {
          backlog: [],
          done: [],
          onProgress: [],
          todo: []
        }
        list.map(li => {
          if (li[1].status === 'done') {
            let done = li[1]
            done.taskId = li[0]
            todoList.done.push(done)
          } else if (li[1].status === 'onProgress') {
            let progress = li[1]
            progress.taskId = li[0]
            todoList.onProgress.push(progress)
          } else if (li[1] === 'todo') {
            let todo = li[1]
            todo.taskId = li[0]
            todoList.todo.push(todo)
          } else {
            let backlog = li[1]
            backlog.taskId = li[0]
            todoList.backlog.push(backlog)
          }
        })
        this.setState({ todoList: todoList })
      }
    })
  }

  topicTitleChange(e) {
    this.setState({topicTitle: e.target.value})
  }

  logout() {
    console.log('Logout')
    firebase
      .auth()
      .signOut()
      .then(() => {
        console.log('signed out')
      })
  }

  stateChangeListener() {
    firebase
      .auth()
      .onAuthStateChanged(user => {
        if (user) {
          console.log(user)
          this.setState({username: user.displayName, email: user.email, photoURL: user.photoURL})
        } else {
          this
            .props
            .history
            .push('/')
        }
      })
  }

  componentDidMount() {
    this.stateChangeListener()
    this.getAllTodo()
    this.getAllRooms()
  }

  paketJoin(link) {
    let ref = firebase
      .database()
      .ref(`/rooms/${link}/participant`)
    ref
      .push()
      .set({username: this.state.username})
  }

  render() {
    return (
      <Layout>
        <Layout className='App'>
          <div className='kanban'>
            <div className='logo'>
              <div className='minutes'>
                <img
                  alt='logo'
                  src='https://www.freelogoservices.com/api/main/images/1j+ojVVCOMkX9Wyrexe4hGfU16jF6EIMjkLP2ig3M2RE9gxvkSYrhfNi47hlc1xFtFwKhhQIc8E6iyd9'/>
              </div>
              <div className='name'>
                <h1>Project Name</h1>
              </div>
            </div>
            <div className='kanbancontent'>
              <div style={{
                padding: '20px'
              }}>
                <Row gutter={5}>
                  <Col span={6}>
                    <Card title="Backlog" bordered={false}>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                      <div>
                        <Card>Test Tampilan</Card><br />
                      </div>
                    </Card>
                  </Col>
                  <Col span={6}>
                    <Card title="Todo" bordered={false}>Card content</Card>
                  </Col>
                  <Col span={6}>
                    <Card title="On Progress" bordered={false}>Card content</Card>
                  </Col>
                  <Col span={6}>
                    <Card title="Done" bordered={false}>Card content
                      <br />
                      Card content
                    </Card>
                  </Col>
                </Row>
              </div>
            </div>
          </div>
          <div className='discussion'>
            <div className='info'>
              <div className='userinfo'>
                <Avatar size="large" src={this.state.photoURL}/><br/>
                <b>
                  {this.state.username}
                </b>
              </div>
              <div className='logout'>
                <Button
                  type="primary"
                  onClick={this.logout}
                  style={{
                  background: '#13314D'
                }}>Logout</Button>
              </div>
            </div>
            <div className='active'>
              <Form onSubmit={(e) => this.createRoom(e)}>
                <Input
                onChange={e => this.topicTitleChange(e)}
                placeholder="Room Name..." />
                <Button icon="plus" size='large' htmlType='submit'>Add Discussion</Button>
              </Form>
              <br/>
              <br/>
              {
                this.state.roomList.map((room, idx) => {
                  return (
                    <Card
                      key={idx}
                      title={room.topic}
                      extra={< Link to={{ pathname: `/chatroom/${room.roomId}` }}> Join </Link>}
                      style={{ marginBottom: '10px', background: '#13314D' }}
                      bordered={false}>
                      <p style={{ color: 'white' }}>
                        Discussion topic
                      </p>
                    </Card>
                  )
                })
              }
            </div>
            <div className='history'>
              <Collapse bordered={false} className='collapse'>
                <Panel header="This is panel header 1" key="1" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
                <Panel header="This is panel header 2" key="2" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
                <Panel header="This is panel header 3" key="3" style={customPanelStyle}>
                  <p>blah</p>
                </Panel>
              </Collapse>
            </div>
          </div>
{'fraction_non_alphanumeric': 0.13824496978042997, 'fraction_numerical': 0.007880039782725118, 'mean_word_length': 1.2193548387096773, 'pattern_counts': {'":': 0, '<': 195, '<?xml version=': 0, '>': 211, 'https://': 4, 'lorem ipsum': 0, 'www.': 2, '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': '1343814', 'n_tokens_mistral': 3792, 'n_tokens_neox': 3626, 'n_words': 687}