Updated to retrieve values from API

samples/react-star-ratings/src/webparts/ratings/components/Ratings.tsx

@@ -12,7 +12,6 @@ import styles from './Ratings.module.scss';
 import * as strings from 'RatingsWebPartStrings';
 import { IRatingsProps } from './IRatingsProps';
 import SPHttpClientService from '../services/SPHttpClientService';
-import '../extensions/Map';
 
 interface IRatings {
   rating: number;
@@ -77,14 +76,11 @@ export const Ratings = ({ context, properties }: IRatingsProps) => {
     const service = new SPHttpClientService(context);
     await service.ensureFeatureEnabled();
     const user = await service.getCurrentUser();
-    const ratings = await service.getRatings();
+    const [ average, count, rating ] = await service.getRating(user.LoginName);
-    const rating = ratings.get(user.LoginName);
-    const count = ratings.size;
-    const sum = ratings.values().reduce((current, prev) => prev + current, 0);
     return {
       rating: rating,
       count: count,
-      average: count ? sum / count : 0
+      average: average
     };
   }, []);
 
@@ -103,6 +99,7 @@ export const Ratings = ({ context, properties }: IRatingsProps) => {
         setValue(await getRating());
       } catch (error) {
         setError(error.toString());
+        throw error;
       }
     })();
   }, [context]);

samples/react-star-ratings/src/webparts/ratings/extensions/Map.ts

@@ -1,26 +0,0 @@
-interface Map<K, V> {
-  keys(): K[];
-  values(): V[];
-}
-
-Object.defineProperty(Map.prototype, 'keys', {
-  configurable: true,
-  enumerable: false,
-  writable: true,
-  value: function () {
-    const array = [];
-    this.forEach((value, key) => array.push(key));
-    return array;
-  }
-});
-
-Object.defineProperty(Map.prototype, 'values', {
-  configurable: true,
-  enumerable: false,
-  writable: true,
-  value: function () {
-    const array = [];
-    this.forEach((value, key) => array.push(value));
-    return array;
-  }
-});

samples/react-star-ratings/src/webparts/ratings/services/SPHttpClientService.ts

@@ -13,6 +13,8 @@ interface IRetedBy {
 }
 
 interface IRating {
+  AverageRating: number;
+  RatingCount: number;
   RatedBy: IRetedBy[];
   Ratings: string;
 }
@@ -58,10 +60,10 @@ export default class SPSPHttpClientService {
     return value;
   }
 
-  public async getRatings(): Promise<Map<string, number>> {
+  public async getRating(loginName: string): Promise<[number, number, number]> {
     const response = await this.client.get(
       `${this.url}/_api/web/lists('${this.listId}')/items(${this.itemId})` +
-      '?$select=Ratings,RatedBy/Id,RatedBy/Name' +
+      '?$select=AverageRating,RatingCount,Ratings,RatedBy/Id,RatedBy/Name' +
       '&$expand=RatedBy',
       SPHttpClient.configurations.v1);
     if (!response.ok) {
@@ -69,16 +71,26 @@ export default class SPSPHttpClientService {
     }
     const json = await response.json();
     const value = json as IRating;
-    if (value.Ratings) {
+    const ratings = value.Ratings ? value.Ratings.slice(0, -1).split(',') : [];
-      return new Map(value.Ratings
+    const average = value.AverageRating || 0;
-        .slice(0, -1)
+    const count = value.RatingCount || 0;
-        .split(',')
+    let rating = 0;
-        .map(item => Number(item))
+    if (value.RatedBy) {
-        .map((item, index) => ([value.RatedBy[index].Name, item])));
+      for (let index = 0; index < value.RatedBy.length; index += 1) {
-    } else {
+        const ratedBy = value.RatedBy[index];
-      return new Map();
+        if (ratedBy.Name === loginName) {
+          if (index < ratings.length) {
+            rating = Number(ratings[index]);
           }
         }
+      }
+    }
+    return [
+      average,
+      count,
+      rating
+    ];
+  }
 
   public async setRating(rating: number): Promise<void> {
     const response = await this.client.post(