scnc
/
qiskit.org
mirror of https://github.com/Qiskit/qiskit.org.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Rename location into region, and place into location (#531)

This commit is contained in:
Salvador de la Puente González 2020-04-16 22:27:58 +02:00 committed by GitHub
parent 51fc7f8ffb
commit bec67f5d0e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 141 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/cards/EventCard.vue
View File

@ -18,14 +18,14 @@
<footer>
<div class="event-card__info-detail">
<Map20 class="event-card__icon" />
<span class="event-card__place">{{ place }}</span>
<span class="event-card__location">{{ location }}</span>
</div>
<div class="event-card__date-and-arrow">
<div class="event-card__info-detail">
<Calendar20 class="event-card__icon" />
<span class="event-card__date"><time>{{ date }}</time></span>
</div>
<ArrowRight20 v-if="hasWebsite" class="event-card__icon event-card__icon--purple"/>
<ArrowRight20 v-if="hasWebsite" class="event-card__icon event-card__icon--purple" />
</div>
</footer>
</div>
@ -47,7 +47,7 @@ export default class extends Vue {
@Prop(String) type
@Prop(String) title
@Prop(String) image
@Prop(String) place
@Prop(String) location
@Prop(String) date
@Prop(String) to
@ -88,11 +88,11 @@ export default class extends Vue {
@include type-style('productive-heading-02');
}
&__place, &__date {
&__location, &__date {
@include type-style('body-short-01');
}
&__place, &__date {
&__location, &__date {
padding-left: 0.31rem;
}

20
content/events/past-community-events.json
View File

@ -5,8 +5,8 @@
"Online"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/a91433373aa5040bbcbdacc2c3d1324c/d4820c12",
"place": "Online",
"location": "Online",
"region": "Online",
"date": "April 15, 2020"
},
{
@ -15,8 +15,8 @@
"Online"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/bbbfcbac2f2fbae91d75b2f90e6b5589/613c7759",
"place": "Online",
"location": "Online",
"region": "Online",
"date": "April 8, 2020"
},
{
@ -25,8 +25,8 @@
"Online"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/042cae53b96f33b9d122f516aa6187da/eb5fb425",
"place": "Online",
"location": "Online",
"region": "Online",
"date": "April 1, 2020",
"to": "https://www.youtube.com/watch?v=_1XTChcvbOs"
},
@ -36,8 +36,8 @@
"Talks"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/f2f06eca861764c80f3b0f9e34a136da/fca521b3",
"place": "Boston, MA",
"location": "Americas",
"location": "Boston, MA",
"region": "Americas",
"date": "March 26, 2020"
},
{
@ -46,8 +46,8 @@
"Online"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/7a81262ae0e59634990efb461f4baffa/38a7b065",
"place": "Online",
"location": "Online",
"region": "Online",
"date": "March 25, 2020",
"to": "https://www.youtube.com/watch?v=khlr15i123Q"
},
@ -57,8 +57,8 @@
"Talks"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/11b1ef339b83fad7999ccc446123d008/32aa4f34",
"place": "Boston, MA",
"location": "Americas",
"location": "Boston, MA",
"region": "Americas",
"date": "March 24, 2020"
},
{
@ -67,8 +67,8 @@
"Talks"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/9cfcf2ff507fb4fc6c7f897d794e3f1a/a26fb26b",
"place": "Pennsylvania",
"location": "Americas",
"location": "Pennsylvania",
"region": "Americas",
"date": "March 18, 2020"
}
]

2
content/events/upcoming-community-events.json
View File

@ -5,8 +5,8 @@
"Online"
],
"image": "https://dl.airtable.com/.attachmentThumbnails/c32682d762a93287ba21024fa406ca5e/25b55ec1",
"place": "Online",
"location": "Online",
"region": "Online",
"date": "April 17, 2020"
}
]

25
hooks/event-conversion-utils.ts
View File

