chore: refactor, write tests

Author: dariakoko

src/app/Scenes/Shows/ShowsForYou.tests.tsx

@@ -0,0 +1,60 @@
+import Geolocation from "@react-native-community/geolocation"
+import { screen, waitForElementToBeRemoved } from "@testing-library/react-native"
+import { ShowsForYouScreen } from "app/Scenes/Shows/ShowsForYou"
+import { setupTestWrapper } from "app/utils/tests/setupTestWrapper"
+import mockFetch from "jest-fetch-mock"
+
+jest.mock("@react-native-community/geolocation", () => ({
+  setRNConfiguration: jest.fn(),
+  getCurrentPosition: jest.fn((success, _) => {
+    success({ coords: { latitude: 1, longitude: 2 } })
+  }),
+}))
+
+describe("ShowsForYou", () => {
+  beforeEach(() => {
+    jest.clearAllMocks()
+  })
+
+  const { renderWithRelay } = setupTestWrapper({
+    Component: () => <ShowsForYouScreen />,
+  })
+
+  it("renders shows for you", async () => {
+    renderWithRelay({
+      Me: () => ({
+        showsConnection: {
+          edges: [
+            {
+              node: {
+                name: "Sebastián Meltz-Collazo",
+                partner: {
+                  name: "Partner1",
+                },
+              },
+            },
+            {
+              node: {
+                name: "Artsy Editorial",
+                partner: {
+                  name: "Partner2",
+                },
+              },
+            },
+          ],
+        },
+      }),
+    })
+
+    await waitForElementToBeRemoved(() => screen.queryByTestId("articles-screen-placeholder"))
+
+    expect(Geolocation.getCurrentPosition).toHaveBeenCalled()
+    expect(mockFetch).not.toHaveBeenCalled()
+
+    expect(screen.getByText("Sebastián Meltz-Collazo")).toBeOnTheScreen()
+    expect(screen.getByText("Artsy Editorial")).toBeOnTheScreen()
+
+    expect(screen.getByText("Partner1")).toBeOnTheScreen()
+    expect(screen.getByText("Partner2")).toBeOnTheScreen()
+  })
+})

src/app/Scenes/Shows/ShowsForYou.tsx

@@ -11,20 +11,19 @@ import {
 import { goBack } from "app/system/navigation/navigate"
 import { extractNodes } from "app/utils/extractNodes"
 import { useFeatureFlag } from "app/utils/hooks/useFeatureFlag"
-import { useLocation } from "app/utils/hooks/useLocation"
+import { Location, useLocation } from "app/utils/hooks/useLocation"
 import { ProvideScreenTrackingWithCohesionSchema } from "app/utils/track"
 import { screen } from "app/utils/track/helpers"
 import { Suspense, useState } from "react"
 import { ActivityIndicator, RefreshControl } from "react-native"
 import { graphql, useLazyLoadQuery, usePaginationFragment } from "react-relay"
 
-const ShowsForYou: React.FC = () => {
-  const enableShowsForYouLocation = useFeatureFlag("AREnableShowsForYouLocation")
+interface ShowsForYouProps {
+  location: Location | null
+}
 
-  const { location, isLoading } = useLocation({
-    disabled: !enableShowsForYouLocation,
-    skipPermissionRequests: true,
-  })
+const ShowsForYou: React.FC<ShowsForYouProps> = ({ location }) => {
+  const enableShowsForYouLocation = useFeatureFlag("AREnableShowsForYouLocation")
 
   const showsForYouQueryVariables = location
     ? { near: location, count: 10 }
@@ -35,10 +34,6 @@ const ShowsForYou: React.FC = () => {
     showsForYouQueryVariables
   )
 
-  if (isLoading) {
-    return <ArticlesPlaceholder title="Shows for You" />
-  }
-
   return <ShowsForYouList me={queryData.me} />
 }
 
@@ -117,9 +112,20 @@ export const ShowsForYouList: React.FC<{ me: any }> = ({ me }) => {
 }
 
 export const ShowsForYouScreen: React.FC = () => {
+  const enableShowsForYouLocation = useFeatureFlag("AREnableShowsForYouLocation")
+
+  const { location, isLoading } = useLocation({
+    disabled: !enableShowsForYouLocation,
+    skipPermissionRequests: true,
+  })
+
+  if (isLoading) {
+    return <ArticlesPlaceholder title="Shows for You" />
+  }
+
   return (
     <Suspense fallback={<ArticlesPlaceholder title="Shows for You" />}>
-      <ShowsForYou />
+      <ShowsForYou location={location} />
     </Suspense>
   )
 }