enzostvs HF staff commited on
Commit
48bc121
β€’
1 Parent(s): 7b25d55

show if i've liked

Browse files
src/lib/components/community/reactions/Reaction.svelte CHANGED
@@ -4,6 +4,7 @@
4
  export let emoji: string;
5
  export let count: number;
6
  export let gallery_id: string;
 
7
  export let onReact: (emoji: string, id: string, deleted: boolean) => void;
8
 
9
  const handleReaction = async (emoji: string) => {
@@ -22,8 +23,10 @@
22
  </script>
23
 
24
  <UserIsLogged>
 
25
  <button
26
  class="rounded-full bg-white text-neutral-800 font-bold flex items-center justify-start gap-1.5 px-3 py-1 border border-white hover:bg-neutral-200 text-sm"
 
27
  on:click={() => handleReaction(emoji)}
28
  >
29
  <span class="text-base">{emoji}</span>
 
4
  export let emoji: string;
5
  export let count: number;
6
  export let gallery_id: string;
7
+ export let liked: boolean;
8
  export let onReact: (emoji: string, id: string, deleted: boolean) => void;
9
 
10
  const handleReaction = async (emoji: string) => {
 
23
  </script>
24
 
25
  <UserIsLogged>
26
+ <!-- liked -->
27
  <button
28
  class="rounded-full bg-white text-neutral-800 font-bold flex items-center justify-start gap-1.5 px-3 py-1 border border-white hover:bg-neutral-200 text-sm"
29
+ class:bg-opacity-60={!liked}
30
  on:click={() => handleReaction(emoji)}
31
  >
32
  <span class="text-base">{emoji}</span>
src/lib/components/community/reactions/Reactions.svelte CHANGED
@@ -16,17 +16,21 @@
16
  return {
17
  emoji,
18
  count: reactions.filter((reaction) => reaction.emoji === emoji).length,
 
19
  };
20
  });
21
  };
22
 
23
  $: groupedReactions = groupReactionsByEmoji(reactions);
 
 
24
  </script>
25
 
26
  {#each groupedReactions as reaction}
27
  <Reaction
28
  emoji={reaction.emoji}
29
  count={reaction?.count}
 
30
  {gallery_id}
31
  onReact={(emoji, id, deleted) => {
32
  if (deleted) {
 
16
  return {
17
  emoji,
18
  count: reactions.filter((reaction) => reaction.emoji === emoji).length,
19
+ liked: !!reactions.find((reaction) => reaction.emoji === emoji && reaction.hf_user_id === user?.sub)
20
  };
21
  });
22
  };
23
 
24
  $: groupedReactions = groupReactionsByEmoji(reactions);
25
+
26
+ $: console.log(groupedReactions);
27
  </script>
28
 
29
  {#each groupedReactions as reaction}
30
  <Reaction
31
  emoji={reaction.emoji}
32
  count={reaction?.count}
33
+ liked={reaction?.liked}
34
  {gallery_id}
35
  onReact={(emoji, id, deleted) => {
36
  if (deleted) {