@ -4,9 +4,10 @@ import Airtable from 'airtable'
import {
CommunityEvent,
CommunityEventType,
WorldLocation,
WorldRegion,
COMMUNITY_EVENT_TYPES,
COMMUNITY_EVENT_TYPE_OPTIONS
COMMUNITY_EVENT_TYPE_OPTIONS,
WORLD_REGIONS
} from '../store/modules/events'
const RECORD_FIELDS = Object.freeze({
@ -15,7 +16,7 @@ const RECORD_FIELDS = Object.freeze({
endDate: 'End Date',
typeOfEvent: 'Type of Event',
eventWebsite: 'Event Website',
eventLocation: 'Event Location',
location: 'Event Location',
region: 'Region',
image: 'Picture?',
published: 'SUZIE - for website?'
@ -48,8 +49,8 @@ function convertToCommunityEvent (record: any): CommunityEvent {
title: getName(record),
types: getTypes(record),
image: getImage(record),
place: getPlace(record),
location: getLocation(record),
region: getRegion(record),
date: formatDates(...getDates(record)),
to: getWebsite(record)
}
@ -69,9 +70,9 @@ function getTypes (record: any): CommunityEventType[] {
//
// See also:
// https://github.com/Qiskit/qiskit.org/issues/526
const location = getLocation(record)
if (location) {
valueList.push(location)
const region = getRegion(record)
if (region) {
valueList.push(region)
}
const communityEventTypes = filterWithWhitelist(valueList, COMMUNITY_EVENT_TYPE_OPTIONS)
@ -111,12 +112,12 @@ function getThumbnailUrl (imageAttachment: any): string|null {
return largeThumbnail ? largeThumbnail.url : null
}
function getPlace (record: any): string|null {
return record.get(RECORD_FIELDS.eventLocation) || getLocation(record)
function getLocation (record: any): string {
return record.get(RECORD_FIELDS.location) || getRegion(record)
}
function getLocation (record: any): WorldLocation|null {
return record.get(RECORD_FIELDS.region) || null
function getRegion (record: any): WorldRegion {
return record.get(RECORD_FIELDS.region) || WORLD_REGIONS.tbd
}
function getDates (record: any): [Date, Date|undefined] {
@ -167,8 +168,8 @@ export {
getName,
getTypes,
getImage,
getPlace,
getLocation,
getRegion,
getWebsite,
getDates,
formatDates,

30
pages/events/index.vue
View File

@ -32,17 +32,17 @@
<div class="event-page__filters-checkboxes">
<fieldset class="bx--fieldset">
<legend class="bx--label">
Location
Region
</legend>
<client-only>
<cv-checkbox
v-for="location in locations"
:key="location"
:value="location"
:label="location"
:checked="isFilterChecked('locationFilters', location)"
:aria-checked="`${isFilterChecked('locationFilters', location)}`"
@change="updateFilter('locationFilters', location, $event)"
v-for="region in regions"
:key="region"
:value="region"
:label="region"
:checked="isFilterChecked('regionFilters', region)"
:aria-checked="`${isFilterChecked('regionFilters', region)}`"
@change="updateFilter('regionFilters', region, $event)"
/>
</client-only>
</fieldset>
@ -70,7 +70,7 @@
:type="formatType(event.types)"
:title="event.title"
:image="event.image"
:place="event.place"
:location="event.location"
:date="event.date"
:to="event.to"
/>
@ -92,7 +92,7 @@ import QiskitPage from '~/components/qiskit/QiskitPage.vue'
import EventCard from '~/components/cards/EventCard.vue'
import {
CommunityEvent,
WORLD_LOCATION_OPTIONS,
WORLD_REGION_OPTIONS,
COMMUNITY_EVENT_TYPE_OPTIONS
} from '~/store/modules/events.ts'
@ -113,7 +113,7 @@ import {
...mapGetters([
'filteredEvents',
'typeFilters',
'locationFilters'
'regionFilters'
])
},
@ -135,7 +135,7 @@ import {
})
export default class extends QiskitPage {
locations = WORLD_LOCATION_OPTIONS
regions = WORLD_REGION_OPTIONS
types = COMMUNITY_EVENT_TYPE_OPTIONS
routeName: string = 'events'
windowWidth: Number = 0
@ -169,10 +169,10 @@ export default class extends QiskitPage {
isFilterChecked (filter: string, filterValue: string): Array<CommunityEvent> {
const typeFilters = (this as any).typeFilters
const locationFilters = (this as any).locationFilters
const regionFilters = (this as any).regionFilters
return filter === 'locationFilters'
? locationFilters.includes(filterValue)
return filter === 'regionFilters'
? regionFilters.includes(filterValue)
: typeFilters.includes(filterValue)
}

44
store/modules/events.ts
View File

@ -8,7 +8,7 @@ const COMMUNITY_EVENT_TYPES = Object.freeze({
online: 'Online'
} as const)
const WORLD_LOCATIONS = Object.freeze({
const WORLD_REGIONS = Object.freeze({
americas: 'Americas',
asiaPacific: 'Asia Pacific',
europe: 'Europe',
@ -19,11 +19,12 @@ const WORLD_LOCATIONS = Object.freeze({
//
// See also:
// https://github.com/Qiskit/qiskit.org/issues/526
online: 'Online'
online: 'Online',
tbd: 'TBD'
} as const)
type CommunityEventSet = 'past'|'upcoming'
type WorldLocation = typeof WORLD_LOCATIONS[keyof typeof WORLD_LOCATIONS]
type WorldRegion = typeof WORLD_REGIONS[keyof typeof WORLD_REGIONS]
type CommunityEventType = typeof COMMUNITY_EVENT_TYPES[keyof typeof COMMUNITY_EVENT_TYPES]
type CommunityEvent = {
@ -31,22 +32,22 @@ type CommunityEvent = {
title: string,
image: string,
// TODO: We need to clarify if region and place have default values and what
// these are. Place and location may seem mandatory but human error is
// possible. In that case, what's the value of place and location?
// these are. Place and region may seem mandatory but human error is
// possible. In that case, what's the value of place and region?
//
// See also:
// https://github.com/Qiskit/qiskit.org/issues/527
place: string|null,
location: WorldLocation|null,
location: string,
region: WorldRegion,
date: string,
to: string
}
const WORLD_LOCATION_OPTIONS = Object.freeze([
WORLD_LOCATIONS.americas,
WORLD_LOCATIONS.asiaPacific,
WORLD_LOCATIONS.europe,
WORLD_LOCATIONS.africa
const WORLD_REGION_OPTIONS = Object.freeze([
WORLD_REGIONS.americas,
WORLD_REGIONS.asiaPacific,
WORLD_REGIONS.europe,
WORLD_REGIONS.africa
])
const COMMUNITY_EVENT_TYPE_OPTIONS = Object.freeze([
COMMUNITY_EVENT_TYPES.hackathon,
@ -61,9 +62,10 @@ const COMMUNITY_EVENT_TYPE_OPTIONS = Object.freeze([
export {
CommunityEvent,
CommunityEventType,
WorldLocation,
WorldRegion,
COMMUNITY_EVENT_TYPES,
WORLD_LOCATION_OPTIONS,
WORLD_REGIONS,
WORLD_REGION_OPTIONS,
COMMUNITY_EVENT_TYPE_OPTIONS
}
@ -74,15 +76,15 @@ export default {
upcomingCommunityEvents: [],
pastCommunityEvents: [],
typeFilters: [],
locationFilters: []
regionFilters: []
}
},
getters: {
typeFilters (state) {
return state.typeFilters
},
locationFilters (state) {
return state.locationFilters
regionFilters (state) {
return state.regionFilters
},
filteredEvents (state) {
const {
@ -90,18 +92,18 @@ export default {
upcomingCommunityEvents,
pastCommunityEvents,
typeFilters,
locationFilters
regionFilters
} = state
const showUpcomingEvents = activeSet === 'upcoming'
const events = showUpcomingEvents ? upcomingCommunityEvents : pastCommunityEvents
const noTypeFilters = typeFilters.length === 0
const noLocationFilters = locationFilters.length === 0
const noRegionFilters = regionFilters.length === 0
if (noTypeFilters && noLocationFilters) { return events }
if (noTypeFilters && noRegionFilters) { return events }
const eventsAfterApplyTypeFilter = filterBy(events, typeFilters, 'types')
return filterBy(eventsAfterApplyTypeFilter, locationFilters, 'location')
return filterBy(eventsAfterApplyTypeFilter, regionFilters, 'region')
function filterBy (allEvents: CommunityEvent[], selectedFilters: string[], propToFilter: keyof CommunityEvent) {
const noFilters = selectedFilters.length === 0

71
tests/hooks/event-conversion-utils.spec.ts
View File

@ -4,17 +4,20 @@ import {
filterWithWhitelist,
convertToCommunityEvent,
getTypes,
getLocation,
getRegion,
getDates,
getImage
} from '~/hooks/event-conversion-utils'
import { COMMUNITY_EVENT_TYPES } from '~/store/modules/events'
import { COMMUNITY_EVENT_TYPES, WORLD_REGIONS } from '~/store/modules/events'
type RecordFields = {
name: string,
picture?: object[],
types?: string[]|string,
location?: string,
region?: string,
startDate?: string,
endDate?: string,
website?: string
@ -23,12 +26,13 @@ type RecordFields = {
class FakeRecord {
_fields: object = {}
constructor ({ name, picture, types, location, startDate, endDate, website }: RecordFields) {
constructor ({ name, picture, types, location, region, startDate, endDate, website }: RecordFields) {
this._fields = {
[RECORD_FIELDS.name]: name,
[RECORD_FIELDS.image]: picture,
[RECORD_FIELDS.typeOfEvent]: types,
[RECORD_FIELDS.eventLocation]: location,
[RECORD_FIELDS.location]: location,
[RECORD_FIELDS.region]: region,
[RECORD_FIELDS.startDate]: startDate,
[RECORD_FIELDS.endDate]: endDate,
[RECORD_FIELDS.eventWebsite]: website
@ -46,6 +50,7 @@ describe('convertToCommunityEvent', () => {
name: 'Fake conference',
types: [hackathon],
location: 'Someplace',
region: 'Americas',
startDate: '2020-01-01',
endDate: '2020-01-02',
website: 'https://qiskit.org/events'
@ -53,11 +58,12 @@ describe('convertToCommunityEvent', () => {
it('extracts and format information from the record', () => {
const { hackathon } = COMMUNITY_EVENT_TYPES
const { title, types, place, date, to } = convertToCommunityEvent(fakeRecord)
expect({ title, types, place, date, to }).toEqual({
const { title, types, location, region, date, to } = convertToCommunityEvent(fakeRecord)
expect({ title, types, location, region, date, to }).toEqual({
title: 'Fake conference',
types: [hackathon],
place: 'Someplace',
location: 'Someplace',
region: 'Americas',
date: 'January 1-2, 2020',
to: 'https://qiskit.org/events'
})
@ -108,6 +114,59 @@ describe('filterByWhitelist', () => {
})
})
describe('getRegion', () => {
it('defaults in TBD if there is no region', () => {
const { tbd } = WORLD_REGIONS
const noRegionEvent = new FakeRecord({
name: 'Fake Conference'
})
expect(getRegion(noRegionEvent)).toBe(tbd)
})
it('gets the region from the record', () => {
const { americas } = WORLD_REGIONS
const fakeEvent = new FakeRecord({
name: 'Fake Conference',
region: americas
})
expect(getRegion(fakeEvent)).toBe(americas)
})
it('gets the region from the record even if it is not recognized by qiskit', () => {
const unknownRegionEvent = new FakeRecord({
name: 'Fake Conference',
region: 'Lemuria'
})
expect(getRegion(unknownRegionEvent)).toBe('Lemuria')
})
})
describe('getLocation', () => {
it('defaults in TBD if there is no location, no region', () => {
const nowhereEvent = new FakeRecord({
name: 'Nowhere Conference'
})
expect(getLocation(nowhereEvent)).toBe('TBD')
})
it('defaults in region if there is no location', () => {
const { americas } = WORLD_REGIONS
const noLocationEvent = new FakeRecord({
name: 'Fake Conference',
region: americas
})
expect(getLocation(noLocationEvent)).toBe(getRegion(noLocationEvent))
})
it('gets the location from the record', () => {
const fakeEvent = new FakeRecord({
name: 'Fake Conference',
location: 'Gotham'
})
expect(getLocation(fakeEvent)).toBe('Gotham')
})
})
describe('getImage', () => {
it('defaults in a no-picture.jpg value if there is no attachment', () => {
const noPictureEvent = new FakeRecord({

18
tests/store/events.spec.ts
View File

@ -6,27 +6,27 @@ describe('module events', () => {
const unconferenceCampInAsia = {
title: 'Fake event A',
types: ['Unconference', 'Camp'],
location: 'Asia Pacific'
region: 'Asia Pacific'
}
const hackathonInEurope = {
title: 'Fake event B',
types: ['Unconference', 'Hackathon'],
location: 'Europe'
region: 'Europe'
}
const campInAfrica = {
title: 'Fake event C',
types: ['Camp'],
location: 'Africa'
region: 'Africa'
}
const hackathonInAmericas = {
title: 'Fake event D',
types: ['Camp', 'Hackathon'],
location: 'Americas'
region: 'Americas'
}
const unconferenceOnline = {
title: 'Fake event E',
types: ['Unconference'],
location: 'Online'
region: 'Online'
}
const futureEvents = [unconferenceCampInAsia, hackathonInEurope, campInAfrica]
@ -54,9 +54,9 @@ describe('module events', () => {
expect(store.getters.filteredEvents).toEqual(pastEvents)
})
it('gets active-set filtered by location', () => {
it('gets active-set filtered by region', () => {
store.commit('addFilter', {
filter: 'locationFilters',
filter: 'regionFilters',
filterValue: 'Asia Pacific'
})
expect(store.getters.filteredEvents).toEqual([unconferenceCampInAsia])
@ -78,13 +78,13 @@ describe('module events', () => {
expect(store.getters.filteredEvents).toEqual([unconferenceCampInAsia, campInAfrica])
})
it('gets active-set filtered by type and location', () => {
it('gets active-set filtered by type and region', () => {
store.commit('addFilter', {
filter: 'typeFilters',
filterValue: 'Camp'
})
store.commit('addFilter', {
filter: 'locationFilters',
filter: 'regionFilters',
filterValue: 'Africa'
})
expect(store.getters.filteredEvents).toEqual([campInAfrica])