void,
+ sendMyRate: () => void,
+}
+
+function Star({ filled, selected, setMyRate, sendMyRate }: StarProps) {
+ return (
+
+ )
+}
+
+type RatingProps = {
+ userId: number,
+ className: string | undefined,
+}
+
+function Rating({ userId, className }: RatingProps) {
+ const rating = useUserRating(userId)
+
+ const [myRate, setMyRate] = useState(0)
+
+ const { doSendRate } = useSendRate()
+
+ async function sendMyRate() {
+ const res = await doSendRate(myRate)
+
+ if (res) {
+ rating.refetch()
+ }
+ }
+
+ return (
+
+ Рейтинг пользователя:{' '}
+ {gotResponse(rating) ? (
+ gotError(rating) ? (
+ {rating.error}
+ ) : (
+ setMyRate(0)}
+ >
+ {...Array(5).fill(5).map(
+ (_, i) =>
+ setMyRate(i + 1)}
+ sendMyRate={() => void sendMyRate()}
+ />
+ )}
+
+ )
+ ) : (
+ Загрузка...
+ )
+ }
+
+
+ )
+}
+
+export default Rating
diff --git a/front/src/components/index.ts b/front/src/components/index.ts
index 57f2928..b124f0c 100644
--- a/front/src/components/index.ts
+++ b/front/src/components/index.ts
@@ -14,3 +14,4 @@ export { default as Points } from './Points'
export { default as SignOut } from './SignOut'
export { default as Poetry } from './Poetry'
export { default as SelectDisposalTrashbox } from './SelectDisposalTrashbox'
+export { default as Rating } from './Rating'
diff --git a/front/src/hooks/api/index.ts b/front/src/hooks/api/index.ts
index 93062d8..7e2d8f9 100644
--- a/front/src/hooks/api/index.ts
+++ b/front/src/hooks/api/index.ts
@@ -9,3 +9,5 @@ export { default as useSignIn } from './useSignIn'
export { default as useSignUp } from './useSignUp'
export { default as usePoetry } from './usePoetry'
export { default as useDispose } from './useDispose'
+export { default as useSendRate } from './useSendRate'
+export { default as useUserRating } from './useUserRating'
diff --git a/front/src/hooks/api/useSendRate.ts b/front/src/hooks/api/useSendRate.ts
new file mode 100644
index 0000000..d3cfc03
--- /dev/null
+++ b/front/src/hooks/api/useSendRate.ts
@@ -0,0 +1,33 @@
+import { useSend } from '..'
+import { composeSendRateURL, processSendRate } from '../../api/sendRate'
+import { isSendRateResponse } from '../../api/sendRate/types'
+
+function useSendRate() {
+ const { doSend, ...rest } = useSend(
+ composeSendRateURL(),
+ 'POST',
+ true,
+ isSendRateResponse,
+ processSendRate,
+ )
+
+ const doSendRate = (rate: number) => (
+ doSend({}, {
+ body: JSON.stringify({
+ rate,
+ }),
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+
+ })
+ )
+
+
+ return {
+ doSendRate,
+ ...rest,
+ }
+}
+
+export default useSendRate
diff --git a/front/src/hooks/api/useUserRating.ts b/front/src/hooks/api/useUserRating.ts
new file mode 100644
index 0000000..b14a5bf
--- /dev/null
+++ b/front/src/hooks/api/useUserRating.ts
@@ -0,0 +1,30 @@
+import { composeUserRatingURL, initialUserRating, processUserRating } from '../../api/userRating'
+import { UserRating, isUserRatingResponse } from '../../api/userRating/types'
+import useFetch, { UseFetchReturn } from '../useFetch'
+
+const useUserRating = (userId: number): UseFetchReturn => (
+ // useFetch(
+ // composeUserRatingURL(userId),
+ // 'GET',
+ // false,
+ // isUserRatingResponse,
+ // processUserRating,
+ // initialUserRating
+ // )
+
+ {
+ data: 3,
+ loading: false,
+ error: null,
+ refetch: () => { return },
+ }
+
+ // {
+ // data: undefined,
+ // loading: true,
+ // error: null,
+ // refetch: () => { return },
+ // }
+)
+
+export default useUserRating
diff --git a/front/src/styles/Rating.module.css b/front/src/styles/Rating.module.css
new file mode 100644
index 0000000..48a57c7
--- /dev/null
+++ b/front/src/styles/Rating.module.css
@@ -0,0 +1,19 @@
+.star {
+ -webkit-text-stroke: 2px var(--bs-body-color);
+ font-size: 1.5rem;
+ color: var(--bs-modal-bg);
+ background: none;
+ border: none;
+ padding: 0 3px;
+ transition: 0.15s ease-in-out;
+}
+
+.starFilled {
+ color: var(--bs-body-color);
+}
+
+.starSelected {
+ color: var(--bs-success);
+ -webkit-text-stroke: 2px var(--bs-success);
+ transform: scale(1.3);
+}
\ No newline at end of file