Skip to content

Commit 4b9859f

Browse files
SacretSacret
committed
Change logic and file structure
1 parent d7d6553 commit 4b9859f

14 files changed

Lines changed: 134 additions & 318 deletions

‎js/actions/FilterActions.js‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,9 @@ import Reflux from 'reflux';
88
const FilterActions = Reflux.createActions([
99
'getFilters',
1010
'setFilter',
11-
'setFilterTags',
12-
'setFilterLanguages',
13-
'setSearch',
14-
'clearFilters'
11+
'setTags',
12+
'setLanguages',
13+
'setSearch'
1514
]);
1615

1716
export default FilterActions;

‎js/actions/LanguagesActions.js‎

Lines changed: 0 additions & 13 deletions
This file was deleted.

‎js/actions/ReposActions.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import Reflux from 'reflux';
66
* List of actions for github user's repos
77
*/
88
const ReposActions = Reflux.createActions([
9+
'initRepos',
910
'getRepos',
1011
'filterRepos'
1112
]);

‎js/actions/TagsActions.js‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

‎js/components/blocks/ClearFiltersBlock.js‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import React from 'react';
44
import Reflux from 'reflux';
55
//
66
import FilterActions from '../../actions/FilterActions';
7+
import ReposActions from '../../actions/ReposActions';
78
//
89
import FilterStore from '../../stores/FilterStore';
910

