refactor(competitions): remove usage of Vuex ORM for competition model

database/index.ts

@@ -1,5 +1,4 @@
 import { Database } from '@vuex-orm/core';
-import Competition from '~/models/competition.model';
 import CompetitionEdition from '~/models/competition-edition.model';
 import Team from '~/models/team.model';
 import Phase from '~/models/phase.model';
@@ -11,7 +10,6 @@ import Facility from '~/models/facility.model';
 const database = new Database();
 
 // Competition models
-database.register(Competition);
 database.register(CompetitionEdition);
 database.register(Team);
 database.register(Phase);

models/competition-edition.model.ts

@@ -26,8 +26,7 @@ export default class CompetitionEdition extends Model {
       gender: this.string(null).nullable(),
       /** Leverade Season ID */
       season_id: this.string(null),
-      competition_id: this.string(null),
-      competition: this.belongsTo(Competition, 'competition_id'),
+      competition: this.attr(null),
       phases: this.hasMany(Phase, 'competition_edition_id'),
       teams: this.hasMany(Team, 'competition_edition_id'),
     };
@@ -36,11 +35,8 @@ export default class CompetitionEdition extends Model {
   static getLastPhase(competitionSlug: string, seasonLeveradeId: string): Phase {
     const competitionEdition = this.query()
       .where('season_id', seasonLeveradeId)
+      .where('competition', (competition: Competition) => competition.slug === competitionSlug)
       .with('phases', (query) => query.orderBy('order'))
-      .with('competition')
-      .whereHas('competition', (query) => {
-        query.where('slug', competitionSlug);
-      })
       .first();
 
     if (!competitionEdition) {

models/competition.model.ts

@@ -1,20 +1,36 @@
-import { Model } from '@vuex-orm/core';
-import CompetitionEdition from '~/models/competition-edition.model';
+import { PartialItem } from '@directus/sdk';
+import { NationalCompetitionEdition } from '~/plugins/cms-service';
+import { DirectusNationalCompetition, getTranslatedFields } from '~/plugins/directus';
 
-export default class Competition extends Model {
+export default class Competition {
   static entity = 'competitions';
 
-  id!: string;
-  name!: string;
-  slug!: string;
-  editions!: CompetitionEdition[];
-
-  static fields() {
-    return {
-      id: this.string(null),
-      name: this.string(null),
-      slug: this.string(null),
-      editions: this.hasMany(CompetitionEdition, 'competition_id'),
-    };
+  readonly id: number;
+  name: string;
+  slug: string;
+  editions?: NationalCompetitionEdition[];
+
+  constructor(rawCompetition: PartialItem<DirectusNationalCompetition>) {
+    const translatedFields = getTranslatedFields(rawCompetition);
+
+    if (!rawCompetition.id || !translatedFields?.name || !translatedFields?.slug) {
+      throw new Error('Competition is missing requested fields');
+    }
+
+    // Fallback for mandatory fields should not happen as we requested those fields
+
+    this.id = rawCompetition.id;
+    this.name = translatedFields.name;
+    this.slug = translatedFields.slug;
+    this.editions = (rawCompetition.editions as any) || [];
+  }
+
+  get lastEdition() {
+    if (!this.editions || !this.editions.length) {
+      return null;
+    }
+
+    // FIXME: This is a naive selection of the last edition. It might not work, i.e. when adding older editions.
+    return this.editions[this.editions.length - 1];
   }
 }

pages/competitions/_competition/_season.vue

@@ -31,6 +31,7 @@ import { BreadcrumbItem } from '~/components/st-breadcrumb.vue';
 import CompetitionEdition from '~/models/competition-edition.model';
 import Phase from '~/models/phase.model';
 import Season from '~/models/season.model';
+import Competition from '~/models/competition.model';
 
 export default Vue.extend({
   nuxtI18n: {
@@ -96,6 +97,7 @@ export default Vue.extend({
     competitionEdition(): Item<CompetitionEdition> {
       return CompetitionEdition.query()
         .where('season_id', this.season?.leverade_id)
+        .where('competition', (competition: Competition) => competition.slug === this.$route.params.competition)
         .with('phases', (query) => query.orderBy('order'))
         .with('phases.rounds', (query) => query.orderBy('order'))
         .with([
@@ -111,10 +113,6 @@ export default Vue.extend({
           'phases.rounds.matches.home_team',
           'phases.rounds.matches.away_team',
         ])
-        .with('competition')
-        .whereHas('competition', (query) => {
-          query.where('slug', this.$route.params.competition);
-        })
         .first();
     },
     phasesNavigation(): MenuItem[] {

pages/competitions/_competition/index.vue

@@ -1,6 +1,5 @@
 <script lang="ts">
 import Vue from 'vue';
-import Competition from '~/models/competition.model';
 
 export default Vue.extend({
   nuxtI18n: {
@@ -9,17 +8,16 @@ export default Vue.extend({
       de: '/wettbewerbe/:competition',
     },
   },
-  async asyncData({ app, route, redirect }) {
+  async asyncData({ app, route, redirect, store }) {
     const competition = await app.$cmsService.getNationalCompetition(route.params.competition);
-    Competition.insert({ data: competition, insertOrUpdate: ['competition-editions', 'seasons'] });
 
-    if (!competition.editions) {
+    store.commit('competitions/setCompetitions', competition);
+
+    if (!competition.lastEdition) {
       throw new Error('Competition has no editions');
     }
-    // FIXME: This is a naive selection of the last edition. It might not work, i.e. when adding older editions.
-    const lastEdition = competition.editions[competition.editions.length - 1];
 
-    if (typeof lastEdition.season === 'number') {
+    if (typeof competition.lastEdition.season === 'number') {
       throw new TypeError('Season of last edition is not populated');
     }
 
@@ -32,7 +30,7 @@ export default Vue.extend({
         name: 'competitions-competition-season',
         params: {
           competition: route.params.competition,
-          season: lastEdition.season.slug,
+          season: competition.lastEdition.season.slug,
         },
       })
     );

pages/seasons/_season.vue

@@ -51,7 +51,7 @@ export default Vue.extend({
       if (!this.season) {
         return [];
       }
-      return CompetitionEdition.query().with('competition').where('season_id', this.season!.leverade_id).all();
+      return CompetitionEdition.query().where('season_id', this.season!.leverade_id).all();
     },
     competitionEditionsNavigation(): MenuItem[] {
       return this.competitionEditions.map((competitionEdition) => {

plugins/cms-service.ts

@@ -27,6 +27,7 @@ import {
 import { processRawPlayers } from '~/plugins/cms-service/national-teams';
 import { PressRelease } from '~/components/press-releases/press-releases';
 import { toISOLocal } from '~/utils/utils';
+import Competition from '~/models/competition.model';
 
 export interface ResourceType {
   id: number;
@@ -201,7 +202,7 @@ export interface CMSService {
   ) => Promise<Omit<NationalTeamForCompetition, 'competition'>[]>;
   getSeasons: () => Promise<DirectusSeason[]>;
   getLiveStreams: () => Promise<LiveStream[]>;
-  getNationalCompetition: (competitionSlug: string) => Promise<NationalCompetition>;
+  getNationalCompetition: (competitionSlug: string) => Promise<Competition>;
   getNationalCompetitionEditions: ({
     competitionSlug,
     seasonSlug,
@@ -1813,22 +1814,11 @@ const cmsService: Plugin = (context, inject) => {
 
     const rawCompetition = response.data[0];
 
-    if (!rawCompetition || !rawCompetition.id) {
+    if (!rawCompetition) {
       throw new Error('No competition found');
     }
-    const translatedFields = getTranslatedFields(rawCompetition);
 
-    if (!translatedFields?.name || !translatedFields?.slug) {
-      throw new Error('Competition is missing requested fields');
-    }
-
-    // Fallback for mandatory fields should not happen as we requested those fields
-    return {
-      id: rawCompetition.id,
-      name: translatedFields.name,
-      slug: translatedFields.slug,
-      editions: (rawCompetition.editions as any) || [],
-    };
+    return new Competition(rawCompetition);
   };
 
   const getNationalCompetitionEditions: CMSService['getNationalCompetitionEditions'] = async ({

store/competitions/mutations.ts

@@ -0,0 +1,11 @@
+import { MutationTree } from 'vuex/types/index';
+import { CompetitionsState } from './state';
+import Competition from '~/models/competition.model';
+
+const competitionMutations: MutationTree<CompetitionsState> = {
+  setCompetitions(state, competitions: Competition[]) {
+    state.competitions = competitions;
+  },
+};
+
+export default competitionMutations;

store/competitions/state.ts

@@ -0,0 +1,9 @@
+import Competition from '~/models/competition.model';
+
+export interface CompetitionsState {
+  competitions: Competition[];
+}
+
+export default (): CompetitionsState => ({
+  competitions: [],
+});