Merge pull request #44 from web3privacy/dk/fix-rating-percentage

Dk/fix rating percentage

components/Card.vue

@@ -165,7 +165,7 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
         </div>
         <ProjectRating
           v-if="projectItem.type! === 'rating' && projectItem.rating"
-          :percentage="projectItem.rating.points"
+          :percentage="projectItem.rating.percentagePoints"
           :rating="projectItem.rating"
           :type="projectItem.rating.type"
         />
@@ -210,7 +210,7 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
         </div>
         <ProjectRating
           v-if="(filter.sortby === 'openess' || filter.sortby === 'technology' || filter.sortby === 'privacy') && project.ratings?.find((r) => r.type === filter.sortby) && !isLargeScreen"
-          :percentage="project.ratings.find((r) => r.type === filter.sortby)!.points"
+          :percentage="project.ratings.find((r) => r.type === filter.sortby)!.percentagePoints"
           :rating="project.ratings.find((r) => r.type === filter.sortby)!"
           compact
         />

components/Project/ProjectHeading.vue

@@ -215,7 +215,7 @@ const logo = props.project?.logos?.at(0)?.url
               </p>
               <ProjectRating
                 :rating="rating"
-                :percentage="rating.points"
+                :percentage="rating.percentagePoints"
                 :disable-popover="!isLargeScreen"
                 compact
                 :selected="rating.type === selectedMobileRating?.type && !isLargeScreen"
@@ -267,7 +267,7 @@ const logo = props.project?.logos?.at(0)?.url
           >
             <ProjectRating
               :rating="selectedMobileRating"
-              :percentage="selectedMobileRating.points"
+              :percentage="selectedMobileRating.percentagePoints"
               :disable-popover="!isLargeScreen"
               compact
               show-only-popover

components/Project/ProjectPrivacy.vue

@@ -64,7 +64,7 @@ defineProps<{
         bold
         title="Compliance with"
       >
-        {{ project.compliance ? 'YES' : 'NO' }}
+        {{ project.compliance ? project.compliance : 'NO' }}
       </ProjectInfoItem>
       <ProjectInfoItem
         :check-undefined="project.tracebility?.sign_in_type_requirments"

components/Project/ProjectRating.vue

@@ -14,16 +14,16 @@ const props = defineProps<{
 const emits = defineEmits(['selected'])
 
 const colors = [
-  '#ff0000', // 0-10%
+  '#EA171D', // 0-10%
-  '#ff4500', // 11-20%
+  '#FB2D00', // 11-20%
-  '#ff8c00', // 21-30%
+  '#FD6515', // 21-30%
-  '#ffd700', // 31-40%
+  '#FD941A', // 31-40%
-  '#adff2f', // 41-50%
+  '#FECD0A', // 41-50%
-  '#7fff00', // 51-60%
+  '#FFD806', // 51-60%
-  '#00ff00', // 61-70%
+  '#D2EF1F', // 61-70%
-  '#32cd32', // 71-80%
+  '#95DF1C', // 71-80%
-  '#00fa9a', // 81-90%
+  '#42FF00', // 81-90%
-  '#00ffff', // 91-100%
+  '#42FF00', // 91-100%
 ]
 
 const backgroundColorByScore = computed(() => {

composables/useData.ts

@@ -233,6 +233,7 @@ export const useData = defineStore('data', () => {
   const generateProjectRating = (project: Project) => {
     const projectRatings: ProjectRating[] = ranks.value?.map((rank) => {
       let rankPoints = 0
+      let maxPoints = 0
 
       const ratingStats: ProjectRatingItem[] = rank.references?.map((ref) => {
         let isValid = false
@@ -240,6 +241,7 @@ export const useData = defineStore('data', () => {
 
         let value
         let positive
+        let negative
 
         if (ref.condition.minLength !== undefined) {
           value = (field as any[])?.length
@@ -259,12 +261,17 @@ export const useData = defineStore('data', () => {
           if (value !== undefined)
             isValid = !!value
         }
+        if (ref.field === 'compliance') {
+          negative = value
+        }
+
         rankPoints += isValid ? ref.points : 0
+        maxPoints += ref.points
         return {
           isValid,
           label: ref.label.name,
           positive: positive ? positive : ref.label.positive,
-          negative: ref.label.negative,
+          negative: negative ? negative : ref.label.negative,
           value,
         } as ProjectRatingItem
       })
@@ -273,6 +280,7 @@ export const useData = defineStore('data', () => {
         name: rank.name,
         items: ratingStats,
         points: rankPoints,
+        percentagePoints: rankPoints / maxPoints * 100,
       }
     })
 

types/project.ts

@@ -165,6 +165,7 @@ export interface ProjectRating {
   name: string
   items: ProjectRatingItem[]
   points: number
+  percentagePoints: number
 }
 
 export interface ProjectRatingItem {