Fakultas Ilmu Komputer UI

VacancyList.jsx 2.35 KB
Newer Older
1
import React from 'react';
2
import { Segment, Item, Button } from 'semantic-ui-react';
3
import Vacancy from './Vacancy';
4
import CompanyVacancy from './CompanyVacancy';
5
import Server from '../lib/Server';
6
7
8
9

export default class VacancyList extends React.Component {

  static propTypes = {
10
    url: React.PropTypes.string.isRequired,
11
    userId: React.PropTypes.number.isRequired,
12
    status: React.PropTypes.string,
13
    type: React.PropTypes.string,
14
15
16
  };

  static defaultProps = {
17
    status: 'Daftar',
18
    type: 'student',
19
20
  };

21
22
  constructor(props) {
    super(props);
M. Reza Qorib's avatar
M. Reza Qorib committed
23
    /* istanbul ignore next */
24
25
26
    if (this.props.type === 'student') {
      this.updateBookmarkList();
    }
27
    Server.get(this.props.url, false).then((data) => {
28
29
      this.setState({ vacancies: data });
    });
30
31
    this.state = { vacancies: [], bookmarkList: [] };
    this.updateBookmarkList = this.updateBookmarkList.bind(this);
32
    this.generateVacancies = this.generateVacancies.bind(this);
33
    this.checkBookmark = this.checkBookmark.bind(this);
34
    this.companyHeader = this.companyHeader.bind(this);
35
36
37
  }

  checkBookmark(id) {
38
39
    for (let i = 0; i < this.state.bookmarkList.length; i += 1) {
      if (id === this.state.bookmarkList[i].id) { return 1; }
40
41
    }
    return 0;
42
43
  }

44
  updateBookmarkList() {
45
    Server.get(`/students/${this.props.userId}/bookmarked-vacancies/`, false).then((data) => {
46
47
48
      this.setState({ bookmarkList: data });
    });
  }
49

50
  generateVacancies() {
51
52
53
54
55
56
57
58
59
60
61
62
63
    if (this.props.type === 'student') {
      return this.state.vacancies.map(vacancy =>
        (
          <Vacancy
            key={vacancy.id}
            status={this.props.status}
            bookmarked={this.checkBookmark(vacancy.id)}
            data={vacancy}
          />
        ),
      );
    }

64
    return this.state.vacancies.map(vacancy =>
65
66
67
      (
        <CompanyVacancy key={vacancy.id} data={vacancy} />
      ),
68
69
70
    );
  }

71
72
73
74
75
76
77
78
79
80
81
82
  companyHeader() {
    if (this.props.type === 'company') {
      return (
        <div>
          <Button icon="eye" secondary labelPosition="left" content="Lihat Semua Pendaftar" />
          <Button icon="add" secondary labelPosition="left" content="Tambah Lowongan Baru" />
        </div>
      );
    }

    return '';
  }
83

84
  render = () => (
85
86
87
88
89
90
    <Segment>
      { this.companyHeader() }
      <Item.Group relaxed>
        { this.generateVacancies() }
      </Item.Group>
    </Segment>
91
  );
92
}