From e7f2c7d30a364bc5fde97a5b22db137b233ea1c4 Mon Sep 17 00:00:00 2001
From: Sander <mail@sanderboer.nl>
Date: Wed, 8 Nov 2023 11:29:07 +0100
Subject: [PATCH] fix round #6

---
 .../src/components/pages/fissa/Tracks.tsx     | 25 ++++++++-------
 .../fissa/quickVote/QuickVoteContext.tsx      | 32 +++++++++++--------
 apps/expo/src/components/shared/Badge.tsx     |  2 +-
 apps/expo/src/providers/SpotifyProvider.tsx   | 22 ++++++++-----
 4 files changed, 47 insertions(+), 34 deletions(-)

diff --git a/apps/expo/src/components/pages/fissa/Tracks.tsx b/apps/expo/src/components/pages/fissa/Tracks.tsx
index 37d067eb..7943a753 100644
--- a/apps/expo/src/components/pages/fissa/Tracks.tsx
+++ b/apps/expo/src/components/pages/fissa/Tracks.tsx
@@ -1,6 +1,6 @@
-import { FC, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Animated, NativeScrollEvent, NativeSyntheticEvent, View } from "react-native";
-import { FlashList } from "@shopify/flash-list";
+import { useCallback, useEffect, useMemo, useRef, useState, type FC } from "react";
+import { Animated, View, type NativeScrollEvent, type NativeSyntheticEvent } from "react-native";
+import { type FlashList } from "@shopify/flash-list";
 import { useGetFissa, useIsOwner } from "@fissa/hooks";
 import { sortFissaTracksOrder, useDevices, useTracks } from "@fissa/utils";
 
@@ -50,12 +50,15 @@ export const FissaTracks: FC<{ pin: string }> = ({ pin }) => {
     [data?.currentlyPlayingId, localTracks],
   );
 
-  const shouldShowBackButton = useCallback((showShow = false) => {
-    Animated.spring(showBackAnimation, {
-      toValue: Number(showShow),
-      useNativeDriver: false,
-    }).start();
-  }, []);
+  const shouldShowBackButton = useCallback(
+    (showShow = false) => {
+      Animated.spring(showBackAnimation, {
+        toValue: Number(showShow),
+        useNativeDriver: false,
+      }).start();
+    },
+    [showBackAnimation],
+  );
 
   const getTrackVotes = useCallback(
     (track?: SpotifyApi.TrackObjectFull) => {
@@ -68,7 +71,7 @@ export const FissaTracks: FC<{ pin: string }> = ({ pin }) => {
 
       return localTrack.score;
     },
-    [data?.tracks, data?.currentlyPlayingId, localTracks],
+    [data?.tracks, data?.currentlyPlayingId],
   );
 
   const trackEnd = useCallback(
@@ -86,7 +89,7 @@ export const FissaTracks: FC<{ pin: string }> = ({ pin }) => {
 
       return <TrackEnd trackId={track.id} pin={pin} />;
     },
-    [data?.tracks, data?.currentlyPlayingId, localTracks, isOwner],
+    [data?.tracks, data?.currentlyPlayingId, isOwner, pin],
   );
 
   const trackExtra = useCallback(
diff --git a/apps/expo/src/components/pages/fissa/quickVote/QuickVoteContext.tsx b/apps/expo/src/components/pages/fissa/quickVote/QuickVoteContext.tsx
index 5f1fc2a0..3875c839 100644
--- a/apps/expo/src/components/pages/fissa/quickVote/QuickVoteContext.tsx
+++ b/apps/expo/src/components/pages/fissa/quickVote/QuickVoteContext.tsx
@@ -1,6 +1,7 @@
 import {
   createContext,
   useCallback,
+  useMemo,
   useRef,
   useState,
   type FC,
@@ -12,8 +13,12 @@ import { impactAsync } from "expo-haptics";
 export const QuickVoteContext = createContext({
   track: undefined as SpotifyApi.TrackObjectFull | undefined,
   vote: 0,
-  setVote: (vote: number) => {},
-  selectTrack: (event: GestureResponderEvent, track?: SpotifyApi.TrackObjectFull) => {},
+  setVote: (vote: number): void => {
+    console.log("setVote", vote);
+  },
+  selectTrack: (event: GestureResponderEvent, track?: SpotifyApi.TrackObjectFull): void => {
+    console.log("selectTrack", event, track);
+  },
   touchStartPosition: {
     current: 0,
   },
@@ -47,17 +52,16 @@ export const QuickVoteProvider: FC<PropsWithChildren> = ({ children }) => {
     [],
   );
 
-  return (
-    <QuickVoteContext.Provider
-      value={{
-        track,
-        vote,
-        setVote: handleSetVote,
-        selectTrack: handleSelectTrack,
-        touchStartPosition,
-      }}
-    >
-      {children}
-    </QuickVoteContext.Provider>
+  const contextValue = useMemo(
+    () => ({
+      track,
+      vote,
+      setVote: handleSetVote,
+      selectTrack: handleSelectTrack,
+      touchStartPosition,
+    }),
+    [track, vote, handleSetVote, handleSelectTrack, touchStartPosition],
   );
+
+  return <QuickVoteContext.Provider value={contextValue}>{children}</QuickVoteContext.Provider>;
 };
diff --git a/apps/expo/src/components/shared/Badge.tsx b/apps/expo/src/components/shared/Badge.tsx
index ba1bd0a7..81dc9c13 100644
--- a/apps/expo/src/components/shared/Badge.tsx
+++ b/apps/expo/src/components/shared/Badge.tsx
@@ -40,7 +40,7 @@ export const Badge: FC<Props> = ({ amount, inverted }) => {
       animation.reset();
       amountRef.current = amount;
     });
-  }, [amount]);
+  }, [amount, amountAnimation]);
 
   if (amount === undefined) return null;
 
diff --git a/apps/expo/src/providers/SpotifyProvider.tsx b/apps/expo/src/providers/SpotifyProvider.tsx
index 19aecf57..59508c3d 100644
--- a/apps/expo/src/providers/SpotifyProvider.tsx
+++ b/apps/expo/src/providers/SpotifyProvider.tsx
@@ -3,6 +3,7 @@ import {
   createContext,
   useCallback,
   useContext,
+  useEffect,
   useMemo,
   useRef,
   useState,
@@ -132,21 +133,26 @@ export const SpotifyProvider: FC<PropsWithChildren> = ({ children }) => {
     await mutateAsync({ code, redirectUri });
   }, [response, request, saveScopes, saveTokens]);
 
-  useMemo(async () => {
+  useEffect(() => {
     if (user) return;
-    const localScopes = await getScopes();
-
-    if (String(localScopes) !== scopes.join("_")) return;
+    getScopes()
+      .then((localScopes) => {
+        if (String(localScopes) !== scopes.join("_")) return;
 
-    await updateTokens();
+        updateTokens().catch(console.info);
+      })
+      .catch(console.info);
   }, [updateTokens, user, getScopes]);
 
-  useOnActiveApp(async () => {
+  useOnActiveApp(() => {
     const { current } = lastTokenSaveTime;
     const difference = differenceInMinutes(new Date(), current);
 
-    if (difference < REFRESH_INTERVAL_MINUTES) return;
-    await updateTokens();
+    if (difference < REFRESH_INTERVAL_MINUTES) {
+      return;
+    }
+
+    updateTokens().catch(console.info);
   });
 
   useInterval(() => {