jwt

package.json

@@ -18,6 +18,7 @@
     "rsc": "node scripts/release-sanity-check.mjs"
   },
   "dependencies": {
+    "@big-whale-labs/poseidon": "^0.0.5",
     "@distributedlab/fetcher": "^1.0.0-rc.14",
     "@distributedlab/jac": "^1.0.0-rc.14",
     "@distributedlab/tools": "^1.0.0-rc.4",

src/common/Optionitem.vue

@@ -1,20 +1,20 @@
 <template>
   <div class="option-item">
-    <p>{{ item.id }}</p>
+    <p>{{ item.attributes.name }}</p>
     <app-button :text="$t('option-item.toggle-btn-txt')" @click="toggle" />
   </div>
 </template>
 
 <script setup lang="ts">
-import { VoteOption } from '@/types'
+import { VoteOptions } from '@/types'
 import { AppButton } from '@/common'
 
 const emit = defineEmits<{
   (e: 'toggle-state', id: string | number): void
 }>()
 
 const props = defineProps<{
-  item: VoteOption
+  item: VoteOptions
 }>()
 
 const toggle = () => {

src/common/VoteCard.vue

@@ -1,7 +1,58 @@
 <template>
-  <div class="vote-item"></div>
+  <div class="vote-item">
+    <div v-for="field in payload" class="vote-card__payload" :key="field.lbl">
+      <p>{{ field.lbl }}</p>
+      <p>{{ field.value }}</p>
+    </div>
+
+    <app-button :text="$t('vote-card.select-btn-txt')" @click="select" />
+  </div>
 </template>
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { Voting } from '@/types'
+import { useI18n } from 'vue-i18n'
+import { computed } from 'vue'
+import AppButton from '@/common/AppButton.vue'
+
+const emit = defineEmits<{
+  (e: 'select', value: Voting): void
+}>()
+
+const props = defineProps<{
+  voting: Voting
+}>()
+
+const { t } = useI18n()
+
+const payload = computed(() => [
+  {
+    lbl: t('vote-card.name-lbl'),
+    value: props.voting?.name ?? '',
+  },
+  {
+    lbl: t('vote-card.created-at-lbl'),
+    value: props.voting?.createdAt ?? '',
+  },
+  {
+    lbl: t('vote-card.active-until-lbl'),
+    value: props.voting?.activeUntil ?? '',
+  },
+])
+
+const select = () => {
+  emit('select', props.voting)
+}
+</script>
+
+<style scoped lang="scss">
+.vote-item {
+  padding: toRem(16);
+  display: grid;
+  border-radius: solid toRem(1) var(--background-primary-main);
+}
 
-<style scoped lang="scss"></style>
+.vote-card__payload {
+  display: grid;
+}
+</style>

src/common/VoteCardList.vue

@@ -1,15 +1,29 @@
 <template>
   <div class="vote-card-list">
-    <vote-card v-for="vote in payload" :key="vote" :vote="vote" />
+    <vote-card
+      v-for="vote in payload"
+      :key="vote.name"
+      :voting="vote"
+      @select="select"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
 import { VoteCard } from '@/common'
+import { Voting } from '@/types'
+
+const emit = defineEmits<{
+  (e: 'select', value: Voting): void
+}>()
 
 defineProps<{
-  payload: []
+  payload: Voting[]
 }>()
+
+const select = (vote: Voting) => {
+  emit('select', vote)
+}
 </script>
 
 <style scoped lang="scss">

src/common/modals/QrAuthModal.vue

@@ -9,11 +9,11 @@
 <script setup lang="ts">
 import * as QRCode from 'qrcode'
 import { Modal } from '@/common'
-import { v4 as uuid } from 'uuid'
 import { ref } from 'vue'
 
-defineProps<{
+const props = defineProps<{
   isShown: boolean
+  nonce: string
 }>()
 
 const qr = ref('')
@@ -22,9 +22,8 @@ const genQr = async (text: string) => {
 }
 
 const init = async () => {
-  const id = uuid()
-
-  qr.value = await genQr(JSON.stringify({ nonce: id, url: '' }))
+  console.log(props.nonce)
+  qr.value = await genQr(JSON.stringify({ nonce: props.nonce, url: '' }))
 }
 
 init()

src/helpers/vote.helpers.ts

@@ -2,19 +2,27 @@ import { api } from '@/api'
 import { VotePayload, VotingListResponse, VotingResponse } from '@/types'
 import { JsonApiBodyBuilder } from '@distributedlab/jac'
 
-export const getVotingList = async () => api.get('/voting')
+export const getVotingList = async () =>
+  api.get<VotingListResponse>('/voting/list?include=options')
 
 export const getVotingById = async (voteId: number | string) =>
-  api.get<VotingListResponse>(`/integrations/voting-svc/voting/${voteId}`)
+  api.get<VotingResponse>(`/voting/${voteId}?include=options`)
 
-export const postVote = async (vote: string) => {
-  // const body = new JsonApiBodyBuilder()
-  //   .setData({
-  //     vote,
-  //   })
-  //   .build()
-  //
-  // return api.post<VotingResponse>('/voting/vote', {
-  //   body,
-  // })
+export const postVote = async (
+  vote: { votingOption: string }[],
+  token: string,
+) => {
+  const body = new JsonApiBodyBuilder()
+    .setData({
+      type: 'revoke-admin',
+      attributes: {
+        data: vote,
+      },
+    })
+    .build()
+
+  return api.post<VotingResponse>('/voting/vote', {
+    body,
+    headers: { authorization: token ?? 'test' },
+  })
 }

src/localization/resources/en.json

@@ -26,5 +26,10 @@
     "vote-btn-txt": "Vote",
     "selected-part-title": "Selected items",
     "all-items-title": "All options"
+  },
+  "vote-card": {
+    "name-lbl": "Name",
+    "created-at-lbl": "Created at",
+    "active-until-lbl": "Active until"
   }
 }

src/pages/Home.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="home-page">
-    <template v-if="list.length">
-      <vote-card-list :payload="list" />
+    <template v-if="votings.length">
+      <vote-card-list :payload="votings" @select="select" />
     </template>
   </div>
 </template>
@@ -10,11 +10,25 @@
 import { VoteCardList } from '@/common'
 import { ref } from 'vue'
 import { getVotingList } from '@/helpers/vote.helpers'
+import { Voting } from '@/types'
+import { router } from '@/router'
+import { ROUTE_NAMES } from '@/enums'
+
+const votings = ref<Voting[]>([])
+
+const select = (vote: Voting) => {
+  console.log(vote)
+  router.push({
+    name: ROUTE_NAMES.vote,
+    params: { id: vote.id },
+  })
+}
 
-const list = ref<[]>([])
 const init = async () => {
-  const data = await getVotingList()
-  console.log(data)
+  const { data } = await getVotingList()
+
+  votings.value = data
+  console.log(votings.value)
 }
 
 init()