fix(chips): salary proposal labels (#DEV-1333) (#2651)

src/components/proposals/proposal-card-chips.vue

@@ -1,6 +1,25 @@
 <script>
+import { mapGetters } from 'vuex'
 import { PROPOSAL_TYPE } from '~/const'
 import { format } from '~/mixins/format'
+import gql from 'graphql-tag'
+
+const TIERS_QUERY = `
+  querySalaryband(
+    filter: {
+      details_dao_i: { eq: $daoId },
+    }
+  ) {
+    id: docId
+    name: details_name_s
+    annualAmount: details_annualUsdSalary_a
+    minDeferred: details_minDeferredX100_i
+
+    assignmentAggregate {
+      count
+    }
+  }
+`
 
 /**
  * A component to display proposal chips
@@ -23,7 +42,32 @@ export default {
     proposal: Object
   },
 
+  apollo: {
+    tiers: {
+      query: gql`query TIERS($daoId: Int64!) { ${TIERS_QUERY} }`,
+      update: data => data.querySalaryband,
+      skip () { return !this.selectedDao?.docId },
+      variables () { return { daoId: this.selectedDao.docId } },
+      // pollInterval: 1000, // TODO: Just for demo remove after
+      subscribeToMore: {
+        document: gql`subscription TIERS($daoId: Int64!) { ${TIERS_QUERY} }`,
+        skip () { return !this.selectedDao?.docId },
+        variables () { return { daoId: this.selectedDao.docId } },
+        updateQuery: (previousResult, { subscriptionData }) => {
+          if (!subscriptionData.data) {
+            return previousResult
+          }
+          if (!previousResult) {
+            return undefined
+          }
+          return subscriptionData.data
+        }
+      }
+    }
+  },
+
   computed: {
+    ...mapGetters('dao', ['selectedDao']),
     originalType () {
       return this.proposal.original[0] ? this.proposal.original[0].__typename : null
     },
@@ -222,13 +266,23 @@ export default {
       if (this.salary) {
         const amount = Number.parseFloat(this.salary.split(' ')[0])
         const band = this.getSalaryBucket(amount)
-        result.push(
-          {
-            color: 'secondary',
-            outline: false,
-            label: `${band}`
-          }
-        )
+        if (this.proposal?.salaryband?.[0]?.details_name_s || this.proposal?.salaryband?.[0]?.name) {
+          result.push(
+            {
+              color: 'secondary',
+              outline: false,
+              label: `${this.proposal?.salaryband?.[0]?.details_name_s || this.proposal?.salaryband?.[0]?.name}`
+            }
+          )
+        } else {
+          result.push(
+            {
+              color: 'secondary',
+              outline: false,
+              label: `${band}`
+            }
+          )
+        }
       }
 
       if (this.commit) {

src/pages/proposals/ProposalHistory.vue

@@ -300,6 +300,7 @@ queryDao(filter: { docId: { eq: $docId } }) {
 
       salaryband {
         details_annualUsdSalary_a
+        details_name_s
       }
 
       start {

src/pages/proposals/ProposalList.vue

@@ -830,7 +830,7 @@ export default {
     },
 
     resetPaginationValues() {
-      this.$refs.scroll.resume()
+      this.$refs?.scroll?.resume()
       this.pagination.offset = 0
       this.pagination.more = true
       this.$apollo.queries.archivedProposals?.refetch()

src/pages/proposals/create/OptionsArchetypes.vue

@@ -15,6 +15,7 @@ const ASSIGMENT_OPTIONS = `
       annualAmount: details_annualUsdSalary_a
       minDeferred: details_minDeferredX100_i
       system_defaultAsset_i
+      details_name_s
     }
   }
 `

src/query/archetypes/dao-archetypes.gql

@@ -1,7 +1,7 @@
 query daoArchetypes ($daoId: String!, $first: Int, $offset: Int, $order: RoleOrder, $filter: RoleFilter) {
   getDao (docId: $daoId) {
     docId,
-		role(first: $first, offset: $offset, order: $order, filter: $filter) {
+    role(first: $first, offset: $offset, order: $order, filter: $filter) {
       ... on Role {
         type
         docId

src/query/proposals/dao-proposal-detail-subs.gql

@@ -168,6 +168,10 @@ subscription proposal($docId: String!) {
     }
     ... on Assignment {
       details_usdSalaryValuePerPhase_a
+      salaryband {
+        details_annualUsdSalary_a
+        details_name_s
+      }
       cmntsect {
         docId
         comment {

src/query/proposals/dao-proposal-detail.gql

@@ -513,6 +513,7 @@ query proposalDetail($docId: String!, $first: Int!, $offset: Int!) {
       }
       salaryband {
         details_annualUsdSalary_a
+        details_name_s
       }
       details_pegSalaryPerPeriod_a
       details_rewardSalaryPerPeriod_a

src/query/proposals/dao-proposals-active-vote-subs.gql

@@ -200,6 +200,10 @@ subscription proposalsSubs ($docId: String!, $user: String, $first: Int) {
         start {
           details_startTime_t
         }
+        salaryband {
+          details_annualUsdSalary_a
+          details_name_s
+        }
         details_pegSalaryPerPeriod_a
         details_rewardSalaryPerPeriod_a
         details_voiceSalaryPerPeriod_a

src/query/proposals/dao-proposals-active-vote.gql

@@ -207,6 +207,7 @@ query proposalsActiveVote($docId: String!, $user: String, $first: Int!, $offset:
         details_periodCount_i
         salaryband {
           details_annualUsdSalary_a
+          details_name_s
         }
         start {
           details_startTime_t

src/query/proposals/dao-proposals-active.gql

@@ -26,7 +26,7 @@ query proposalsActive ($name: String!, $first: Int!, $offset: Int!) {
             fail_votePower_a
             abstain_votePower_a
             creator
-        	  createdDate
+            createdDate
           }
         }
       }
@@ -46,7 +46,7 @@ query proposalsActive ($name: String!, $first: Int!, $offset: Int!) {
             fail_votePower_a
             abstain_votePower_a
             creator
-        	  createdDate
+            createdDate
           }
         }
       }
@@ -66,10 +66,15 @@ query proposalsActive ($name: String!, $first: Int!, $offset: Int!) {
             fail_votePower_a
             abstain_votePower_a
             creator
-        	  createdDate
+            createdDate
           }
         }
       }
+      ... on Assignment {
+        salaryband {
+          details_annualUsdSalary_a
+          details_name_s
+        }
     }
   }
 }

src/query/proposals/dao-proposals-history.gql

@@ -294,6 +294,7 @@ query historyProposals($docId: String!, $first: Int!, $offset: Int!) {
 
         salaryband {
           details_annualUsdSalary_a
+          details_name_s
         }
 
         start {

src/query/proposals/dao-proposals-stage-subs.gql

@@ -49,6 +49,11 @@ subscription stageProposalsSubs($docId: String!, $first: Int) {
         details_ballotSupply_a
         details_ballotAlignment_i
 
+        salaryband {
+          details_annualUsdSalary_a
+          details_name_s
+        }
+
         start {
           details_startTime_t
         }

src/query/proposals/dao-proposals-stage.gql

@@ -167,6 +167,11 @@ query stageProposals($docId: String!, $first: Int!, $offset: Int!) {
           docId
         }
 
+        salaryband {
+          details_annualUsdSalary_a
+          details_name_s
+        }
+
         details_pegSalaryPerPeriod_a
         details_rewardSalaryPerPeriod_a
         details_voiceSalaryPerPeriod_a

src/utils/proposal-parsing.js

@@ -402,7 +402,7 @@ export function salary (proposal) {
       }
     }
     if (proposal.__typename === PROPOSAL_TYPE.ROLE) {
-      return proposal?.role?.[0]?.details_annualUsdSalary_a ? proposal?.role?.[0]?.details_annualUsdSalary_a : proposal?.salaryband?.[0]?.details_annualUsdSalary_a
+      return proposal?.role?.[0]?.details_annualUsdSalary_a ? proposal?.role?.[0]?.details_annualUsdSalary_a : proposal?.salaryband?.[0]?.details_annualUsdSalary_a ? proposal?.salaryband?.[0]?.details_annualUsdSalary_a : proposal?.salaryband?.[0]?.annualAmount
     }
     if (proposal.__typename === PROPOSAL_TYPE.EDIT) {
       if (proposal.original[0].__typename === PROPOSAL_TYPE.ROLE) {
@@ -418,9 +418,8 @@ export function compensation (proposal, daoSettings) {
   const [peg, pegToken] = proposal.details_pegAmount_a.split(' ')
   const [voice, voiceToken] = proposal.details_voiceAmount_a.split(' ')
 
-  const parseReward = daoSettings.rewardToPegRatio * parseFloat(reward)
+  const parseReward = daoSettings.rewardToPegRatio ? daoSettings.rewardToPegRatio * parseFloat(reward) : parseFloat(reward)
   const tooltip = `${parseFloat(reward).toFixed(0)} ${rewardToken} - ${parseFloat(peg).toFixed(0)} ${pegToken} - ${parseFloat(voice).toFixed(0)} ${voiceToken}`
-
   const compensation = parseReward + parseFloat(peg)
   return {
     amount: compensation.toString(),