fetch musicians - from_location parameter

when fetching musicians records for the first time if there is no
results been received then fetch again by turning on from_location
filter option
This commit is contained in:
Nuwan 2022-01-13 18:24:01 +05:30
parent 7f4947a590
commit 87278e6adb
5 changed files with 117 additions and 10 deletions

View File

@ -42,18 +42,86 @@ const closeSidePanel = () => {
cy.get('[data-testid=profileSidePanel] .modal-header button.close').click();
};
describe('Friends page without data', () => {
describe.only('Friends page without data', () => {
beforeEach(() => {
cy.stubAuthenticate();
cy.intercept('POST', /\S+\/filter/, {
musicians: []
});
}).as("getPeople_empty");
});
it('shows no records alert', () => {
it('from_location is unchecked', () => {
cy.visit('/friends');
//default api call with from_location parameter turned off
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '1st API call');
})
.its('request.body')
.should('deep.contain', {
from_location: false
});
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '2nd API call - (prefetched)');
})
.its('request.body')
.should('deep.contain', {
from_location: false
});
//now it automatically turns on from_location parameter and fetches again
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '3rd API call');
})
.its('request.body')
.should('deep.contain', {
from_location: true
});
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '4th API call - (prefetched)');
})
.its('request.body')
.should('deep.contain', {
from_location: true
});
cy.contains('No Records!');
cy.get('[data-testid=btnUpdateSearch]').click();
cy.get('[data-testid=modalUpdateSearch] input[name=from_location]').check();
cy.wait(1000);
cy.get('[data-testid=btnSubmitSearch]').click();
//default api call with from_location parameter turned on
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '5th API call');
})
.its('request.body')
.should('deep.contain', {
from_location: true
});
cy.wait('@getPeople_empty')
.then(interception => {
assert.isNotNull(interception.response.body, '6th API call - (prefetched)');
})
.its('request.body')
.should('deep.contain', {
from_location: true
});
cy.contains('No Records!');
});
});
describe('Friends page with data', () => {
@ -84,7 +152,7 @@ describe('Friends page with data', () => {
.contains('Test User1');
});
it.only('click profile name', () => {
it('click profile name', () => {
//open side panel by clicking name
cy.get('[data-testid=peopleListTable]').within(() => {
cy.contains('Test User1').click();
@ -408,6 +476,7 @@ describe('Friends page with data', () => {
cy.get('[data-testid=modalUpdateSearch] input[name=proficiency_intermediate]').uncheck();
cy.get('[data-testid=modalUpdateSearch] input[name=proficiency_expert]').uncheck();
cy.get('[data-testid=modalUpdateSearch] input[name=proficiency_expert]').uncheck();
cy.get('[data-testid=modalUpdateSearch] input[name=from_location]').uncheck();
cy.get('#selInstruments')
.type('Drums{enter}')
.click();
@ -446,6 +515,8 @@ describe('Friends page with data', () => {
.should('not.be.checked')
.next()
.contains('Poor (more than 60ms)');
cy.get('input[name=from_location]')
.should('not.be.checked')
});
});
@ -493,7 +564,8 @@ describe('Friends page with data', () => {
proficiency_intermediate: true,
proficiency_expert: true,
instruments: [],
genres: []
genres: [],
from_location: false
});
cy.wait('@getPeople_page2').then(interception => {
@ -518,12 +590,14 @@ describe('Friends page with data', () => {
proficiency_intermediate: false,
proficiency_expert: false,
instruments: [{ value: 'drums', label: 'Drums' }],
genres: ['pop']
genres: ['pop'],
from_location: false
});
cy.wait('@getPeople_page2').then(interception => {
assert.isNotNull(interception.response.body, '6th API call has data - (prefethed)');
});
});
});
});

View File

@ -6,8 +6,11 @@ const JKTooltip = props => {
const iconRef = useRef();
const toggle = () => setTooltipOpen(!tooltipOpen);
function handleClick(e) {
e.preventDefault();
}
return (
<a href="javascript: void(0);">
<a href="#!" onClick={handleClick}>
<img
alt="help"
ref={iconRef}

View File

@ -34,7 +34,7 @@ function JKPeopleFilter() {
const totalPages = useSelector(state => state.people.totalPages);
const loadingStatus = useSelector(state => state.people.status);
const { register, handleSubmit, setValue, control } = useForm({
const { register, handleSubmit, setValue, getValues, control } = useForm({
defaultValues: {
latency_good: true,
latency_fair: true,
@ -45,7 +45,8 @@ function JKPeopleFilter() {
instruments: [],
genres: [],
joined_within_days: '-1',
active_within_days: '-1'
active_within_days: '-1',
from_location: false,
}
});
@ -126,6 +127,7 @@ function JKPeopleFilter() {
setValue('genres', null);
setValue('joined_within_days', -1);
setValue('active_within_days', -1);
setValue('from_location', false);
};
const submitPageQuery = () => {
@ -199,6 +201,16 @@ function JKPeopleFilter() {
}
}, [resetFilter]);
useEffect(() => {
if(loadingStatus === 'succeeded' && people.length === 0 && currentPage.current === 1 && !getValues("from_location")){
//no results found. let's fetch again with from_location enabled
setValue('from_location', true);
nextPage.current = 1
currentPage.current = 1
submitPageQuery()
}
}, [loadingStatus])
return (
<Card>
<FalconCardHeader title={t('page_title', { ns: 'people' })} titleClass="font-weight-bold">
@ -368,6 +380,19 @@ function JKPeopleFilter() {
render={({ field }) => <Select {...field} options={joinedOpts} id="selJoinedWithin" />}
/>
</div>
<label className="form-label" htmlFor="from_location">
Search by My Location{' '}
</label>
<div className="form-check">
<input
{...register('from_location')}
type="checkbox"
className="form-check-input"
onChange={e => setValue('from_location', e.target.checked)}
/>
</div>
</div>
</div>
</form>

View File

@ -20,6 +20,7 @@ export const fetchPeople = createAsyncThunk(
export const preFetchPeople = createAsyncThunk(
'people/preFetchPeople',
async (options, thunkAPI) => {
const response = await getPeople(options)
return response.json()
}
@ -78,6 +79,7 @@ export const peopleSlice = createSlice({
state.status = 'loading'
})
.addCase(fetchPeople.fulfilled, (state, action) => {
//console.log("DEBUG: action.meta.arg", action.meta.arg);
const records = new Set([...state.people, ...action.payload.musicians]);
const unique = [];
records.map(x => unique.filter(a => a.id === x.id).length > 0 ? null : unique.push(x))

View File

@ -127,9 +127,12 @@ class ApiSearchController < ApiController
"ages"=>[],
"skill_level"=>"-1",
"joined_within_days"=>"-1",
"active_within_days"=>"-1"
"active_within_days"=>"-1",
"from_location" => "0",
}
filter_params.merge!(from_location: params[:from_location] ? '1' : '0')
filter_params.merge!(genres: params[:genres]) unless params[:genres].blank?
beginner = ActiveRecord::Type::Boolean.new.type_cast_from_user(params[:proficiency_beginner])