Merge pull request #366 from EscolaLMS/feature/REK-79

add custom max_score
EscolaLMS · Dec 5, 2024 · 3eafdef · 3eafdef
2 parents 7b83aa1 + 41bed32
commit 3eafdef
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 15 deletions.
diff --git a/src/components/atoms/Rating/Rating.tsx b/src/components/atoms/Rating/Rating.tsx
@@ -109,7 +109,7 @@ export const Rating: React.FC<RatingProps> = (props) => {
   const {
     count = 5,
     ratingValue,
-    label,
+    // label,
     onRateClick,
     onIconEnter,
     onIconLeave,
@@ -118,7 +118,7 @@ export const Rating: React.FC<RatingProps> = (props) => {
   const startToRender = Array.from(Array(count).keys());
   return (
     <StyledRating
-      size={props.size}
+      size={props.count}
       ratingValue={ratingValue}
       className={`wellms-component lms-rating ${className}`}
     >
@@ -153,7 +153,7 @@ export const Rating: React.FC<RatingProps> = (props) => {
           />
         );
       })}
-      {label && <span className="label">{label}</span>}
+      {/* {label && <span className="label">{label}</span>} */}
     </StyledRating>
   );
 };
diff --git a/src/components/molecules/Rate/Rate.tsx b/src/components/molecules/Rate/Rate.tsx
@@ -1,14 +1,15 @@
 import * as React from "react";
-import { useState, useMemo } from "react";
+import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import styled from "styled-components";
 import { ExtendableStyledComponent } from "types/component";
 import { Button } from "../../atoms/Button/Button";
 import { Rating } from "../../atoms/Rating/Rating";
-import { Text } from "../../atoms/Typography/Text";
+// import { Text } from "../../atoms/Typography/Text";
 import { Title } from "../../atoms/Typography/Title";
 
 interface Props extends ExtendableStyledComponent {
+  score?: number;
   submitLabel?: string;
   cancelLabel?: string;
   header?: string;
@@ -40,6 +41,7 @@ const StyledRate = styled.div`
 export const Rate: React.FC<Props> = (props) => {
   const { t } = useTranslation();
   const {
+    score,
     header = "Rate.Header",
     submitLabel = "Rate.submitButton",
     cancelLabel = "Rate.cancelButton",
@@ -52,22 +54,23 @@ export const Rate: React.FC<Props> = (props) => {
   const [selectedRate, setSelectedRate] = useState<number>(0);
   const [hoverRate, setHoverRate] = useState<number | undefined>();
 
-  const selectInfoText = useMemo(() => {
-    if (hoverRate) {
-      return t(`Rate.Select${hoverRate}`);
-    }
-    if (selectedRate === 0) {
-      return t("Rate.Select");
-    }
-    return t(`Rate.Select${selectedRate}`);
-  }, [selectedRate, hoverRate]);
+  // const selectInfoText = useMemo(() => {
+  //   if (hoverRate) {
+  //     return t(`Rate.Select${hoverRate}`);
+  //   }
+  //   if (selectedRate === 0) {
+  //     return t("Rate.Select");
+  //   }
+  //   return t(`Rate.Select${selectedRate}`);
+  // }, [selectedRate, hoverRate]);
 
   return (
     <StyledRate className={`wellms-component ${className}`}>
       <Title className="title" level={4}>
         {t(header)}
       </Title>
       <Rating
+        count={score}
         ratingValue={hoverRate ? hoverRate : selectedRate}
         size={"33px"}
         onRateClick={(rate: number) => {
@@ -79,13 +82,14 @@ export const Rate: React.FC<Props> = (props) => {
           setHoverRate(undefined);
         }}
       />
-      <Text className="selected-info">{selectInfoText}</Text>
+      {/* <Text className="selected-info">{selectInfoText}</Text> */}
       {children}
       <div className="submit-container">
         <Button mode="white" onClick={onCancel}>
           {t(cancelLabel)}
         </Button>
         <Button
+          type="button"
           mode="secondary"
           onClick={() => onSubmit(selectedRate)}
           disabled={selectedRate === 0}