From 9175c0851d21df6b8edcebdb067a4305f2c807c5 Mon Sep 17 00:00:00 2001 From: Leo Kewitz Date: Wed, 5 Aug 2020 20:15:42 +0000 Subject: [PATCH 1/5] refact: use new TransactionList in transaction section --- .../collective-page/sections/Transactions.js | 275 +++++++----------- components/transactions/graphql/fragments.js | 84 ++++++ pages/transactions.js | 81 +----- 3 files changed, 188 insertions(+), 252 deletions(-) create mode 100644 components/transactions/graphql/fragments.js diff --git a/components/collective-page/sections/Transactions.js b/components/collective-page/sections/Transactions.js index b52dfe73b31..c4b7a55a7ae 100644 --- a/components/collective-page/sections/Transactions.js +++ b/components/collective-page/sections/Transactions.js @@ -1,23 +1,19 @@ import React from 'react'; import PropTypes from 'prop-types'; import { graphql } from '@apollo/react-hoc'; -import gql from 'graphql-tag'; -import { orderBy } from 'lodash'; -import memoizeOne from 'memoize-one'; import { defineMessages, FormattedMessage, injectIntl } from 'react-intl'; +import { API_V2_CONTEXT, gqlV2 } from '../../../lib/graphql/helpers'; + import { Dimensions } from '../_constants'; -import BudgetItemsList, { - budgetItemExpenseFragment, - budgetItemExpenseTypeFragment, - budgetItemOrderFragment, -} from '../../budget/BudgetItemsList'; import { Box } from '../../Grid'; import Link from '../../Link'; import LoadingPlaceholder from '../../LoadingPlaceholder'; import MessageBox from '../../MessageBox'; import StyledButton from '../../StyledButton'; import StyledFilters from '../../StyledFilters'; +import { transactionsQueryCollectionFragment } from '../../transactions/graphql/fragments'; +import TransactionsList from '../../transactions/TransactionsList'; import ContainerSectionContent from '../ContainerSectionContent'; import SectionTitle from '../SectionTitle'; @@ -39,181 +35,112 @@ const I18nFilters = defineMessages({ }, }); -class SectionTransactions extends React.Component { - static propTypes = { - /** Collective */ - collective: PropTypes.shape({ - id: PropTypes.number.isRequired, - name: PropTypes.string.isRequired, - slug: PropTypes.string.isRequired, - currency: PropTypes.string.isRequired, - platformFeePercent: PropTypes.number, - }).isRequired, - - /** Wether user is admin of `collective` */ - isAdmin: PropTypes.bool, - - /** Wether user is root user */ - isRoot: PropTypes.bool, - - /** @ignore from withData */ - data: PropTypes.shape({ - loading: PropTypes.bool, - refetch: PropTypes.func, - /** Expenses paid + refunds */ - contributions: PropTypes.arrayOf( - PropTypes.shape({ - id: PropTypes.number.isRequired, - amount: PropTypes.number.isRequired, - createdAt: PropTypes.string.isRequired, - type: PropTypes.string.isRequired, - description: PropTypes.string, - fromcollective: PropTypes.shape({ - id: PropTypes.number.isRequired, - name: PropTypes.string.isRequired, - slug: PropTypes.string.isRequired, - type: PropTypes.string.isRequired, - imageUrl: PropTypes.string, - isIncognito: PropTypes.bool, - }), - usingVirtualCardFromCollective: PropTypes.shape({ - id: PropTypes.number.isRequired, - name: PropTypes.string.isRequired, - slug: PropTypes.string.isRequired, - type: PropTypes.string.isRequired, - }), - }), - ), - /** Financial contributions */ - expenses: PropTypes.shape({ - entries: PropTypes.arrayOf( - PropTypes.shape({ - id: PropTypes.number.isRequired, - amount: PropTypes.number.isRequired, - description: PropTypes.string.isRequired, - createdAt: PropTypes.string.isRequired, - transaction: PropTypes.shape({ - id: PropTypes.number, - }), - fromCollective: PropTypes.shape({ - id: PropTypes.number, - slug: PropTypes.string.isRequired, - name: PropTypes.string.isRequired, - imageUrl: PropTypes.string, - isIncognito: PropTypes.bool, - }).isRequired, - }), - ), - }), - }), - - /** @ignore from injectIntl */ - intl: PropTypes.object, - }; - - state = { filter: FILTERS.ALL }; - - componentDidUpdate(oldProps) { - // If users just logged in (or logged out), refetch the data so we can get the transactions - // `uuid` that will make it possible for them to download the expenses. - const hadAccess = oldProps.isAdmin || oldProps.isRoot; - const hasAccess = this.props.isAdmin || this.props.isRoot; - if (hadAccess !== hasAccess) { - this.props.data.refetch(); - } +const SectionTransactions = props => { + const [filter, setFilter] = React.useState(FILTERS.ALL); + React.useEffect(() => { + props.data.refetch(); + }, [props.data, props.isAdmin, props.isRoot]); + React.useEffect(() => { + const hasExpense = filter === FILTERS.EXPENSES || undefined; + const hasOrder = filter === FILTERS.CONTRIBUTIONS || undefined; + props.data.refetch({ slug: props.collective.slug, limit: NB_DISPLAYED, hasExpense, hasOrder }); + }, [filter, props.collective.slug, props.data]); + + const { data, intl, collective } = props; + const showFilters = data?.transactions?.length !== 0; + + if (!data?.transactions?.nodes?.length) { + return ( + + + + + + + + + ); } - getBudgetItems = memoizeOne((contributions, expenses, filter) => { - if (filter === FILTERS.EXPENSES) { - return expenses; - } else if (filter === FILTERS.CONTRIBUTIONS) { - return contributions; - } else { - return orderBy([...contributions, ...expenses], t => new Date(t.createdAt), ['desc']).slice(0, NB_DISPLAYED); - } - }); - - render() { - const { data, intl, collective, isAdmin, isRoot } = this.props; - const { filter } = this.state; - let showFilters = true; - - if (!data || data.loading) { - return ; - } - - const contributions = data.contributions || []; - const expenses = (data.expenses && data.expenses.entries) || []; - if (contributions.length === 0 && expenses.length === 0) { - return ( - - - - - - - - - ); - } else if (contributions.length === 0 || expenses.length === 0) { - showFilters = false; - } - - const budgetItems = this.getBudgetItems(contributions, expenses, filter); - return ( - - - - - - - {showFilters && ( - - this.setState({ filter })} - getLabel={filter => intl.formatMessage(I18nFilters[filter])} - minButtonWidth={180} - px={Dimensions.PADDING_X} - /> - + return ( + + + + + + + {showFilters && ( + + intl.formatMessage(I18nFilters[filter])} + minButtonWidth={180} + px={Dimensions.PADDING_X} + /> + + )} + + + {data.loading ? ( + + ) : ( + )} + + + → + + + + + ); +}; + +SectionTransactions.propTypes = { + /** Collective */ + collective: PropTypes.shape({ + id: PropTypes.number.isRequired, + name: PropTypes.string.isRequired, + slug: PropTypes.string.isRequired, + currency: PropTypes.string.isRequired, + platformFeePercent: PropTypes.number, + }).isRequired, + + /** Wether user is admin of `collective` */ + isAdmin: PropTypes.bool, + + /** Wether user is root user */ + isRoot: PropTypes.bool, + + /** @ignore from withData */ + data: PropTypes.shape({ + loading: PropTypes.bool, + refetch: PropTypes.func, + transactions: PropTypes.arrayOf(PropTypes.object), + }), - - - - - → - - - - - ); - } -} + /** @ignore from injectIntl */ + intl: PropTypes.object, +}; -const transactionsSectionQuery = gql` - query TransactionsSection($id: Int!, $nbDisplayed: Int!) { - contributions: allTransactions(CollectiveId: $id, includeExpenseTransactions: false, limit: $nbDisplayed) { - ...BudgetItemExpenseFragment - ...BudgetItemOrderFragment - } - expenses(FromCollectiveId: $id, limit: $nbDisplayed) { - entries: expenses { - ...BudgetItemExpenseTypeFragment - } +const transactionsQuery = gqlV2/* GraphQL */ ` + query Transactions($slug: String!, $limit: Int!, $hasOrder: Boolean, $hasExpense: Boolean) { + transactions(account: { slug: $slug }, limit: $limit, hasOrder: $hasOrder, hasExpense: $hasExpense) { + ...TransactionsQueryCollectionFragment } } - ${budgetItemExpenseFragment} - ${budgetItemOrderFragment} - ${budgetItemExpenseTypeFragment} + ${transactionsQueryCollectionFragment} `; -const addTransactionsSectionData = graphql(transactionsSectionQuery, { - options: props => ({ - variables: { id: props.collective.id, nbDisplayed: NB_DISPLAYED }, - }), +const addTransactionsSectionData = graphql(transactionsQuery, { + options: props => { + return { + variables: { slug: props.collective.slug, limit: NB_DISPLAYED }, + context: API_V2_CONTEXT, + }; + }, }); export default React.memo(injectIntl(addTransactionsSectionData(SectionTransactions))); diff --git a/components/transactions/graphql/fragments.js b/components/transactions/graphql/fragments.js new file mode 100644 index 00000000000..7910dc8cde3 --- /dev/null +++ b/components/transactions/graphql/fragments.js @@ -0,0 +1,84 @@ +import { gqlV2 } from '../../../lib/graphql/helpers'; + +export const transactionsQueryCollectionFragment = gqlV2/* GraphQL */ ` + fragment TransactionsQueryCollectionFragment on TransactionCollection { + totalCount + offset + limit + nodes { + id + uuid + amount { + currency + valueInCents + } + netAmount { + currency + valueInCents + } + platformFee { + currency + valueInCents + } + paymentProcessorFee { + currency + valueInCents + } + hostFee { + currency + valueInCents + } + type + description + createdAt + isRefunded + toAccount { + id + name + slug + type + imageUrl + ... on Collective { + host { + name + slug + type + } + } + } + fromAccount { + id + name + slug + type + imageUrl + } + paymentMethod { + type + } + order { + id + status + } + expense { + id + status + tags + type + legacyId + comments { + totalCount + } + payoutMethod { + type + } + account { + slug + } + createdByAccount { + slug + } + } + } + } +`; diff --git a/pages/transactions.js b/pages/transactions.js index b350a172e51..a1f0d8eec9c 100644 --- a/pages/transactions.js +++ b/pages/transactions.js @@ -29,6 +29,7 @@ import Pagination from '../components/Pagination'; import SearchBar from '../components/SearchBar'; import StyledHr from '../components/StyledHr'; import { H1 } from '../components/Text'; +import { transactionsQueryCollectionFragment } from '../components/transactions/graphql/fragments'; import TransactionsDownloadCSV from '../components/transactions/TransactionsDownloadCSV'; import TransactionsDownloadInvoices from '../components/transactions/TransactionsDownloadInvoices'; import TransactionsFilters from '../components/transactions/TransactionsFilters'; @@ -56,86 +57,10 @@ const transactionsQuery = gqlV2/* GraphQL */ ` dateFrom: $dateFrom searchTerm: $searchTerm ) { - totalCount - offset - limit - nodes { - id - uuid - amount { - currency - valueInCents - } - netAmount { - currency - valueInCents - } - platformFee { - currency - valueInCents - } - paymentProcessorFee { - currency - valueInCents - } - hostFee { - currency - valueInCents - } - type - description - createdAt - isRefunded - toAccount { - id - name - slug - type - imageUrl - ... on Collective { - host { - name - slug - type - } - } - } - fromAccount { - id - name - slug - type - imageUrl - } - paymentMethod { - type - } - order { - id - status - } - expense { - id - status - tags - type - legacyId - comments { - totalCount - } - payoutMethod { - type - } - account { - slug - } - createdByAccount { - slug - } - } - } + ...TransactionsQueryCollectionFragment } } + ${transactionsQueryCollectionFragment} `; const TransactionPageWrapper = styled.div` From bb8a61ae001054e32b73fc64c8098c2c08588a91 Mon Sep 17 00:00:00 2001 From: Leo Kewitz Date: Wed, 5 Aug 2020 17:27:35 -0300 Subject: [PATCH 2/5] refact: use new TransactionList in budget section --- components/collective-page/graphql/queries.js | 16 -- components/collective-page/sections/Budget.js | 143 ++++++++---------- .../collective-page/sections/Transactions.js | 47 +++--- lib/graphql/schemaV2.graphql | 12 +- 4 files changed, 91 insertions(+), 127 deletions(-) diff --git a/components/collective-page/graphql/queries.js b/components/collective-page/graphql/queries.js index ee56ebd2fbe..739597c486e 100644 --- a/components/collective-page/graphql/queries.js +++ b/components/collective-page/graphql/queries.js @@ -1,11 +1,5 @@ import gql from 'graphql-tag'; -import { - budgetItemExpenseFragment, - budgetItemExpenseTypeFragment, - budgetItemOrderFragment, -} from '../../budget/BudgetItemsList'; - import * as fragments from './fragments'; export const collectivePageQuery = gql` @@ -203,13 +197,6 @@ export const collectivePageQuery = gql` } } } - transactions(limit: 3, includeExpenseTransactions: false) { - ...BudgetItemOrderFragment - ...BudgetItemExpenseFragment - } - expenses(limit: 3) { - ...BudgetItemExpenseTypeFragment - } updates(limit: 3, onlyPublishedUpdates: true) { ...UpdatesFields } @@ -259,9 +246,6 @@ export const collectivePageQuery = gql` } } - ${budgetItemExpenseFragment} - ${budgetItemOrderFragment} - ${budgetItemExpenseTypeFragment} ${fragments.updatesFieldsFragment} ${fragments.contributorsFieldsFragment} `; diff --git a/components/collective-page/sections/Budget.js b/components/collective-page/sections/Budget.js index 3c15e419802..04c10a7327e 100644 --- a/components/collective-page/sections/Budget.js +++ b/components/collective-page/sections/Budget.js @@ -1,18 +1,13 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { Query } from '@apollo/react-components'; -import gql from 'graphql-tag'; -import { get, isEmpty, orderBy } from 'lodash'; +import { useQuery } from '@apollo/react-hooks'; +import { isEmpty } from 'lodash'; import { FormattedMessage, injectIntl } from 'react-intl'; import { CollectiveType } from '../../../lib/constants/collectives'; import { formatCurrency } from '../../../lib/currency-utils'; +import { API_V2_CONTEXT, gqlV2 } from '../../../lib/graphql/helpers'; -import BudgetItemsList, { - budgetItemExpenseFragment, - budgetItemExpenseTypeFragment, - budgetItemOrderFragment, -} from '../../budget/BudgetItemsList'; import Container from '../../Container'; import DefinedTerm, { Terms } from '../../DefinedTerm'; import { Box, Flex } from '../../Grid'; @@ -21,26 +16,18 @@ import MessageBox from '../../MessageBox'; import StyledButton from '../../StyledButton'; import StyledCard from '../../StyledCard'; import { P, Span } from '../../Text'; +import { transactionsQueryCollectionFragment } from '../../transactions/graphql/fragments'; +import TransactionsList from '../../transactions/TransactionsList'; import ContainerSectionContent from '../ContainerSectionContent'; import SectionTitle from '../SectionTitle'; -/** Query to re-fetch transactions and expenses */ -const budgetSectionQuery = gql` - query BudgetSection($slug: String!) { - Collective(slug: $slug) { - id - transactions(limit: 3, includeExpenseTransactions: false) { - ...BudgetItemOrderFragment - ...BudgetItemExpenseFragment - } - expenses(limit: 3) { - ...BudgetItemExpenseTypeFragment - } +const budgetSectionQuery = gqlV2/* GraphQL */ ` + query TransactionsSection($slug: String!, $limit: Int!) { + transactions(account: { slug: $slug }, limit: $limit) { + ...TransactionsQueryCollectionFragment } } - ${budgetItemExpenseFragment} - ${budgetItemOrderFragment} - ${budgetItemExpenseTypeFragment} + ${transactionsQueryCollectionFragment} `; /** @@ -48,10 +35,15 @@ const budgetSectionQuery = gql` * abut the global budget of the collective. */ const SectionBudget = ({ collective, stats }) => { + const { data } = useQuery(budgetSectionQuery, { + variables: { slug: collective.slug, limit: 3 }, + context: API_V2_CONTEXT, + }); const monthlyRecurring = (stats.activeRecurringContributions?.monthly || 0) + (stats.activeRecurringContributions?.yearly || 0) / 12; const isFund = collective.type === CollectiveType.FUND || collective.settings?.fund === true; // Funds MVP, to refactor const isProject = collective.type === CollectiveType.PROJECT; + return ( @@ -65,69 +57,52 @@ const SectionBudget = ({ collective, stats }) => { />

- - {({ data }) => { - const expenses = get(data, 'Collective.expenses'); - const transactions = get(data, 'Collective.transactions'); - if (isEmpty(expenses) && isEmpty(transactions)) { - return ( - - + - - ); - } + /> + + )} - // Merge items, filter expenses that already have a transaction as they'll already be - // included in `transactions`. - const budgetItemsUnsorted = [...transactions, ...expenses]; - const budgetItems = orderBy(budgetItemsUnsorted, i => new Date(i.createdAt), ['desc']).slice(0, 3); - return ( - - - - - - - - - - - - - - - - - - - - ); - }} - + + + + + + + + + + + + + + + + + + + diff --git a/components/collective-page/sections/Transactions.js b/components/collective-page/sections/Transactions.js index c4b7a55a7ae..13074a97a06 100644 --- a/components/collective-page/sections/Transactions.js +++ b/components/collective-page/sections/Transactions.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { graphql } from '@apollo/react-hoc'; +import { useQuery } from '@apollo/react-hooks'; import { defineMessages, FormattedMessage, injectIntl } from 'react-intl'; import { API_V2_CONTEXT, gqlV2 } from '../../../lib/graphql/helpers'; @@ -35,18 +35,31 @@ const I18nFilters = defineMessages({ }, }); +const transactionsSectionQuery = gqlV2/* GraphQL */ ` + query TransactionsSection($slug: String!, $limit: Int!, $hasOrder: Boolean, $hasExpense: Boolean) { + transactions(account: { slug: $slug }, limit: $limit, hasOrder: $hasOrder, hasExpense: $hasExpense) { + ...TransactionsQueryCollectionFragment + } + } + ${transactionsQueryCollectionFragment} +`; + const SectionTransactions = props => { + const { data, refetch, loading } = useQuery(transactionsSectionQuery, { + variables: { slug: props.collective.slug, limit: NB_DISPLAYED }, + context: API_V2_CONTEXT, + }); const [filter, setFilter] = React.useState(FILTERS.ALL); React.useEffect(() => { - props.data.refetch(); - }, [props.data, props.isAdmin, props.isRoot]); + refetch(); + }, [props.isAdmin, props.isRoot, refetch]); React.useEffect(() => { const hasExpense = filter === FILTERS.EXPENSES || undefined; const hasOrder = filter === FILTERS.CONTRIBUTIONS || undefined; - props.data.refetch({ slug: props.collective.slug, limit: NB_DISPLAYED, hasExpense, hasOrder }); - }, [filter, props.collective.slug, props.data]); + refetch({ slug: props.collective.slug, limit: NB_DISPLAYED, hasExpense, hasOrder }); + }, [filter, props.collective.slug, refetch]); - const { data, intl, collective } = props; + const { intl, collective } = props; const showFilters = data?.transactions?.length !== 0; if (!data?.transactions?.nodes?.length) { @@ -83,7 +96,7 @@ const SectionTransactions = props => { )} - {data.loading ? ( + {loading ? ( ) : ( @@ -125,22 +138,4 @@ SectionTransactions.propTypes = { intl: PropTypes.object, }; -const transactionsQuery = gqlV2/* GraphQL */ ` - query Transactions($slug: String!, $limit: Int!, $hasOrder: Boolean, $hasExpense: Boolean) { - transactions(account: { slug: $slug }, limit: $limit, hasOrder: $hasOrder, hasExpense: $hasExpense) { - ...TransactionsQueryCollectionFragment - } - } - ${transactionsQueryCollectionFragment} -`; - -const addTransactionsSectionData = graphql(transactionsQuery, { - options: props => { - return { - variables: { slug: props.collective.slug, limit: NB_DISPLAYED }, - context: API_V2_CONTEXT, - }; - }, -}); - -export default React.memo(injectIntl(addTransactionsSectionData(SectionTransactions))); +export default React.memo(injectIntl(SectionTransactions)); diff --git a/lib/graphql/schemaV2.graphql b/lib/graphql/schemaV2.graphql index 132ae8aeb44..7d529562b72 100644 --- a/lib/graphql/schemaV2.graphql +++ b/lib/graphql/schemaV2.graphql @@ -1,5 +1,5 @@ # source: http://localhost:3060/graphql/v2 -# timestamp: Tue Aug 04 2020 10:43:42 GMT-0300 (Brasilia Standard Time) +# timestamp: Wed Aug 05 2020 16:44:39 GMT-0300 (Brasilia Standard Time) """ Account interface shared by all kind of accounts (Bot, Collective, Event, User, Organization) @@ -5130,6 +5130,16 @@ type Query { The term to search """ searchTerm: String + + """ + Transaction is attached to Expense + """ + hasExpense: Boolean + + """ + Transaction is attached to Order + """ + hasOrder: Boolean ): TransactionCollection loggedInAccount: Account } From a26507212cb4b460d26f64c54325cae4c3babee3 Mon Sep 17 00:00:00 2001 From: Leo Kewitz Date: Thu, 6 Aug 2020 21:19:00 +0000 Subject: [PATCH 3/5] fix: transactions search bar bug --- pages/transactions.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/pages/transactions.js b/pages/transactions.js index a1f0d8eec9c..c225effca99 100644 --- a/pages/transactions.js +++ b/pages/transactions.js @@ -171,7 +171,9 @@ class TransactionsPage extends React.Component { Router.pushRoute('transactions', { ...query, searchTerm, offset: null })} + onSubmit={searchTerm => + Router.pushRoute('transactions', { ...query, searchTerm, offset: null, collectiveSlug: slug }) + } /> From ef9af01d816d473342787f377ee08412a43432e7 Mon Sep 17 00:00:00 2001 From: Leo Kewitz Date: Thu, 6 Aug 2020 21:19:36 +0000 Subject: [PATCH 4/5] refact: rename wrong component --- components/transactions/TransactionsDownloadInvoices.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/components/transactions/TransactionsDownloadInvoices.js b/components/transactions/TransactionsDownloadInvoices.js index bd8aa718043..da1c285cf9b 100644 --- a/components/transactions/TransactionsDownloadInvoices.js +++ b/components/transactions/TransactionsDownloadInvoices.js @@ -96,7 +96,7 @@ const makeYearlyOptions = invoices => { .reverse(); }; -const TransactionsDownloadCSV = ({ collective }) => { +const TransactionsDownloadInvoices = ({ collective }) => { const [interval, setInterval] = React.useState('monthly'); const [year, setYear] = React.useState(); const { data, loading } = useQuery(invoicesQuery, { @@ -169,7 +169,7 @@ const TransactionsDownloadCSV = ({ collective }) => { ); }; -TransactionsDownloadCSV.propTypes = { +TransactionsDownloadInvoices.propTypes = { onChange: PropTypes.func, filters: PropTypes.object, collective: PropTypes.shape({ @@ -179,4 +179,4 @@ TransactionsDownloadCSV.propTypes = { }).isRequired, }; -export default TransactionsDownloadCSV; +export default TransactionsDownloadInvoices; From 2d337b783e5dbec28b05d10d038b19b74b00b7d6 Mon Sep 17 00:00:00 2001 From: Leo Kewitz Date: Thu, 6 Aug 2020 22:16:06 -0300 Subject: [PATCH 5/5] test: update collective e2e test --- components/transactions/TransactionItem.js | 2 +- test/cypress/integration/04-collective.test.js | 6 +++--- test/cypress/integration/05-user.test.js | 16 ++++++++++------ test/cypress/integration/06-host.test.js | 7 ------- 4 files changed, 14 insertions(+), 17 deletions(-) diff --git a/components/transactions/TransactionItem.js b/components/transactions/TransactionItem.js index 6d48e4603e6..81179dacacd 100644 --- a/components/transactions/TransactionItem.js +++ b/components/transactions/TransactionItem.js @@ -65,7 +65,7 @@ const TransactionItem = transaction => { : netAmount; return ( - + diff --git a/test/cypress/integration/04-collective.test.js b/test/cypress/integration/04-collective.test.js index 3556735e602..637c2b23c57 100644 --- a/test/cypress/integration/04-collective.test.js +++ b/test/cypress/integration/04-collective.test.js @@ -183,11 +183,11 @@ describe('Collective page with euro currency', () => { describe('Budget section', () => { it('Shows latest transactions with amount and type (credit/debit)', () => { scrollToSection(Sections.BUDGET); - cy.get('[data-cy="budget-item"] [data-cy=transaction-amount]') + cy.get('[data-cy="transaction-item"] [data-cy=transaction-amount]') .first() .within($firstTransactionAmount => { - cy.get('[data-cy=transaction-sign]').should('have.text', '-'); - cy.wrap($firstTransactionAmount).contains('€242.00'); + cy.get('[data-cy=transaction-sign]').should('have.text', '+'); + cy.wrap($firstTransactionAmount).contains('€10.00'); }); }); diff --git a/test/cypress/integration/05-user.test.js b/test/cypress/integration/05-user.test.js index 85a2912ee52..261891bc711 100644 --- a/test/cypress/integration/05-user.test.js +++ b/test/cypress/integration/05-user.test.js @@ -43,18 +43,22 @@ describe('New users profiles', () => { }); it('Show transactions with all info and links', () => { - cy.get('[data-cy="budget-item"]:first a[href="/brusselstogether"]').should('exist'); - cy.get('[data-cy="budget-item"]') + cy.get('[data-cy="transaction-item"]:first a[href="/brusselstogether"]').should('exist'); + cy.get('[data-cy="transaction-item"]') .first() .get('[data-cy=transaction-description]') .contains('monthly recurring subscription'); - cy.get('[data-cy="budget-item"]') + cy.get('[data-cy="transaction-item"]') .first() .get('[data-cy=transaction-details] > span[data-cy=transaction-date]') .contains('11/30/2017'); - cy.get('[data-cy="budget-item"]').first().get('[data-cy=transaction-amount] > span').eq(0).contains('-'); - cy.get('[data-cy="budget-item"]').first().get('[data-cy=transaction-amount] > span').eq(1).contains('€10.00'); - cy.get('[data-cy="budget-item"]').first().get('[data-cy=transaction-amount] > span').eq(2).contains('EUR'); + cy.get('[data-cy="transaction-item"]').first().get('[data-cy=transaction-amount] > span').eq(0).contains('-'); + cy.get('[data-cy="transaction-item"]') + .first() + .get('[data-cy=transaction-amount] > span') + .eq(1) + .contains('€10.00'); + cy.get('[data-cy="transaction-item"]').first().get('[data-cy=transaction-amount] > span').eq(2).contains('EUR'); }); }); }); diff --git a/test/cypress/integration/06-host.test.js b/test/cypress/integration/06-host.test.js index 5670eece776..1963d942730 100644 --- a/test/cypress/integration/06-host.test.js +++ b/test/cypress/integration/06-host.test.js @@ -23,11 +23,4 @@ describe('New host page', () => { cy.contains('[data-cy=contributors-grid]', /(pia mancini|Xavier Damma|Open Source Host User)/); }); }); - - describe('Transactions section', () => { - // The rest of the transactions section tests are in `05-user.test.js` - it("Has no filters (because hosts don't create expenses)", () => { - cy.contains('[data-cy~="filter-button"]', 'Expenses').should('not.exist'); - }); - }); });