Merge pull request #14134 from artsy/staging

data/schema.graphql

@@ -2407,6 +2407,7 @@ type Artwork implements Node & Searchable & Sellable {
     first: Int
     last: Int
   ): AuctionResultConnection
+  condition: ArtworkCondition
   conditionDescription: ArtworkInfoRow
 
   # Notes by a partner or MyCollection user on the artwork, can only be accessed by partner or the user that owns the artwork
@@ -2771,6 +2772,19 @@ enum ArtworkAttributionClassType {
   UNKNOWN_EDITION
 }
 
+type ArtworkCondition {
+  description: String
+  displayText: String
+  value: String
+}
+
+enum ArtworkConditionEnumType {
+  EXCELLENT
+  FAIR
+  GOOD
+  VERY_GOOD
+}
+
 # A connection to a list of items.
 type ArtworkConnection implements ArtworkConnectionInterface {
   # A list of edges.
@@ -4390,6 +4404,7 @@ type CollectorProfileTypeEdge {
 
 type CollectorProfileUpdatePromptNotificationItem {
   collectorProfile: CollectorProfileType!
+  me: Me!
 }
 
 type CollectorResume {
@@ -13907,6 +13922,7 @@ input MyCollectionCreateArtworkInput {
 
   # The given location of the user as structured data
   collectorLocation: EditableLocation
+  condition: ArtworkConditionEnumType
   conditionDescription: String
   confidentialNotes: String
   costCurrencyCode: String
@@ -14008,6 +14024,7 @@ input MyCollectionUpdateArtworkInput {
 
   # The given location of the user as structured data
   collectorLocation: EditableLocation
+  condition: ArtworkConditionEnumType
   conditionDescription: String
   confidentialNotes: String
   costCurrencyCode: String
@@ -18835,12 +18852,12 @@ enum sort {
 }
 
 type SpecialistBio {
-  bio: String
-  email: String
-  firstName: String
-  image: Image
-  jobTitle: String
-  name: String
+  bio: String!
+  email: String!
+  firstName: String!
+  image: Image!
+  jobTitle: String!
+  name: String!
 }
 
 type StartIdentityVerificationFailure {
@@ -18885,7 +18902,7 @@ type StaticContent {
   slug: ID!
 
   # A list of specialists
-  specialistBios: [SpecialistBio]
+  specialistBios: [SpecialistBio!]
 }
 
 enum SubGroupInputStatus {

src/Apps/Consign/Routes/MarketingLanding/Components/LandingPage/HeaderSWA.tsx

@@ -7,30 +7,33 @@ import {
   Spacer,
   Text,
 } from "@artsy/palette"
+import { PreviousSubmissionQueryRenderer } from "Apps/Consign/Routes/MarketingLanding/Components/LandingPage/PreviousSubmission"
 import { useMarketingLandingTracking } from "Apps/Consign/Routes/MarketingLanding/Utils/marketingLandingTracking"
 import { RouterLink } from "System/Components/RouterLink"
 import { useFeatureFlag } from "System/Hooks/useFeatureFlag"
 import { Media } from "Utils/Responsive"
 import { resized } from "Utils/resized"
 
 export const HeaderSWA = () => {
-  const getInTouchRoute = "/sell/inquiry"
-
   const {
     trackStartSellingClick,
     trackGetInTouchClick,
   } = useMarketingLandingTracking()
 
+  const enableNewSubmissionFlow = useFeatureFlag("onyx_new_submission_flow")
+
   const image = resized(
     "https://files.artsy.net/images/content-card-swa-landing-page.jpg",
     { width: 1104, height: 833 }
   )
 
-  const enableNewSubmissionFlow = useFeatureFlag("onyx_new_submission_flow")
-
   return (
     <GridColumns gridRowGap={[2, 4]} alignItems="center">
       <Column span={5} order={[1, 0]} py={[0, 2]} pr={[0, 2]}>
+        <Media at="xs">
+          {enableNewSubmissionFlow && <PreviousSubmissionQueryRenderer />}
+        </Media>
+
         <Text as="h1" variant={["xl", "xxl", "xxxl"]}>
           Sell art from your collection
         </Text>
@@ -43,9 +46,17 @@ export const HeaderSWA = () => {
         </Text>
 
         <Media greaterThanOrEqual="sm">
-          <Spacer y={[2, 4]} />
+          {enableNewSubmissionFlow ? (
+            <Spacer y={[2, 1]} />
+          ) : (
+            <Spacer y={[2, 4]} />
+          )}
 
           <GridColumns>
+            <Column span={[12, 12, 10]}>
+              {enableNewSubmissionFlow && <PreviousSubmissionQueryRenderer />}
+            </Column>
+
             <Column span={[12, 6, 5]}>
               <Button
                 // @ts-ignore
@@ -72,7 +83,7 @@ export const HeaderSWA = () => {
                 variant="secondaryBlack"
                 data-testid="get-in-touch-button"
                 onClick={trackGetInTouchClick}
-                to={getInTouchRoute}
+                to="/sell/inquiry"
               >
                 Get in Touch
               </Button>

src/Apps/Consign/Routes/MarketingLanding/Components/LandingPage/PreviousSubmission.tsx

@@ -0,0 +1,82 @@
+import { Clickable, Flex, Text } from "@artsy/palette"
+import { INITIAL_STEP, SellFlowStep } from "Apps/Sell/SellFlowContext"
+import { usePreviousSubmission } from "Apps/Sell/Utils/previousSubmissionUtils"
+import { EntityHeaderSubmissionFragmentContainer } from "Components/EntityHeaders/EntityHeaderSubmission"
+import { FadeInBox } from "Components/FadeInBox"
+import { PreviousSubmissionQuery } from "__generated__/PreviousSubmissionQuery.graphql"
+import { useRouter } from "found"
+import { Suspense } from "react"
+import { graphql, useLazyLoadQuery } from "react-relay"
+
+export const PreviousSubmissionQueryRenderer: React.FC = () => {
+  const { submissionID, step } = usePreviousSubmission()
+
+  if (!submissionID) return null
+
+  return (
+    <Suspense fallback={null}>
+      <PreviousSubmission
+        submissionID={submissionID}
+        currentStep={step as SellFlowStep}
+      />
+    </Suspense>
+  )
+}
+
+interface PreviousSubmissionProps {
+  submissionID: string
+  currentStep: SellFlowStep
+}
+
+const PreviousSubmission: React.FC<PreviousSubmissionProps> = ({
+  submissionID,
+  currentStep = INITIAL_STEP,
+}) => {
+  const { router } = useRouter()
+
+  const { submission } = useLazyLoadQuery<PreviousSubmissionQuery>(
+    QUERY,
+    {
+      id: submissionID,
+    },
+    { fetchPolicy: "store-and-network" }
+  )
+
+  const handlePreviousSubmissionClick = () => {
+    if (!submissionID) return
+
+    router.push(`/sell2/submissions/${submissionID}/${currentStep}`)
+  }
+
+  if (!submission || submission.state !== "DRAFT") return null
+
+  return (
+    <FadeInBox
+      mt={[1, 1, 2]}
+      mb={[2, 1, 2]}
+      flex={[0, 0, 1]}
+      width="100%"
+      flexDirection="column"
+      display="flex"
+    >
+      <Text color="black60" variant="xs" mb={1}>
+        Finish previous submission:
+      </Text>
+
+      <Clickable onClick={handlePreviousSubmissionClick}>
+        <Flex borderWidth={1} borderColor="black10" borderRadius="50%">
+          <EntityHeaderSubmissionFragmentContainer submission={submission} />
+        </Flex>
+      </Clickable>
+    </FadeInBox>
+  )
+}
+
+const QUERY = graphql`
+  query PreviousSubmissionQuery($id: ID!) {
+    submission(id: $id) {
+      state
+      ...EntityHeaderSubmission_submission
+    }
+  }
+`

src/Apps/Consign/Routes/MarketingLanding/Components/LandingPage/SWAFooter.tsx

@@ -1,14 +1,11 @@
-import { Button, Text, Box } from "@artsy/palette"
-import { RouterLink } from "System/Components/RouterLink"
+import { Box, Button, Text } from "@artsy/palette"
 import { useMarketingLandingTracking } from "Apps/Consign/Routes/MarketingLanding/Utils/marketingLandingTracking"
-import { ContextModule, Intent } from "@artsy/cohesion"
-import { useSystemContext } from "System/Hooks/useSystemContext"
-import { useAuthDialog } from "Components/AuthDialog"
+import { RouterLink } from "System/Components/RouterLink"
+import { useFeatureFlag } from "System/Hooks/useFeatureFlag"
 
 export const SWAFooter: React.FC = () => {
+  const enableNewSubmissionFlow = useFeatureFlag("onyx_new_submission_flow")
   const { trackStartSellingClick } = useMarketingLandingTracking()
-  const { isLoggedIn } = useSystemContext()
-  const { showAuthDialog } = useAuthDialog()
 
   return (
     <>
@@ -24,26 +21,8 @@ export const SWAFooter: React.FC = () => {
           as={RouterLink}
           width={["100%", 300]}
           variant="primaryBlack"
-          to="/sell/submission"
-          onClick={event => {
-            if (!isLoggedIn) {
-              event.preventDefault()
-
-              showAuthDialog({
-                mode: "Login",
-                options: {
-                  title: () => {
-                    return "Log in to submit an artwork for sale"
-                  },
-                },
-                analytics: {
-                  contextModule: ContextModule.sellFooter,
-                  intent: Intent.login,
-                },
-              })
-
-              return
-            }
+          to={enableNewSubmissionFlow ? "sell2/intro" : "/sell/submission"}
+          onClick={() => {
             trackStartSellingClick("Footer")
           }}
           data-testid="start-selling-button"

src/Apps/Consign/Routes/MarketingLanding/Components/LandingPage/SWAStickyFooter.tsx

@@ -1,19 +1,17 @@
-import { ContextModule, Intent } from "@artsy/cohesion"
-import { Button, Text, useTheme, Box } from "@artsy/palette"
+import { ContextModule } from "@artsy/cohesion"
+import { Box, Button, Text, useTheme } from "@artsy/palette"
 import { Z } from "Apps/Components/constants"
 import { useMarketingLandingTracking } from "Apps/Consign/Routes/MarketingLanding/Utils/marketingLandingTracking"
-import { useAuthDialog } from "Components/AuthDialog"
 import { RouterLink } from "System/Components/RouterLink"
-import { useSystemContext } from "System/Hooks/useSystemContext"
+import { useFeatureFlag } from "System/Hooks/useFeatureFlag"
 
 export const SWAStickyFooter = () => {
+  const enableNewSubmissionFlow = useFeatureFlag("onyx_new_submission_flow")
   const {
     trackStartSellingClick,
     trackGetInTouchClick,
   } = useMarketingLandingTracking()
   const { theme } = useTheme()
-  const { isLoggedIn } = useSystemContext()
-  const { showAuthDialog } = useAuthDialog()
 
   const getInTouchRoute = "/sell/inquiry"
 
@@ -38,26 +36,8 @@ export const SWAStickyFooter = () => {
         as={RouterLink}
         width="100%"
         variant="primaryBlack"
-        to="/sell/submission"
+        to={enableNewSubmissionFlow ? "sell2/intro" : "/sell/submission"}
         onClick={event => {
-          if (!isLoggedIn) {
-            event.preventDefault()
-
-            showAuthDialog({
-              mode: "Login",
-              options: {
-                title: () => {
-                  return "Log in to submit an artwork for sale"
-                },
-              },
-              analytics: {
-                contextModule: ContextModule.sellStickyFooter,
-                intent: Intent.login,
-              },
-            })
-
-            return
-          }
           trackStartSellingClick(ContextModule.sellStickyFooter)
         }}
         mb={[1, 0]}

src/Apps/Consign/Routes/MarketingLanding/Components/__tests__/HeaderSWA.jest.tsx

@@ -1,7 +1,12 @@
 import { fireEvent, render, screen } from "@testing-library/react"
-import { useTracking } from "react-tracking"
 import { HeaderSWA } from "Apps/Consign/Routes/MarketingLanding/Components/LandingPage/HeaderSWA"
+import { useFeatureFlag } from "System/Hooks/useFeatureFlag"
+import { useTracking } from "react-tracking"
 
+const mockUseFeatureFlag = useFeatureFlag as jest.Mock
+jest.mock("System/Hooks/useFeatureFlag", () => ({
+  useFeatureFlag: jest.fn(() => true),
+}))
 jest.mock("react-tracking")
 jest.mock("System/Hooks/useAnalyticsContext", () => ({
   useAnalyticsContext: jest.fn(() => ({
@@ -16,8 +21,12 @@ jest.mock("System/Hooks/useRouter", () => ({
 
 const trackEvent = useTracking as jest.Mock
 
+const getMock = jest.fn()
+Storage.prototype.getItem = getMock
+
 describe("HeaderSWA", () => {
   beforeAll(() => {
+    mockUseFeatureFlag.mockImplementation(() => true)
     ;(useTracking as jest.Mock).mockImplementation(() => {
       return {
         trackEvent,
@@ -43,7 +52,7 @@ describe("HeaderSWA", () => {
 
       expect(link).toBeInTheDocument()
       expect(link).toHaveTextContent("Start Selling")
-      expect(link).toHaveAttribute("href", "/sell/submission")
+      expect(link).toHaveAttribute("href", "sell2/intro")
     })
 
     it("tracks click", () => {
@@ -86,5 +95,23 @@ describe("HeaderSWA", () => {
       expect(link).toHaveTextContent("Get in Touch")
       expect(link).toHaveAttribute("href", "/sell/inquiry")
     })
+
+    describe("with previous draft submission", () => {
+      beforeEach(() => {
+        getMock.mockImplementation(key =>
+          key === "previousSubmissionID" ? "test-id" : "test-step"
+        )
+      })
+
+      it("renders previous submission", () => {
+        render(<HeaderSWA />)
+
+        expect(getMock).toHaveBeenCalledWith("previousSubmissionID")
+
+        expect(
+          screen.queryByText("Finish previous submission:")
+        ).not.toBeInTheDocument()
+      })
+    })
   })
 })