hamlab/mobilizon-frontend
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Fix lint issues

Browse Source 
And disable eslint when building in prod mode

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2020-11-30 10:24:11 +01:00
parent da42522073
commit 2d541f2e32
161 changed files with 3869 additions and 1236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
js/src/views/Home.vue
View File

@@ -1,11 +1,20 @@
<template>
<div id="homepage">
<section class="hero" v-if="config && (!currentUser.id || !currentActor.id)">
<section
class="hero"
v-if="config && (!currentUser.id || !currentActor.id)"
>
<div class="hero-body">
<div class="container">
<h1 class="title">{{ config.slogan || $t("Gather ⋅ Organize ⋅ Mobilize") }}</h1>
<h1 class="title">
{{ config.slogan || $t("Gather ⋅ Organize ⋅ Mobilize") }}
</h1>
<p
v-html="$t('Join <b>{instance}</b>, a Mobilizon instance', { instance: config.name })"
v-html="
$t('Join <b>{instance}</b>, a Mobilizon instance', {
instance: config.name,
})
"
/>
<p class="instance-description">{{ config.description }}</p>
<!-- We don't invite to find other instances yet -->
@@ -25,7 +34,11 @@
>
<!-- We don't invite to find other instances yet -->
<!-- <b-button v-else type="is-link" tag="a" href="https://joinmastodon.org">{{ $t('Find an instance') }}</b-button> -->
<b-button type="is-text" tag="router-link" :to="{ name: RouteName.ABOUT }">
<b-button
type="is-text"
tag="router-link"
:to="{ name: RouteName.ABOUT }"
>
{{ $t("Learn more about {instance}", { instance: config.name }) }}
</b-button>
</div>
@@ -40,7 +53,10 @@
<section class="events-featured">
<h2 class="title">{{ $t("Featured events") }}</h2>
<b-loading :active.sync="$apollo.loading" />
<div v-if="filteredFeaturedEvents.length > 0" class="columns is-multiline">
<div
v-if="filteredFeaturedEvents.length > 0"
class="columns is-multiline"
>
<div
class="column is-one-third-desktop"
v-for="event in filteredFeaturedEvents.slice(0, 6)"
@@ -49,12 +65,17 @@
<EventCard :event="event" />
</div>
</div>
<b-message v-else type="is-danger">{{ $t("No events found") }}</b-message>
<b-message v-else type="is-danger">{{
$t("No events found")
}}</b-message>
</section>
</div>
<div id="picture" v-if="config && (!currentUser.id || !currentActor.id)">
<div class="picture-container">
<img src="/img/pics/2020-10-06-mobilizon-illustration-A_homepage.jpg" alt="" />
<img
src="/img/pics/2020-10-06-mobilizon-illustration-A_homepage.jpg"
alt=""
/>
</div>
<div class="container section">
<div class="columns">
@@ -62,7 +83,9 @@
<h3 class="title">{{ $t("A practical tool") }}</h3>
<p
v-html="
$t('Mobilizon is a tool that helps you <b>find, create and organise events</b>.')
$t(
'Mobilizon is a tool that helps you <b>find, create and organise events</b>.'
)
"
/>
</div>
@@ -88,32 +111,51 @@
</div>
</div>
<div class="buttons">
<a class="button is-primary is-large" href="https://joinmobilizon.org">{{
$t("Learn more about Mobilizon")
}}</a>
<a
class="button is-primary is-large"
href="https://joinmobilizon.org"
>{{ $t("Learn more about Mobilizon") }}</a
>
</div>
</div>
</div>
<div class="container section" v-if="config && loggedUser && loggedUser.settings">
<div
class="container section"
v-if="config && loggedUser && loggedUser.settings"
>
<section v-if="currentActor.id">
<b-message type="is-info" v-if="welcomeBack">{{
$t("Welcome back {username}!", { username: currentActor.displayName() })
$t("Welcome back {username}!", {
username: currentActor.displayName(),
})
}}</b-message>
<b-message type="is-info" v-if="newRegisteredUser">{{
$t("Welcome to Mobilizon, {username}!", { username: currentActor.displayName() })
$t("Welcome to Mobilizon, {username}!", {
username: currentActor.displayName(),
})
}}</b-message>
</section>
<section v-if="currentActor.id && goingToEvents.size > 0" class="container">
<section
v-if="currentActor.id && goingToEvents.size > 0"
class="container"
>
<h3 class="title">{{ $t("Upcoming") }}</h3>
<b-loading :active.sync="$apollo.loading" />
<div v-for="row of goingToEvents" class="upcoming-events" :key="row[0]">
<span class="date-component-container" v-if="isInLessThanSevenDays(row[0])">
<span
class="date-component-container"
v-if="isInLessThanSevenDays(row[0])"
>
<date-component :date="row[0]" />
<subtitle v-if="isToday(row[0])">{{
$tc("You have one event today.", row[1].length, { count: row[1].length })
$tc("You have one event today.", row[1].length, {
count: row[1].length,
})
}}</subtitle>
<subtitle v-else-if="isTomorrow(row[0])">{{
$tc("You have one event tomorrow.", row[1].length, { count: row[1].length })
$tc("You have one event tomorrow.", row[1].length, {
count: row[1].length,
})
}}</subtitle>
<subtitle v-else-if="isInLessThanSevenDays(row[0])">
{{
@@ -155,7 +197,10 @@
<section class="events-featured">
<h2 class="title">{{ $t("Featured events") }}</h2>
<b-loading :active.sync="$apollo.loading" />
<div v-if="filteredFeaturedEvents.length > 0" class="columns is-multiline">
<div
v-if="filteredFeaturedEvents.length > 0"
class="columns is-multiline"
>
<div
class="column is-one-third-desktop"
v-for="event in filteredFeaturedEvents.slice(0, 6)"
@@ -164,7 +209,9 @@
<EventCard :event="event" />
</div>
</div>
<b-message v-else type="is-danger">{{ $t("No events found") }}</b-message>
<b-message v-else type="is-danger">{{
$t("No events found")
}}</b-message>
</section>
</div>
</div>
@@ -177,7 +224,10 @@ import { IParticipant, Participant } from "../types/participant.model";
import { FETCH_EVENTS } from "../graphql/event";
import EventListCard from "../components/Event/EventListCard.vue";
import EventCard from "../components/Event/EventCard.vue";
import { CURRENT_ACTOR_CLIENT, LOGGED_USER_PARTICIPATIONS } from "../graphql/actor";
import {
CURRENT_ACTOR_CLIENT,
LOGGED_USER_PARTICIPATIONS,
} from "../graphql/actor";
import { IPerson, Person } from "../types/actor";
import { ICurrentUser, IUser } from "../types/current-user.model";
import { CURRENT_USER_CLIENT, USER_SETTINGS } from "../graphql/user";
@@ -286,7 +336,9 @@ export default class Home extends Vue {
return window.localStorage.getItem("new-registered-user") === "yes";
}
thisWeek(row: [string, Map<string, IParticipant>]): Map<string, IParticipant> {
thisWeek(
row: [string, Map<string, IParticipant>]
): Map<string, IParticipant> {
if (this.isInLessThanSevenDays(row[0])) {
return row[1];
}
@@ -330,7 +382,9 @@ export default class Home extends Vue {
// eslint-disable-next-line class-methods-use-this
calculateDiffDays(date: string): number {
return Math.ceil((new Date(date).getTime() - new Date().getTime()) / 1000 / 60 / 60 / 24);
return Math.ceil(
(new Date(date).getTime() - new Date().getTime()) / 1000 / 60 / 60 / 24
);
}
get goingToEvents(): Map<string, Map<string, IParticipant>> {
@@ -342,14 +396,22 @@ export default class Home extends Vue {
role !== ParticipantRole.REJECTED
);
res.sort(
(a: IParticipant, b: IParticipant) => a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
(a: IParticipant, b: IParticipant) =>
a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
);
return res.reduce(
(acc: Map<string, Map<string, IParticipant>>, participation: IParticipant) => {
(
acc: Map<string, Map<string, IParticipant>>,
participation: IParticipant
) => {
const day = new Date(participation.event.beginsOn).toDateString();
const participations: Map<string, IParticipant> = acc.get(day) || new Map();
participations.set(`${participation.event.uuid}${participation.actor.id}`, participation);
const participations: Map<string, IParticipant> =
acc.get(day) || new Map();
participations.set(
`${participation.event.uuid}${participation.actor.id}`,
participation
);
acc.set(day, participations);
return acc;
},
@@ -365,7 +427,8 @@ export default class Home extends Vue {
role !== ParticipantRole.REJECTED
);
res.sort(
(a: IParticipant, b: IParticipant) => a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
(a: IParticipant, b: IParticipant) =>
a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
);
return res;
}
@@ -377,7 +440,9 @@ export default class Home extends Vue {
return this.events.filter(
({ id }) =>
!this.currentUserParticipations
.filter((participation) => participation.role === ParticipantRole.CREATOR)
.filter(
(participation) => participation.role === ParticipantRole.CREATOR
)
.map(({ event: { id: eventId } }) => eventId)
.includes(id)
);
@@ -396,7 +461,10 @@ export default class Home extends Vue {
@Watch("loggedUser")
detectEmptyUserSettings(loggedUser: IUser): void {
if (loggedUser && loggedUser.id && loggedUser.settings === null) {
this.$router.push({ name: RouteName.WELCOME_SCREEN, params: { step: "1" } });
this.$router.push({
name: RouteName.WELCOME_SCREEN,
params: { step: "1" },
});
}
}
}