wip

src/app/Components/Artist/ArtistHeaderFloatingButtons.tsx

@@ -1,13 +1,12 @@
-import { ContextModule, OwnerType } from "@artsy/cohesion"
 import { ArtistHeaderFloatingButtons_artist$data } from "__generated__/ArtistHeaderFloatingButtons_artist.graphql"
 import { HeaderButton } from "app/Components/HeaderButton"
-import { ShareSheet } from "app/Components/ShareSheet/ShareSheet"
 import { useStickyTabPageContext } from "app/Components/StickyTabPage/StickyTabPageContext"
 import { goBack } from "app/navigation/navigate"
 import { ChevronIcon, ShareIcon } from "palette"
-import React, { Fragment, useRef, useState } from "react"
+import React, { useRef, useState } from "react"
 import Animated, { block, call, cond, onChange, set, useCode } from "react-native-reanimated"
 import { createFragmentContainer, graphql } from "react-relay"
+import { useCustomShareSheet } from "../CustomShareSheet/atoms"
 
 interface ArtistHeaderFloatingButtonsProps {
  artist: ArtistHeaderFloatingButtons_artist$data
@@ -20,7 +19,7 @@ const SHARE_ICON_SIZE = 23
 export const ArtistHeaderFloatingButtons: React.FC<ArtistHeaderFloatingButtonsProps> = ({
  artist,
 }) => {
- const [shareSheetVisible, setShareSheetVisible] = useState(false)
+ const sharesheet = useCustomShareSheet()
  const [hideButton, setHideButton] = useState(false)
  const { headerOffsetY } = useStickyTabPageContext()
 
@@ -41,12 +40,8 @@ export const ArtistHeaderFloatingButtons: React.FC<ArtistHeaderFloatingButtonsPr
  []
  )
 
- const handleSharePress = () => {
- setShareSheetVisible(true)
- }
-
  return (
- <Fragment>
+ <>
  <HeaderButton
  shouldHide={hideButton}
  position="left"
@@ -58,27 +53,18 @@ export const ArtistHeaderFloatingButtons: React.FC<ArtistHeaderFloatingButtonsPr
 
  <HeaderButton
  shouldHide={hideButton}
- onPress={handleSharePress}
+ onPress={() =>
+ sharesheet.show({
+ type: "artist",
+ slug: artist.slug,
+ })
+ }
  position="right"
  applySafeAreaTopInsets={false}
  >
  <ShareIcon width={SHARE_ICON_SIZE} height={SHARE_ICON_SIZE} />
  </HeaderButton>
-
- <ShareSheet
- entry={{
- internalID: artist.internalID,
- slug: artist.slug,
- href: artist.href!,
- artistNames: [artist.name!],
- imageURL: artist.image?.url ?? undefined,
- }}
- ownerType={OwnerType.artist}
- contextModule={ContextModule.artistHeader}
- visible={shareSheetVisible}
- setVisible={setShareSheetVisible}
- />
- </Fragment>
+ </>
  )
 }
 

src/app/Components/ShareSheet/ShareSheet.tests.tsx → src/app/Components/CustomShareSheet/CustomShareSheet.tests.tsx

@@ -6,7 +6,8 @@ import { renderWithWrappers } from "app/tests/renderWithWrappers"
 import { useCanOpenURL } from "app/utils/useCanOpenURL"
 import Share from "react-native-share"
 import * as helpers from "./helpers"
-import { ShareSheet, ShareSheetProps } from "./ShareSheet"
+
+// TODO: these tests need some rewriting
 
 const setVisibleMock = jest.fn()
 

src/app/Components/CustomShareSheet/CustomShareSheet.tsx

@@ -49,6 +49,7 @@ export const CustomShareSheet = () => {
  const toast = useToast()
  const shotRef = useRef<ViewShot>(null)
  const { trackEvent } = useTracking()
+ // TODO: we need to handle thr artist and the sale case
  const data = useLazyLoadQuery<CustomShareSheet_ArtworkQuery>(artworkQuery, {
  slug: item?.slug ?? "",
  skip: !item,
@@ -234,6 +235,20 @@ const artworkQuery = graphql`
  }
 `
 
+const artistQuery = graphql`
+ query CustomShareSheet_ArtistQuery($slug: String!, $skip: Boolean!) {
+ artist(id: $slug) @skip(if: $skip) {
+ internalID
+ slug
+ href
+ name
+ image {
+ url(version: "large")
+ }
+ }
+ }
+`
+// TODO: needs the other stuff, like sale and artist
 export const tracks = {
  customShare: (service: string, id: string, slug?: string): ShareType => ({
  action: ActionType.share,

src/app/Components/CustomShareSheet/atoms.ts

@@ -1,8 +1,5 @@
 import { atom, useAtom } from "jotai"
-
-type Item =
- | { type: "artwork"; slug: string; currentImageIndex?: number }
- | { type: "sale"; slug: string }
+import { Item } from "./types"
 
 const visibleAtom = atom(false)
 const itemAtom = atom<Item | null>(null)

src/app/Components/CustomShareSheet/types.ts

@@ -0,0 +1,4 @@
+export type Item =
+ | { type: "artwork"; slug: string; currentImageIndex?: number }
+ | { type: "sale"; slug: string }
+ | { type: "artist"; slug: string }

src/app/Scenes/ViewingRoom/ViewingRoom.tsx

@@ -1,6 +1,6 @@
 import { ViewingRoom_viewingRoom$data } from "__generated__/ViewingRoom_viewingRoom.graphql"
 import { ViewingRoomQuery } from "__generated__/ViewingRoomQuery.graphql"
-import { getShareURL } from "app/Components/ShareSheet/helpers"
+import { getShareURL } from "app/Components/CustomShareSheet/helpers"
 import { navigate } from "app/navigation/navigate"
 import { defaultEnvironment } from "app/relay/createEnvironment"
 import renderWithLoadProgress from "app/utils/renderWithLoadProgress"