Fakultas Ilmu Komputer UI

Commit 45078995 authored by Alya Putri's avatar Alya Putri
Browse files

set default menu active state when first logging in, set menu active state to...

set default menu active state when first logging in, set menu active state to 'Beranda' if click logo
parent f8fb5351
File deleted
var testsContext = require.context("../../assets/js/__test__", false);
var runnable = testsContext.keys();
runnable.forEach(testsContext);
\ No newline at end of file
......@@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Segment } from 'semantic-ui-react';
import Notification from './components/Notification';
import Storage from './lib/Storage';
export default class NotificationPage extends React.Component {
static propTypes = {
......@@ -10,20 +11,23 @@ export default class NotificationPage extends React.Component {
constructor(props) {
super(props);
console.log('Notifikasi');
Storage.set('menu-active-state', 'Notifikasi');
}
render() {
return (
<div className="notificationPage">
<Segment className="notifikasi">
<Notification
title="Your Application Has Been Rejected"
text="Tutuplapak has rejected your applications"
<Notification
title="Your Application Has Been Rejected"
text="Tutuplapak has rejected your applications"
timestamp="2019-10-10T13:00:00"
/>
<Notification
title="Lorem Ipsum"
text="Dolor Sit Amet"
<Notification
title="Lorem Ipsum"
text="Dolor Sit Amet"
timestamp="1970-01-01T06:00:00"
/>
</Segment>
......
......@@ -108,6 +108,10 @@ export default class ProfilePage extends React.Component {
this.gotoStudentResume = this.gotoStudentResume.bind(this);
this.gotoStudentTranscript = this.gotoStudentTranscript.bind(this);
this.getProfile();
console.log('profil');
Storage.set('menu-active-state', 'Profil');
}
getProfile() {
......
......@@ -6,6 +6,7 @@ import Tabs from './components/Tabs';
import Pane from './components/Pane';
import VacancyList from './components/VacancyList';
import Pagination from './components/Pagination';
import Storage from './lib/Storage';
import InfoLowonganModal from './components/InfoLowonganModal';
export default class VacancyPage extends React.Component {
......@@ -45,6 +46,9 @@ export default class VacancyPage extends React.Component {
],
};
this.handleChange = this.handleChange.bind(this);
console.log('vacancy');
Storage.set('menu-active-state', 'Beranda');
}
generateVacancies() {
......
import React from 'react';
import ReactTestUtils from 'react-dom/test-utils';
import NotificationPage from '../NotificationPage';
import Notification from '../components/Notification';
import TopMenu from '../components/TopMenu';
import { studentUser } from '../object/Response';
describe('NotificationPage', () => {
const studentSession = {
const studentSession = {
url: 'http://localhost:8000/api/users/9/',
username: 'muhammad.reza42',
email: 'muhammad.reza42@ui.ac.id',
is_staff: false,
company: null,
supervisor: null,
student: {
id: 3,
user: {
url: 'http://localhost:8000/api/users/9/',
username: 'muhammad.reza42',
email: 'muhammad.reza42@ui.ac.id',
is_staff: false,
company: null,
supervisor: null,
student: {
id: 3,
user: {
url: 'http://localhost:8000/api/users/9/',
username: 'muhammad.reza42',
email: 'muhammad.reza42@ui.ac.id',
is_staff: false,
},
name: 'Muhammad R.',
created: '2017-03-28T13:33:46.147241Z',
updated: '2017-03-28T13:33:46.148248Z',
npm: 1406543593,
resume: null,
phone_number: null,
birth_place: null,
birth_date: null,
major: null,
batch: null,
show_resume: false,
bookmarked_vacancies: [
3,
2,
],
applied_vacancies: [
3,
1,
],
},
};
},
name: 'Muhammad R.',
created: '2017-03-28T13:33:46.147241Z',
updated: '2017-03-28T13:33:46.148248Z',
npm: 1406543593,
resume: null,
phone_number: null,
birth_place: null,
birth_date: null,
major: null,
batch: null,
show_resume: false,
bookmarked_vacancies: [
3,
2,
],
applied_vacancies: [
3,
1,
],
},
};
it('renders for notification page without problem', () => {
const notification = ReactTestUtils.renderIntoDocument(
<NotificationPage user={{ data: studentSession }}/>);
expect(notification).to.exist;
});
});
it('renders for notification page without problem', () => {
const notification = ReactTestUtils.renderIntoDocument(
<NotificationPage user={{ data: studentSession }}/>);
expect(notification).to.exist;
});
it('sets top menu active item according to page', () => {
ReactTestUtils.renderIntoDocument(
<NotificationPage
user={{ data: studentSession }}
/>,
);
const topmenu = ReactTestUtils.renderIntoDocument(
<TopMenu user={studentUser}>
<div> test </div>
</TopMenu>,
);
expect(topmenu.state.activeItem).to.equal('Notifikasi');
});
});
......@@ -2,8 +2,10 @@
import React from 'react';
import ReactTestUtils from 'react-dom/test-utils';
import fetchMock from 'fetch-mock';
import TopMenu from '../components/TopMenu';
import ProfilePage from '../ProfilePage';
import { studentSession, companyUser, response, response2 } from '../object/Response';
import Storage from '../lib/Storage';
import { studentSession, studentUser, companyUser, response, response2 } from '../object/Response';
const studentUserVerified = {
role: 'student',
......@@ -52,7 +54,11 @@ describe('ProfilePage', () => {
it('renders without problem', () => {
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: true, data: studentSession }} user={{ data: studentSession }} params={{}} />);
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }} params={{}}
/>,
);
profile.getProfile().then(() => expect(profile.state.name).to.equal(response.name));
profile.getProfile().then(() => expect(profile.state.birth_date).to.equal('24 Februari 1995'));
profile.updateForm(true);
......@@ -62,7 +68,12 @@ describe('ProfilePage', () => {
it('get profile for company without problem', () => {
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: false, data: studentSession }} user={{ data: companyUser }} params={{ id: 3 }} />);
<ProfilePage
route={{ own: false, data: studentSession }}
user={{ data: companyUser }}
params={{ id: 3 }}
/>,
);
profile.getProfile().then(()=> expect(profile.state.name).to.equal(response.name));
fetchMock.restore();
});
......@@ -70,7 +81,12 @@ describe('ProfilePage', () => {
it('get profile for company without problem', () => {
fetchMock.get('*', response2);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: false, data: studentSession }} user={{ data: companyUser }} params={{ id: 3 }} />);
<ProfilePage
route={{ own: false, data: studentSession }}
user={{ data: companyUser }}
params={{ id: 3 }}
/>,
);
profile.getProfile().then(()=> expect(profile.state.name).to.equal(response2.name));
fetchMock.restore();
});
......@@ -78,25 +94,37 @@ describe('ProfilePage', () => {
it('get student profile without problem', () => {
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: true, data: studentSession }} user={{ data: studentSession }} params={{}} />);
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }}
params={{}}
/>,
);
profile.getProfile().then(()=> {
expect(profile.state.name).to.equal(studentUserVerified.data.student.name);
expect(profile.state.npm).to.equal(studentUserVerified.data.student.npm);
expect(profile.state.birth_date).to.equal(studentUserVerified.data.student.birth_date);
expect(profile.state.major).to.equal(studentUserVerified.data.student.major);
expect(profile.state.batch).to.equal(studentUserVerified.data.student.batch);
expect(profile.state.bookmarked_vacancies).to.equal(studentUserVerified.data.student.bookmarked_vacancies);
expect(profile.state.applied_vacancies).to.equal(studentUserVerified.data.student.applied_vacancies);
expect(profile.state.bookmarked_vacancies).to.equal(
studentUserVerified.data.student.bookmarked_vacancies);
expect(profile.state.applied_vacancies).to.equal(
studentUserVerified.data.student.applied_vacancies);
});
})
it('renders edit profile default value', () => {
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: true, data: studentSession }} user={{ data: studentSession }} params={{}} />);
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }}
params={{}}
/>,
);
const phoneNumberNode = ReactTestUtils.scryRenderedDOMComponentsWithTag(profile, 'Input')[2];
profile.getProfile().then(()=> expect(profile.state.phone_number).to.equal(phoneNumberNode.value));
profile.getProfile().then(()=> expect(
profile.state.phone_number).to.equal(phoneNumberNode.value));
profile.updateForm(true);
fetchMock.restore();
});
......@@ -104,7 +132,12 @@ describe('ProfilePage', () => {
it('renders without problem when error getting data', () => {
fetchMock.get('*', 400);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: false, data: studentSession }} user={{ data: studentSession }} params={{ id: 3 }} />);
<ProfilePage
route={{ own: false, data: studentSession }}
user={{ data: studentSession }}
params={{ id: 3 }}
/>,
);
profile.getProfile().then(()=> expect(profile.state.name).to.equal('Gagal mendapatkan informasi'));
});
......@@ -112,7 +145,12 @@ describe('ProfilePage', () => {
fetchMock.patch('*', { data: 'value' });
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: true, data: studentSession }} user={{ data: studentSession }} params={{ id: 3 }} />);
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }}
params={{ id: 3 }}
/>,
);
ReactTestUtils.scryRenderedDOMComponentsWithTag(profile, 'Input')[0];
// const passwordNode = ReactDOM.findDOMNode(formLogin.refs.password);
......@@ -123,11 +161,32 @@ describe('ProfilePage', () => {
it('renders count application without problem', () => {
fetchMock.get('*', response);
const profile = ReactTestUtils.renderIntoDocument(
<ProfilePage route={{ own: true, data: studentSession }} user={{ data: studentSession }} params={{}} />);
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }}
params={{}}
/>,
);
profile.getProfile().then(()=> expect(profile.state.acceptedNo).to.not.equal(''));
profile.getProfile().then(()=> expect(profile.state.readNo).to.not.equal(''));
fetchMock.restore();
});
it('sets top menu active item according to page', () => {
fetchMock.get('*', response);
ReactTestUtils.renderIntoDocument(
<ProfilePage
route={{ own: true, data: studentSession }}
user={{ data: studentSession }}
params={{}}
/>,
);
const topmenu = ReactTestUtils.renderIntoDocument(
<TopMenu user={studentUser}>
<div> test </div>
</TopMenu>,
);
expect(topmenu.state.activeItem).to.equal('Profil');
fetchMock.restore();
});
});
......@@ -3,6 +3,8 @@ import React from 'react';
import ReactTestUtils from 'react-dom/test-utils';
import fetchMock from 'fetch-mock';
import VacancyPage from '../VacancyPage';
import ProfilePage from '../ProfilePage';
import TopMenu from '../components/TopMenu';
import { studentUser, companyUser } from '../object/Response';
describe('VacancyPage', () => {
......@@ -46,5 +48,14 @@ describe('VacancyPage', () => {
expect(vacancyPage).to.exist;
expect(vacancyPage.state.sort).to.equals('ASC');
});
});
it('sets top menu active item according to page', () => {
ReactTestUtils.renderIntoDocument(<VacancyPage user={studentUser} />);
const topmenu = ReactTestUtils.renderIntoDocument(
<TopMenu user={studentUser}>
<div> test </div>
</TopMenu>,
);
expect(topmenu.state.activeItem).to.equal('Beranda');
});
});
......@@ -40,7 +40,8 @@ export default class TopMenu extends React.Component {
/* istanbul ignore next */
moment.locale('id');
this.state = {
activeItem: 'Beranda',
// activeItem: Storage.get('menu-active-state'),
activeItem: this.menuActiveState(),
logoutLoading: false,
currentDate:
moment(new Date()).format('dddd') +
......@@ -48,7 +49,7 @@ export default class TopMenu extends React.Component {
moment(new Date()).format('LL'),
todayQuote: quotes(),
isOpen: false,
applianceInformation:
applianceInformation:
"1. Pastikan anda sudah mengupdate profile anda\n" +
"2. Cari lowongan internship yang ada di tab lowongan\n" +
"3. Klik tombol 'Detail'\n" +
......@@ -56,16 +57,23 @@ export default class TopMenu extends React.Component {
"5. Jelaskan mengapa anda ingin mengikuti lowongan internship tersebut di 'Cover Letter'\n"+
"6. Klik tombol 'Daftar'\n",
kapeDescription: "Kanal Akses Pendaftaran KP Elektronik"
};
this.logout = this.logout.bind(this);
this.logoutCompany = this.logoutCompany.bind(this);
this.handleModalClick = this.handleModalClick.bind(this);
console.log(this.state.todayQuote);
console.log(Storage.get('menu-active-state'));
}
handleItemClick = (e, { name }) => this.setState({ activeItem: name });
handleItemClick = (e, { name }) => {
if(name === 'Logo') {
this.setState({ activeItem: 'Beranda' });
} else {
this.setState({ activeItem: name });
}
}
handleOpen = () => {
......@@ -111,6 +119,13 @@ export default class TopMenu extends React.Component {
window.location.replace('/home');
};
menuActiveState() {
if (Storage.get('menu-active-state') == null) {
return 'Beranda';
}
return Storage.get('menu-active-state');
}
render() {
const { activeItem } = this.state;
const data = TopMenu.getInfo(this.props.user);
......@@ -151,12 +166,12 @@ export default class TopMenu extends React.Component {
/>
<Menu color="blue" pointing secondary>
<Menu.Menu position="left">
<Menu.Item>
<Image as={Link} size="small" src="/assets/img/logo.png" to="/home" />
<Menu.Item style={{ padding: '0px' }} as={Link} to="/home" name="Logo" onClick={this.handleItemClick}>
<Image size="small" src="/assets/img/logo.png" />
{this.state.kapeDescription}
</Menu.Item>
</Menu.Menu>
<Menu.Menu position="right">
{this.props.user.role === 'student' && (
<Menu.Item>{btn}</Menu.Item>
......@@ -165,7 +180,7 @@ export default class TopMenu extends React.Component {
{this.state.currentDate}
</Menu.Item>
<Menu.Item as={Link} to="/home" name="Beranda" active={activeItem === 'Beranda'} onClick={this.handleItemClick} />
{ this.props.user.role === 'company' &&
<Menu.Item as={Link} to="/profil-perusahaan" name="Profil" active={activeItem === 'Profil'} onClick={this.handleItemClick} /> }
{ this.props.user.data.is_staff &&
......@@ -185,7 +200,7 @@ export default class TopMenu extends React.Component {
/>
{ this.props.user.role === 'student' &&
<Menu.Item as={Link} to="/profil-mahasiswa" style={{ margin: '10px' }} name="Profil" active={activeItem === 'Profil'} onClick={this.handleItemClick} /> }
<Menu.Item as={Link} to="/edit-profil-mahasiswa" style={{ margin: '10px' }} name="Edit Profil" active={activeItem === 'EditProfil'} onClick={this.handleItemClick} />
<Menu.Item as={Link} to="/edit-profil-mahasiswa" style={{ margin: '10px' }} name="Edit Profil" active={activeItem === 'EditProfil'} onClick={this.handleItemClick} />
<Button.Group floated="right">
<Button as={Link} onClick={this.logout} loading={this.state.logoutLoading} name="logout" color="blue" size="tiny">Keluar</Button></Button.Group>
</Popup>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment