Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor(Ratings): disable actions when not ready

Browse source
This commit is contained in:
Timothy Z. 2025-06-06 16:50:53 +03:00
parent 1297a2926b
commit 64707dee21
3 changed files with 22 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/components/MetaPreview/MetaPreview.js
View file

@ -233,6 +233,16 @@ const MetaPreview = React.forwardRef(({ className, compact, name, logo, backgrou
:
null
}
{
!compact ?
<Ratings
metaId={metaId}
like={like}
className={styles['ratings']}
/>
:
null
}
{
linksGroups.has(CONSTANTS.SHARE_LINK_CATEGORY) && !compact ?
<React.Fragment>
@ -259,16 +269,6 @@ const MetaPreview = React.forwardRef(({ className, compact, name, logo, backgrou
:
null
}
{
!compact && like.type === 'Ready' ?
<Ratings
metaId={metaId}
like={like}
className={styles['ratings']}
/>
:
null
}
</div>
</div>
);

8
src/components/MetaPreview/Ratings/Ratings.less
View file

@ -38,6 +38,14 @@
opacity: 1;
}
}
&.disabled {
cursor: not-allowed;
.icon {
opacity: 0.3;
}
}
}
}

7
src/components/MetaPreview/Ratings/Ratings.tsx
View file

@ -1,6 +1,6 @@
// Copyright (C) 2017-2025 Smart code 203358507
import React from 'react';
import React, { useMemo } from 'react';
import useRating from './useRating';
import styles from './Ratings.less';
import Icon from '@stremio/stremio-icons/react';
@ -19,13 +19,14 @@ type Props = {
const Ratings = ({ metaId, like, className }: Props) => {
const { onLiked, onLoved, liked, loved } = useRating(metaId, like);
const disabled = useMemo(() => like?.type !== 'Ready', [like]);
return (
<div className={classNames(styles['ratings-container'], className)}>
<div className={styles['icon-container']} onClick={onLiked}>
<div className={classNames(styles['icon-container'], { [styles['disabled']]: disabled })} onClick={onLiked}>
<Icon name={liked ? 'thumbs-up' : 'thumbs-up-outline'} className={styles['icon']} />
</div>
<div className={styles['icon-container']} onClick={onLoved}>
<div className={classNames(styles['icon-container'], { [styles['disabled']]: disabled })} onClick={onLoved}>
<Icon name={loved ? 'heart' : 'heart-outline'} className={styles['icon']} />
</div>
</div>