Use graphql to retrieve parties

src/app/euromat/components/emphasis.vue

@@ -38,7 +38,7 @@
 
 <script>
   import { getTranslatedUrl } from '@/i18n/helper'
-  import { apolloTheses } from '@/app/euromat/helper'
+  import { apolloTheses } from '@/app/euromat/graphqlQueries'
 
   export default {
     name: 'Emphasis',

src/app/euromat/components/results.vue

@@ -36,27 +36,9 @@
           />
         </router-link>
 
-        <div v-if="party.nationalParty" class="party-results-national">
+        <div class="party-results-national">
-          <feather-corner-down-right />
           <span>
-            {{ $t('results.nationalParty') }}
+            {{ person.name }}
-            <a
-              class="party-results-national-logo"
-              :href="party.nationalParty.program"
-              target="_blank"
-              rel="noopener"
-            >
-              <div v-if="hasPartyLogo(party.nationalParty.token)">
-                <img
-                  :src="getPartyLogo(party.nationalParty.token)"
-                  :alt="party.nationalParty.name"
-                  :title="party.nationalParty.name"
-                  width="40"
-                  height="40"
-                >
-              </div>
-              <span v-else>{{ party.nationalParty.token }}</span>
-            </a>
           </span>
         </div>
       </li>
@@ -79,28 +61,13 @@
         <feather-rotate-cw />
       </router-link>
     </div>
-
-    <div class="results-affiliation">
-      <a
-        href="https://www.talkingeurope.com/"
-        target="_blank"
-        rel="noopener"
-      >
-        <img
-          :src="talkingEuropeBanner"
-          title="Talking Europe"
-          alt="Talking Europe Banner"
-        >
-      </a>
-    </div>
   </section>
 </template>
 
 <script>
-  import { IPDATA_URL } from '@/config/api'
+  import { getTranslatedUrl } from '@/i18n/helper'
-  import { getTranslatedUrl, getUserLanguage } from '@/i18n/helper'
   import { getPartiesWithScores, getTotalMaxPoints } from '@/app/euromat/scoring'
-  import { parties } from '@/data'
+  import { apolloPersonsForResults, parseApolloPersonForResults } from '@/app/euromat/graphqlQueries'
 
   export default {
     name: 'Results',
@@ -109,15 +76,13 @@
       'feather-zoom-in': () =>
         import('vue-feather-icons/icons/ZoomInIcon' /* webpackChunkName: "icons" */),
       'feather-rotate-cw': () =>
-        import('vue-feather-icons/icons/RotateCwIcon' /* webpackChunkName: "icons" */),
+        import('vue-feather-icons/icons/RotateCwIcon' /* webpackChunkName: "icons" */)
-      'feather-corner-down-right': () =>
-        import('vue-feather-icons/icons/CornerDownRightIcon' /* webpackChunkName: "icons" */)
     },
 
     data () {
       return {
-        userCountry: getUserLanguage().country,
         scoringGrid: [],
+        scores: [],
         parties: [],
         totalMaxPoints: 0
       }
@@ -132,14 +97,6 @@
           this.$route.query.embedded &&
           this.$route.query.embedded === 'iframe'
         )
-      },
-      talkingEuropeBanner () {
-        try {
-          return require(`@/assets/talkingeurope/talkingeurope-${this.$i18n.locale}.png`)
-        } catch (e) {
-          console.warn('TalkingEurope image not found, defaulting to "en". ', e)
-          return require(`@/assets/talkingeurope/talkingeurope-en.png`)
-        }
       }
     },
 
@@ -156,24 +113,16 @@
       }
 
       if (!emphasized) {
-        this.$router.push({ path: getTranslatedUrl('theses') })
+        await this.$router.push({ path: getTranslatedUrl('theses') })
       }
 
-      try {
+      const apolloResponse = await this.$apollo.query(apolloPersonsForResults)
-        const ipResponse = await fetch(IPDATA_URL)
+      const parties = parseApolloPersonForResults(apolloResponse.data)
-        const ipData = await ipResponse.json()
-        if (ipData.country_code) {
-          this.userCountry = ipData.country_code.toLowerCase()
-        }
-      } catch (error) {
-        console.warn('Unable to fetch geo location:', error)
-      }
 
       const partiesWithScores = getPartiesWithScores(answers, emphasized, parties)
       this.parties = partiesWithScores.map(party => ({
         token: party.token,
-        score: party.score,
+        score: party.score
-        nationalParty: party['national_parties'][this.userCountry]
       }))
         .sort((a, b) => a.score - b.score)
         .reverse()

src/app/euromat/graphqlQueries.js

@@ -0,0 +1,72 @@
+import gql from 'graphql-tag'
+import { options } from '@/data'
+
+export const apolloTheses = {
+  query: gql`{
+    allQuestions(orderBy: ID_ASC) {
+      nodes {
+        category: categoryByCategoryId {
+          title
+        }
+        text
+        id
+      }
+    }
+  }`,
+  update: data => data.allQuestions.nodes.map(node => ({
+    id: node.id,
+    thesis: {
+      de: node.text
+    },
+    category: {
+      de: node.category.title
+    }
+  }))
+}
+
+export const apolloThesesCount = {
+  query: gql`{
+    allQuestions {
+      totalCount
+    }
+  }`,
+  update: data => data.allQuestions.totalCount
+}
+
+function getPositionById (id) {
+  return options.find(option => option.id === id).position
+}
+
+export const apolloPersonsForResults = {
+  query: gql`{
+    allPeople(condition: {role: CANDYMAT_CANDIDATE}) {
+      nodes {
+        firstName
+        lastName
+        id
+        answersByPersonId {
+          nodes {
+            position
+            questionId
+            text
+          }
+        }
+      }
+    }
+  }`
+}
+
+export function parseApolloPersonForResults (data) {
+  return data.allPeople.nodes.map(person => ({
+    id: person.id,
+    name: `${person.firstName} ${person.lastName}`,
+    token: person.firstName.charAt(0) + person.lastName.charAt(0),
+    positions: person.answersByPersonId.nodes.map(answer => ({
+      thesis: answer.questionId,
+      position: getPositionById(answer.position),
+      statement: {
+        de: answer.text
+      }
+    }))
+  }))
+}

src/app/euromat/helper.js

@@ -1,33 +0,0 @@
-import gql from 'graphql-tag'
-
-export const apolloTheses = {
-  query: gql`{
-    allQuestions(orderBy: ID_ASC) {
-      nodes {
-        category: categoryByCategoryId {
-          title
-        }
-        text
-        id
-      }
-    }
-  }`,
-  update: data => data.allQuestions.nodes.map(node => ({
-    id: node.id,
-    thesis: {
-      de: node.text
-    },
-    category: {
-      de: node.category.title
-    }
-  }))
-}
-
-export const apolloThesesCount = {
-  query: gql`{
-    allQuestions {
-      totalCount
-    }
-  }`,
-  update: data => data.allQuestions.totalCount
-}

src/config/api.js

@@ -1 +0,0 @@
-export const IPDATA_URL = 'https://api.ipdata.co/?api-key=test'