Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
cleanup(palette v3): button v2 馃憢 (#5512)
  • Loading branch information
pvinis committed Sep 24, 2021
1 parent d291405 commit 680fdfa
Show file tree
Hide file tree
Showing 62 changed files with 100 additions and 603 deletions.
7 changes: 1 addition & 6 deletions src/lib/Components/Artist/ArtistAbout/ArtistAboutShows.tsx
Expand Up @@ -58,12 +58,7 @@ const ArtistAboutShows: React.FC<Props> = ({ artist }) => {
contentContainerStyle={{ paddingBottom: 15, paddingLeft: 20 }}
/>
{!!pastShows.length && (
<Button
variant={"secondaryGray"}
onPress={() => navigate(`/artist/${artist?.slug!}/shows`)}
size="medium"
block
>
<Button variant={"fillGray"} onPress={() => navigate(`/artist/${artist?.slug!}/shows`)} size="small" block>
See all past shows
</Button>
)}
Expand Down
Expand Up @@ -220,7 +220,7 @@ export const SavedSearchBanner: React.FC<SavedSearchBannerProps> = ({

return (
<Button
variant={enabled ? "secondaryOutline" : "primaryBlack"}
variant={enabled ? "outline" : "fillDark"}
disabled={disabled}
onPress={handleSaveSearchFiltersPress}
icon={<BellIcon fill={enabled ? "black100" : "white100"} mr={0.5} width="16px" height="16px" />}
Expand Down
Expand Up @@ -100,7 +100,7 @@ export const SavedSearchButton: React.FC<SavedSearchButtonProps> = ({
return (
<Box>
<Button
variant="primaryBlack"
variant="fillDark"
size="small"
icon={<BellIcon fill="white100" mr={0.5} width="16px" height="16px" />}
disabled={isSavedSearch || filters.length === 0}
Expand Down
Expand Up @@ -123,7 +123,7 @@ describe("SavedSearchBanner", () => {
const buttonComponent = tree.root.findByType(Button)

expect(buttonComponent.props.children).toEqual("Create Alert")
expect(buttonComponent.props.variant).toBe("primaryBlack")
expect(buttonComponent.props.variant).toBe("fillDark")
expect(buttonComponent.props.loading).toBe(false)
})

Expand All @@ -134,7 +134,7 @@ describe("SavedSearchBanner", () => {
const buttonComponent = tree.root.findByType(Button)

expect(buttonComponent.props.children).toEqual("Remove Alert")
expect(buttonComponent.props.variant).toBe("secondaryOutline")
expect(buttonComponent.props.variant).toBe("outline")
expect(buttonComponent.props.loading).toBe(false)
})

Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Artist/ArtistHeader.tsx
Expand Up @@ -139,7 +139,7 @@ export const ArtistHeader: React.FC<Props> = ({ artist, relay }) => {

<Flex>
<Button
variant={artist.isFollowed ? "secondaryOutline" : "primaryBlack"}
variant={artist.isFollowed ? "outline" : "fillDark"}
onPress={handleFollowChange}
size="small"
longestText="Following"
Expand Down
3 changes: 1 addition & 2 deletions src/lib/Components/ArtistListItem.tsx
Expand Up @@ -108,8 +108,7 @@ export class ArtistListItem extends React.Component<Props, State> {
const { artist, withFeedback, containerStyle, disableNavigation, enableMyCollection } = this.props
const { is_followed, initials, image, href, name, nationality, birthday, deathday } = artist
const imageURl = image && image.url
const buttonVariant =
is_followed && enableMyCollection ? "primaryBlack" : is_followed ? "secondaryOutline" : "secondaryGray"
const buttonVariant = is_followed && enableMyCollection ? "fillDark" : is_followed ? "outline" : "fillGray"

if (!name) {
return null
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/ArtworkFilter/ArtworkFilter.tsx
Expand Up @@ -284,7 +284,7 @@ export const ArtworkFilterNavigator: React.FC<ArtworkFilterProps> = (props) => {
}}
block
width={100}
variant="primaryBlack"
variant="fillDark"
size="large"
>
Show results
Expand Down
Expand Up @@ -21,8 +21,8 @@ export const FilteredArtworkGridZeroState: React.FC<ZeroStateProps> = (props) =>
<Flex m="0 auto" pt={2}>
{!hideClearButton && (
<Button
size="medium"
variant="secondaryGray"
size="small"
variant="fillGray"
onPress={() => {
if (trackClear) {
trackClear(id, slug)
Expand Down
Expand Up @@ -338,7 +338,7 @@ class InfiniteScrollArtworksGrid extends React.Component<Props & PrivateProps, S
<Button
mt={5}
mb={3}
variant="secondaryGray"
variant="fillGray"
size="large"
block
onPress={this.fetchNextPage}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Bidding/Screens/BidResult.tsx
Expand Up @@ -130,7 +130,7 @@ export class BidResult extends React.Component<BidResultProps> {
Bid again
</Button>
) : (
<Button variant="secondaryOutline" block width={100} onPress={this.exitBidFlow}>
<Button variant="outline" block width={100} onPress={this.exitBidFlow}>
Continue
</Button>
)}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Bidding/Screens/RegistrationResult.tsx
Expand Up @@ -173,7 +173,7 @@ export class RegistrationResult extends React.Component<RegistrationResultProps>
{msg}
</Markdown>
</Flex>
<Button variant="secondaryOutline" onPress={dismissModal} block width={100}>
<Button variant="outline" onPress={dismissModal} block width={100}>
{status === RegistrationStatus.RegistrationStatusPending ? "View works in this sale" : "Continue"}
</Button>
</View>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Gene/Header.tsx
Expand Up @@ -132,7 +132,7 @@ class Header extends React.Component<Props, State> {
return (
<Box mt={15}>
<Button
variant={gene.isFollowed ? "secondaryOutline" : "primaryBlack"}
variant={gene.isFollowed ? "outline" : "fillDark"}
block
width={100}
onPress={() => this.handleFollowChange()}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Home/ArtistRails/ArtistCard.tsx
Expand Up @@ -109,7 +109,7 @@ export class ArtistCard extends React.Component<Props, State> {
</MetadataContainer>
<FollowButtonContainer>
<Button
variant={this.state.following ? "secondaryOutline" : "secondaryGray"}
variant={this.state.following ? "outline" : "fillGray"}
onPress={this.handleFollowChange}
size="small"
block
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Lists/ShowItemRow.tsx
Expand Up @@ -162,7 +162,7 @@ export class ShowItemRow extends React.Component<Props, State> {
</Flex>
{!shouldHideSaveButton && (
<Button
variant={show.is_followed ? "secondaryOutline" : "primaryBlack"}
variant={show.is_followed ? "outline" : "fillDark"}
size="small"
onPress={() => this.handleSave()}
loading={this.state.isFollowedSaving}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Components/Modal.tsx
Expand Up @@ -77,7 +77,7 @@ export class Modal extends React.Component<ModalProps, any> {
}}
block
width={100}
variant="secondaryOutline"
variant="outline"
>
Ok
</Button>
Expand Down
Expand Up @@ -2,15 +2,15 @@ import { BuyNowButton_artwork } from "__generated__/BuyNowButton_artwork.graphql
import { BuyNowButtonOrderMutation } from "__generated__/BuyNowButtonOrderMutation.graphql"
import { navigate } from "lib/navigation/navigate"
import { Schema, Track, track as _track } from "lib/utils/track"
import { Button, ButtonVariant } from "palette"
import { Button, ButtonProps } from "palette"
import React from "react"
import { Alert } from "react-native"
import { commitMutation, createFragmentContainer, graphql, RelayProp } from "react-relay"

export interface BuyNowButtonProps {
artwork: BuyNowButton_artwork
relay: RelayProp
variant?: ButtonVariant
variant?: ButtonProps["variant"]
// EditionSetID is passed down from the edition selected by the user
editionSetID: string | null
}
Expand Down Expand Up @@ -122,9 +122,7 @@ export class BuyNowButton extends React.Component<BuyNowButtonProps, State> {
width={100}
haptic
>
{variant && variant === "secondaryOutline" && artwork.saleMessage
? `Buy now ${artwork.saleMessage}`
: "Buy now"}
{variant && variant === "outline" && artwork.saleMessage ? `Buy now ${artwork.saleMessage}` : "Buy now"}
</Button>
)
}
Expand Down
Expand Up @@ -49,7 +49,7 @@ export class CommercialButtons extends React.Component<CommercialButtonProps> {
<BidButtonFragmentContainer artwork={artwork} me={me} auctionState={auctionState} />
<Spacer mb={1} />
<BuyNowButtonFragmentContainer
variant="secondaryOutline"
variant="outline"
artwork={artwork}
// @ts-expect-error STRICTNESS_MIGRATION --- 馃毃 Unsafe legacy code 馃毃 Please delete this and fix any type errors if you have time 馃檹
editionSetID={this.props.editionSetID}
Expand All @@ -73,7 +73,7 @@ export class CommercialButtons extends React.Component<CommercialButtonProps> {
artwork={artwork}
// @ts-expect-error STRICTNESS_MIGRATION --- 馃毃 Unsafe legacy code 馃毃 Please delete this and fix any type errors if you have time 馃檹
editionSetID={this.props.editionSetID}
variant="secondaryOutline"
variant="outline"
/>
</>
)
Expand Down
Expand Up @@ -4,7 +4,7 @@ import { ArtworkInquiryContext, ArtworkInquiryStateProvider } from "lib/utils/Ar
import { InquiryTypes } from "lib/utils/ArtworkInquiry/ArtworkInquiryTypes"
import { InquiryOptions } from "lib/utils/ArtworkInquiry/ArtworkInquiryTypes"
import { Schema } from "lib/utils/track"
import { Button, ButtonVariant } from "palette"
import { Button, ButtonProps } from "palette"
import React, { useContext, useState } from "react"
import { createFragmentContainer, graphql } from "react-relay"
import { useTracking } from "react-tracking"
Expand All @@ -13,7 +13,7 @@ export interface InquiryButtonsProps {
artwork: InquiryButtons_artwork
// EditionSetID is passed down from the edition selected by the user
editionSetID?: string
variant?: ButtonVariant
variant?: ButtonProps["variant"]
}

export interface InquiryButtonsState {
Expand Down
Expand Up @@ -2,7 +2,7 @@ import { MakeOfferButton_artwork } from "__generated__/MakeOfferButton_artwork.g
import { MakeOfferButtonOrderMutation } from "__generated__/MakeOfferButtonOrderMutation.graphql"
import { navigate } from "lib/navigation/navigate"
import { Schema, Track, track as _track } from "lib/utils/track"
import { Button, ButtonVariant } from "palette"
import { Button, ButtonProps } from "palette"
import React from "react"
import { Alert } from "react-native"
import { commitMutation, createFragmentContainer, graphql, RelayProp } from "react-relay"
Expand All @@ -12,7 +12,7 @@ export interface MakeOfferButtonProps {
relay: RelayProp
// EditionSetID is passed down from the edition selected by the user
editionSetID: string | null
variant?: ButtonVariant
variant?: ButtonProps["variant"]
buttonText?: string
}

Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/Artwork/Components/ContextCard.tsx
Expand Up @@ -105,7 +105,7 @@ export class ContextCard extends React.Component<ContextCardProps, ContextCardSt

return (
<Button
variant={isFollowed ? "secondaryOutline" : "primaryBlack"}
variant={isFollowed ? "outline" : "fillDark"}
onPress={() => this.handleFollowShow(show)}
size="small"
longestText="Following"
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/Artwork/Components/PartnerCard.tsx
Expand Up @@ -116,7 +116,7 @@ export class PartnerCard extends React.Component<Props, State> {
FollowButton={
(partner.profile && (
<Button
variant={partner.profile.is_followed ? "secondaryOutline" : "primaryBlack"}
variant={partner.profile.is_followed ? "outline" : "fillDark"}
onPress={this.handleFollowPartner.bind(this)}
size="small"
longestText="Following"
Expand Down
Expand Up @@ -113,7 +113,7 @@ export class RequestConditionReport extends React.Component<RequestConditionRepo
<Button
mt={1}
size="small"
variant="secondaryGray"
variant="fillGray"
loading={requestingConditionReport}
onPress={this.handleRequestConditionReportTap.bind(this)}
>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/City/Components/Event/index.tsx
Expand Up @@ -161,7 +161,7 @@ export class Event extends React.Component<Props, State> {
)}
</TextContainer>
<Button
variant={is_followed ? "secondaryOutline" : "primaryBlack"}
variant={is_followed ? "outline" : "fillDark"}
loading={isFollowedSaving}
onPress={() => this.handleSaveChange()}
longestText="Saved"
Expand Down
Expand Up @@ -73,7 +73,7 @@ export const Footer: React.FC<FooterProps> = ({ onConsignPress }) => {

<Spacer mb={3} />

<Button data-test-id="footer-cta" variant="primaryBlack" block onPress={handlePress} haptic>
<Button data-test-id="footer-cta" variant="fillDark" block onPress={handlePress} haptic>
<Sans size="3">Submit a work</Sans>
</Button>
</Box>
Expand Down
Expand Up @@ -33,7 +33,7 @@ export const Header: React.FC<HeaderProps> = ({ onConsignPress }) => {

<Spacer mb={2} />

<Button data-test-id="header-cta" variant="primaryBlack" block onPress={handlePress} haptic>
<Button data-test-id="header-cta" variant="fillDark" block onPress={handlePress} haptic>
<Sans size="3" weight="medium">
Submit a work
</Sans>
Expand Down
4 changes: 2 additions & 2 deletions src/lib/Scenes/Consignments/Screens/Confirmation.tsx
Expand Up @@ -120,7 +120,7 @@ export default class Confirmation extends React.Component<Props, State> {
Done
</Button>
<Spacer mb={2} />
<Button block width={100} onPress={this.exitModalAndGoHome} variant="secondaryOutline">
<Button block width={100} onPress={this.exitModalAndGoHome} variant="outline">
Browse new works for sale
</Button>
</Flex>
Expand Down Expand Up @@ -150,7 +150,7 @@ export default class Confirmation extends React.Component<Props, State> {
</Flex>
<Spacer mb={2} />
<Flex flexDirection="row" justifyContent="center">
<Button variant="secondaryOutline" block width={100} onPress={this.exitModal}>
<Button variant="outline" block width={100} onPress={this.exitModal}>
Quit
</Button>
</Flex>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/Fair/FairArticles.tsx
Expand Up @@ -130,7 +130,7 @@ export const FairArticles: React.FC<FairArticlesProps> = ({ fair, relay }) => {

{totalCount > FAIR2_ARTICLES_PAGE_SIZE && (
<Button
variant="secondaryGray"
variant="fillGray"
block
width="100%"
loading={isLoading}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/ForceUpdate/ForceUpdate.tsx
Expand Up @@ -31,7 +31,7 @@ export const ForceUpdate: React.FC<ForceUpdateProps> = ({ forceUpdateMessage })
<Text variant="caption" mt={3} textAlign="center" color={color("black60")}>
{forceUpdateMessage}
</Text>
<Button variant="secondaryGray" block size="large" mt={3} haptic="impactMedium" onPress={handleUpdate}>
<Button variant="fillGray" block size="large" mt={3} haptic="impactMedium" onPress={handleUpdate}>
Update Artsy
</Button>
</Flex>
Expand Down
@@ -1,7 +1,7 @@
import { InquiryMakeOfferButton_artwork } from "__generated__/InquiryMakeOfferButton_artwork.graphql"
import { InquiryMakeOfferButtonOrderMutation } from "__generated__/InquiryMakeOfferButtonOrderMutation.graphql"
import { navigate } from "lib/navigation/navigate"
import { Button, ButtonVariant } from "palette"
import { Button, ButtonProps } from "palette"
import React from "react"
import { Alert } from "react-native"
import { commitMutation, createFragmentContainer, graphql, RelayProp } from "react-relay"
Expand All @@ -11,7 +11,7 @@ export interface InquiryMakeOfferButtonProps {
relay: RelayProp
// EditionSetID is passed down from the edition selected by the user
editionSetID: string | null
variant?: ButtonVariant
variant?: ButtonProps["variant"]
buttonText?: string
disabled?: boolean
conversationID: string
Expand Down
Expand Up @@ -65,7 +65,7 @@ export const MakeOfferModal: React.FC<MakeOfferModalProps> = ({ ...props }) => {
</Flex>
)}
<InquiryMakeOfferButton
variant="primaryBlack"
variant="fillDark"
buttonText="Confirm"
artwork={artwork}
disabled={!!artwork.isEdition && !selectedEdition}
Expand All @@ -75,7 +75,7 @@ export const MakeOfferModal: React.FC<MakeOfferModalProps> = ({ ...props }) => {
<Button
mt={1}
size="large"
variant="secondaryOutline"
variant="outline"
block
width={100}
onPress={() => {
Expand Down
Expand Up @@ -29,7 +29,7 @@ export const NoMessages: React.FC = () => {
</Text>
<Flex width="100%" justifyContent="center" flexDirection="row">
<Button
variant="primaryBlack"
variant="fillDark"
onPress={() => {
handleViewWorks()
}}
Expand Down
Expand Up @@ -45,7 +45,7 @@ export const OpenInquiryModalButton: React.FC<OpenInquiryModalButtonProps> = ({
})
}}
size="large"
variant="primaryBlack"
variant="fillDark"
block
width={100}
>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/MyBids/Components/NoBids.tsx
Expand Up @@ -27,7 +27,7 @@ export const NoBids: React.FC<{ headerText: string }> = ({ headerText }) => {
Browse and bid in auctions around the world, from online-only sales to benefit auctions鈥攁ll in the Artsy app.
</Text>
<Flex width="100%" justifyContent="center" flexDirection="row">
<Button variant="primaryBlack" onPress={handleViewAllAuctions}>
<Button variant="fillDark" onPress={handleViewAllAuctions}>
{noBidsButtonText}
</Button>
</Flex>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/Scenes/MyCollection/MyCollection.tsx
Expand Up @@ -65,7 +65,7 @@ const MyCollection: React.FC<{
<Button
data-test-id="add-artwork-button-non-zero-state"
size="small"
variant="primaryBlack"
variant="fillDark"
onPress={() => {
setShowModal(true)
trackEvent(tracks.addCollectedArtwork())
Expand Down

0 comments on commit 680fdfa

Please sign in to comment.