@@ -15,7 +16,9 @@ const ClearFiltersBlock = React.createClass({
1516
mixins: [Reflux.connect(FilterStore, 'filterStore')],
1617

1718
clearFilters() {
18-
FilterActions.clearFilters(this.props.uname);
19+
FilterActions.getFilters();
20+
ReposActions.initRepos();
21+
ReposActions.getRepos(this.props.uname, 1, 'all');
1922
},
2023

2124
render() {
@@ -24,9 +27,9 @@ const ClearFiltersBlock = React.createClass({
2427
//
2528
const isFiltered = filterStore &&
2629
(
27-
filterStore.currentFilter !== 'all' ||
28-
filterStore.tagReposIds.length ||
29-
filterStore.languageReposIds.length ||
30+
filterStore.filter !== 'all' ||
31+
filterStore.tags.length ||
32+
filterStore.languages.length ||
3033
filterStore.searchStr.length
3134
);
3235
console.log('isFiltered', isFiltered);

‎js/components/blocks/FilterBlock.js‎

Lines changed: 12 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -17,39 +17,35 @@ const FilterBlock = React.createClass({
1717

1818
mixins: [Reflux.connect(FilterStore, 'filterStore')],
1919

20-
componentDidMount() {
21-
FilterActions.getFilters();
22-
},
23-
24-
filterRepos(filterTitle) {
25-
FilterActions.setFilter(this.props.uname, filterTitle);
20+
filterRepos(filter) {
21+
FilterActions.setFilter(this.props.uname, filter);
2622
},
2723

2824
render() {
2925
const filterStore = this.state.filterStore;
3026
console.log('filterStore', filterStore);
27+
const activeFilter = filterStore ? filterStore.filter : 'all';
3128
//
32-
let filters = 'There are no filters for now!';
33-
if (filterStore && this.props.openUser) {
34-
filters = _.map(filterStore.filters, (filter, index) => {
29+
const filters = ['all', 'owner', 'forks', 'member', 'starred'];
30+
//
31+
let filterBlock = 'There are no filters for now!';
32+
if (filterStore) {
33+
filterBlock = _.map(filters, (filter, index) => {
3534
return (
3635
<span
37-
className={'filter' + (filter.active ? ' active' : '')}
36+
className={'filter' + (filter === activeFilter ? ' active' : '')}
3837
key={'filter' + index}
39-
onClick={() => this.filterRepos(filter.title)}
38+
onClick={() => this.filterRepos(filter)}
4039
>
41-
{filter.title}
40+
{filter}
4241
</span>
4342
);
4443
});
4544
}
46-
else {
47-
filters = '';
48-
}
4945
//
5046
return (
5147
<div className="filters-block">
52-
{filters}
48+
{filterBlock}
5349
</div>
5450
);
5551
}

‎js/components/blocks/LanguagesBlock.js‎

Lines changed: 13 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,9 @@ import { Input, Button, Alert } from 'react-bootstrap';
99
import FontAwesome from 'react-fontawesome';
1010
//
1111
import FilterActions from '../../actions/FilterActions';
12-
import LanguagesActions from '../../actions/LanguagesActions';
1312
//
1413
import ReposStore from '../../stores/ReposStore';
15-
import LanguagesStore from '../../stores/LanguagesStore';
14+
import FilterStore from '../../stores/FilterStore';
1615
//
1716
import Config from '../../config/Config';
1817

@@ -23,35 +22,24 @@ const LanguagesBlock = React.createClass({
2322

2423
mixins: [
2524
Reflux.connect(ReposStore, 'reposStore'),
26-
Reflux.connect(LanguagesStore, 'languagesStore')
25+
Reflux.connect(FilterStore, 'filterStore')
2726
],
2827

2928
filterReposByLanguages(language) {
30-
const languagesStore = this.state.languagesStore;
31-
const activeLanguages = languagesStore.activeLanguages;
32-
const newActiveLanguages = _.xor(activeLanguages, [language]);
33-
//
34-
const reposStore = this.state.reposStore;
35-
const filteredReposIds = _(reposStore.repos)
36-
.filter((repo) => {
37-
return newActiveLanguages.length ? _.includes(newActiveLanguages, repo.language) : true;
38-
})
39-
.pluck('id')
40-
.value();
41-
//
42-
FilterActions.setFilterLanguages(this.props.uname, filteredReposIds);
43-
LanguagesActions.setActiveLanguages(newActiveLanguages);
29+
const filterStore = this.state.filterStore;
30+
const activeLanguages = _.xor(filterStore.languages, [language]);
31+
FilterActions.setLanguages(this.props.uname, activeLanguages);
4432
},
4533

4634
render() {
47-
const languagesStore = this.state.languagesStore;
48-
console.log('languagesStore', languagesStore);
35+
const reposStore = this.state.reposStore;
36+
const filterStore = this.state.filterStore;
4937
//
50-
let languages = null;
51-
if (this.props.openUser && languagesStore && languagesStore.languages.length) {
52-
const sortedLanguages = _.sortBy(languagesStore.languages);
53-
languages = _.map(sortedLanguages, (language) => {
54-
let activeClass = _.includes(languagesStore.activeLanguages, language) ?
38+
let languagesBlock = <p>There are no languages for now!</p>;
39+
if (reposStore && filterStore) {
40+
const sortedLanguages = _.sortBy(reposStore.languages);
41+
languagesBlock = _.map(sortedLanguages, (language) => {
42+
let activeClass = _.includes(filterStore.languages, language) ?
5543
' active' :
5644
'';
5745
//
@@ -66,14 +54,10 @@ const LanguagesBlock = React.createClass({
6654
);
6755
});
6856
}
69-
else if (this.props.openUser && languagesStore &&
70-
!languagesStore.languages.length) {
71-
languages = <p>There are no languages for now!</p>;
72-
}
7357
//
7458
return (
7559
<div className="languages-block">
76-
{languages}
60+
{languagesBlock}
7761
</div>
7862
);
7963
}

‎js/components/blocks/LoginForm.js‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ const LoginForm = React.createClass({
2929
//
3030
return (
3131
<div className="container login-container">
32-
<p className="login-header">
32+
<p className="login-header text-center">
3333
GITHUBIFY.<span className="header-title">me</span>
3434
</p>
3535
<h4 className="login-page-paragraph">
@@ -46,15 +46,6 @@ const LoginForm = React.createClass({
4646
{
4747
!userStore || userStore && !userStore.isLoggedIn ?
4848
<form className="form-horizontal">
49-
{
50-
userStore && userStore.alertType ?
51-
<div className="clearfix">
52-
<Alert bsStyle={userStore.alertType}>
53-
{userStore.alertMessage}
54-
</Alert>
55-
</div> :
56-
null
57-
}
5849
<Button
5950
bsStyle="primary"
6051
className="center-block text-center"

‎js/components/blocks/ReposBlock.js‎

Lines changed: 16 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -136,12 +136,12 @@ const ReposBlock = React.createClass({
136136
render() {
137137
const reposStore = this.state.reposStore;
138138
console.log('reposStore', reposStore);
139-
const tagsStore = this.state.tags;
140139
const reposLength = reposStore ? reposStore.filteredRepos.length : 0;
140+
const tagsStore = this.state.tags;
141141
//
142-
let repos = null;
142+
let reposBlock = null;
143143
if (reposStore && this.props.openUser) {
144-
repos = _.map(reposStore.filteredRepos, (repo, index) => {
144+
reposBlock = _.map(reposStore.filteredRepos, (repo, index) => {
145145
let tags = _.filter(tagsStore, (tag) => {
146146
return _.find(tag.repos, {id: repo.id});
147147
});
@@ -186,7 +186,7 @@ const ReposBlock = React.createClass({
186186
'';
187187
//
188188
return (
189-
<Col xs={6} md={4} key={'repo' + index}>
189+
<Col xs={12} md={4} key={'repo' + index}>
190190
<Thumbnail className="repo">
191191
<Col xs={12}>
192192
<a href={repo.html_url} target="_blank">
@@ -215,21 +215,17 @@ const ReposBlock = React.createClass({
215215
{tagsBlock}
216216
</div>
217217
{ 'github:' + this.props.openUser.id == this.props.uid ?
218-
[
219-
<div className="repo-form" key={'repo-form-' + index}>
220-
<Typeahead
221-
options={options}
222-
ref={typeaheadRef}
223-
maxVisible={5}
224-
onKeyUp={(e) => this.typeaheadKeyUp(e, index, repo.id)}
225-
onOptionSelected={() => this.addRepoTag(index, repo.id)}
226-
onBlur={(e) => this.typeaheadBlur(e, index)}
227-
/>
228-
</div>,
229-
<small className="repo-tags-tip" key={'repo-tags-tip-' + index}>
230-
Type one or several tags (divided by comma)
231-
</small>
232-
] :
218+
<div className="repo-form" key={'repo-form-' + index}>
219+
<Typeahead
220+
options={options}
221+
ref={typeaheadRef}
222+
maxVisible={5}
223+
placeholder="Type comma-separated tags"
224+
onKeyUp={(e) => this.typeaheadKeyUp(e, index, repo.id)}
225+
onOptionSelected={() => this.addRepoTag(index, repo.id)}
226+
onBlur={(e) => this.typeaheadBlur(e, index)}
227+
/>
228+
</div> :
233229
null
234230
}
235231
</Col>
@@ -243,7 +239,7 @@ const ReposBlock = React.createClass({
243239
<div>
244240
<p>{reposLength} repo{reposLength !== 1 ? 's' : ''}</p>
245241
<Row ref="masonryContainer">
246-
{repos}
242+
{reposBlock}
247243
</Row>
248244
</div>
249245
);

0 commit comments

Comments
 (0)