Clean up like button w/ cover images and disable for own puzzles

crosshare-org · May 6, 2024 · 38665bf · 38665bf
1 parent 6a75338
commit 38665bf
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 7 deletions.
diff --git a/app/components/Buttons.module.css b/app/components/Buttons.module.css
@@ -83,16 +83,16 @@
   border-color: var(--default-text);
 }
 
-.btn:active {
-  transform: translateY(1px);
-}
-
 .btn:hover {
   color: var(--onlink);
   text-decoration: none;
   background-color: var(--link-hover);
 }
 
+.btn:enabled:active {
+  transform: translateY(1px);
+}
+
 .btn:hover:disabled {
   color: var(--default-text);
   background-color: transparent;

diff --git a/app/components/Images.module.css b/app/components/Images.module.css
@@ -75,5 +75,4 @@
 
 .topLine[data-has-cover='true'] {
   color: white;
-  mix-blend-mode: difference;
 }
diff --git a/app/components/ReactionButton.tsx b/app/components/ReactionButton.tsx
@@ -101,7 +101,7 @@ export function ReactionButton(props: ReactionButtonProps) {
         className={styles.btn}
         onClick={onClick}
         hollow={!isSet}
-        disabled={!mounted || submitting}
+        disabled={!mounted || submitting || props.puzzle.authorId === user?.uid}
       >
         <Emoji kind={props.kind} /> {submitting ? '…' : count > 0 ? count : ''}
       </Button>

diff --git a/app/lib/comments.ts b/app/lib/comments.ts
@@ -115,7 +115,11 @@ export async function moderateComments(
       const likes = puzzle.lk || [];
       switch (reaction.k) {
         case PuzzleReaction.Like:
-          if (reaction.s && !likes.includes(reaction.u)) {
+          if (
+            reaction.s &&
+            !likes.includes(reaction.u) &&
+            puzzle.a !== reaction.u
+          ) {
             likes.push(reaction.u);
             puzzle.lk = likes;
           } else if (!reaction.s && likes.includes(reaction.u)) {