diff --git a/frontend/src/views/Pages/AccountOverview/GddTransactionList.spec.js b/frontend/src/components/GddTransactionList.spec.js
similarity index 61%
rename from frontend/src/views/Pages/AccountOverview/GddTransactionList.spec.js
rename to frontend/src/components/GddTransactionList.spec.js
index 772a42f5f..01566ef13 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTransactionList.spec.js
+++ b/frontend/src/components/GddTransactionList.spec.js
@@ -52,7 +52,7 @@ describe('GddTransactionList', () => {
beforeEach(async () => {
await wrapper.setProps({
transactions: [],
- transactionCount: 0,
+ count: 0,
})
})
it('Transactions Array is empty, 0 transactions', () => {
@@ -64,7 +64,7 @@ describe('GddTransactionList', () => {
beforeEach(async () => {
await wrapper.setProps({
transactions: [],
- transactionCount: -1,
+ count: -1,
})
})
it('renders text saying that there are error.empty-transactionlist ', () => {
@@ -88,113 +88,220 @@ describe('GddTransactionList', () => {
describe('with transactions', () => {
beforeEach(async () => {
+ const decayStartBlock = new Date(2001, 8, 9)
await wrapper.setProps({
transactions: [
{
- balance: 19.93,
- date: '2021-05-25T17:38:13+00:00',
- memo: 'Alles Gute zum Geburtstag',
- name: 'Bob der Baumeister',
- transaction_id: 29,
- type: 'send',
- decay: { balance: '0.5' },
+ id: -1,
+ typeId: 'DECAY',
+ amount: '-0.16778637075575395772595',
+ balance: '31.59320453982945549519405',
+ balanceDate: '2022-03-03T08:54:54.020Z',
+ memo: '',
+ linkedUser: null,
+ decay: {
+ decay: '-0.16778637075575395772595',
+ start: '2022-02-28T13:55:47.000Z',
+ end: '2022-03-03T08:54:54.020Z',
+ duration: 241147.02,
+ },
},
{
- balance: 1000,
- date: '2021-04-29T15:34:49+00:00',
- memo: 'Gut das du da bist!',
- name: 'Gradido Akademie',
- transaction_id: 3,
- type: 'creation',
+ id: 9,
+ typeId: 'SEND',
+ amount: '1',
+ balance: '31.76099091058520945292',
+ balanceDate: '2022-02-28T13:55:47.000Z',
+ memo: 'adasd adada',
+ linkedUser: {
+ firstName: 'Bibi',
+ lastName: 'Bloxberg',
+ },
+ decay: {
+ decay: '-0.2038314055482643084',
+ start: '2022-02-25T07:29:26.000Z',
+ end: '2022-02-28T13:55:47.000Z',
+ duration: 282381,
+ },
},
{
- balance: 314.98,
- date: '2021-04-29T17:26:40+00:00',
- memo: 'Für das Fahrrad!',
- name: 'Jan Ulrich',
- transaction_id: 8,
- type: 'receive',
- decay: { balance: '1.5' },
+ id: 8,
+ typeId: 'CREATION',
+ amount: '1000',
+ balance: '32.96482231613347376132',
+ balanceDate: '2022-02-25T07:29:26.000Z',
+ memo: 'asd adada dad',
+ linkedUser: {
+ firstName: 'Gradido',
+ lastName: 'Akademie',
+ },
+ decay: {
+ decay: '-0.03517768386652623868',
+ start: '2022-02-23T10:55:30.000Z',
+ end: '2022-02-25T07:29:26.000Z',
+ duration: 160436,
+ },
},
{
- balance: '1.07',
- type: 'decay',
+ id: 6,
+ typeId: 'RECEIVE',
+ amount: '10',
+ balance: '10',
+ balanceDate: '2022-02-23T10:55:30.000Z',
+ memo: 'asd adaaad adad addad ',
+ linkedUser: {
+ firstName: 'Bibi',
+ lastName: 'Bloxberg',
+ },
+ decay: {
+ decay: '0',
+ start: null,
+ end: null,
+ duration: null,
+ },
},
],
- transactionCount: 12,
+ count: 12,
+ decayStartBlock,
})
})
it('renders 4 transactions', () => {
- expect(wrapper.findAll('div.gdd-transaction-list-item')).toHaveLength(4)
+ expect(wrapper.findAll('div.list-group-item')).toHaveLength(4)
+ })
+
+ describe('decay transactions', () => {
+ let transaction
+ beforeEach(() => {
+ transaction = wrapper.findAll('div.list-group-item').at(0)
+ })
+
+ it('has a bi-caret-down-square icon', () => {
+ expect(transaction.findAll('svg').at(0).classes()).toEqual([
+ 'bi-caret-down-square',
+ 'b-icon',
+ 'bi',
+ 'text-muted',
+ ])
+ })
+
+ it('has a bi-droplet-half icon', () => {
+ expect(transaction.findAll('svg').at(1).classes()).toContain('bi-droplet-half')
+ })
+
+ it('has gradido-global-color-gray color', () => {
+ expect(transaction.findAll('svg').at(1).classes()).toContain('gradido-global-color-gray')
+ })
+
+ it('shows the amount of transaction', () => {
+ expect(transaction.findAll('.gdd-transaction-list-item-amount').at(0).text()).toContain(
+ '0.16778637075575395',
+ )
+ })
+
+ it('shows the name of the receiver', () => {
+ expect(transaction.findAll('.gdd-transaction-list-item-name').at(0).text()).toBe(
+ 'decay.decay_since_last_transaction',
+ )
+ })
})
describe('send transactions', () => {
let transaction
beforeEach(() => {
- transaction = wrapper.findAll('div.gdd-transaction-list-item').at(0)
+ transaction = wrapper.findAll('div.list-group-item').at(1)
+ })
+
+ it('has a bi-caret-down-square icon', () => {
+ expect(transaction.findAll('svg').at(0).classes()).toEqual([
+ 'bi-caret-down-square',
+ 'b-icon',
+ 'bi',
+ 'text-muted',
+ ])
})
it('has a bi-arrow-left-circle icon', () => {
- expect(transaction.find('svg').classes()).toContain('bi-arrow-left-circle')
+ expect(transaction.findAll('svg').at(1).classes()).toContain('bi-arrow-left-circle')
})
it('has text-danger color', () => {
- expect(transaction.find('svg').classes()).toContain('text-danger')
+ expect(transaction.findAll('svg').at(1).classes()).toContain('text-danger')
})
- it('has a minus operator', () => {
+ // operators are renderd by GDD filter
+ it.skip('has a minus operator', () => {
expect(transaction.findAll('.gdd-transaction-list-item-operator').at(0).text()).toContain(
- '−',
+ '-',
)
})
it('shows the amount of transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-item-amount').at(0).text()).toContain(
- '19.93',
+ '1',
)
})
it('shows the name of the receiver', () => {
expect(transaction.findAll('.gdd-transaction-list-item-name').at(0).text()).toContain(
- 'Bob der Baumeister',
+ 'Bibi Bloxberg',
)
})
it('shows the message of the transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-message').at(0).text()).toContain(
- 'Alles Gute zum Geburtstag',
+ 'adasd adada',
)
})
it('shows the date of the transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
- 'Tue May 25 2021',
+ 'Mon Feb 28 2022 13:55:47 GMT+0000 (Coordinated Universal Time)',
)
})
it('shows the decay calculation', () => {
expect(transaction.findAll('div.gdd-transaction-list-item-decay').at(0).text()).toContain(
- '− 0.5',
+ '− 0.2038314055482643084',
)
})
})
describe('creation transactions', () => {
let transaction
+
beforeEach(() => {
- transaction = wrapper.findAll('div.gdd-transaction-list-item').at(1)
+ transaction = wrapper.findAll('div.list-group-item').at(2)
+ })
+
+ it('has a bi-caret-down-square icon', () => {
+ expect(transaction.findAll('svg').at(0).classes()).toEqual([
+ 'bi-caret-down-square',
+ 'b-icon',
+ 'bi',
+ 'text-muted',
+ ])
})
it('has a bi-gift icon', () => {
- expect(transaction.find('svg').classes()).toContain('bi-gift')
+ expect(transaction.findAll('svg').at(1).classes()).toEqual([
+ 'bi-gift',
+ 'gradido-global-color-accent',
+ 'm-mb-1',
+ 'font2em',
+ 'b-icon',
+ 'bi',
+ ])
})
it('has gradido-global-color-accent color', () => {
- expect(transaction.find('svg').classes()).toContain('gradido-global-color-accent')
+ expect(transaction.findAll('svg').at(1).classes()).toContain(
+ 'gradido-global-color-accent',
+ )
})
- it('has a plus operator', () => {
+ // operators are renderd by GDD filter
+ it.skip('has a plus operator', () => {
expect(transaction.findAll('.gdd-transaction-list-item-operator').at(0).text()).toContain(
'+',
)
@@ -214,7 +321,7 @@ describe('GddTransactionList', () => {
it('shows the date of the transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
- 'Thu Apr 29 2021',
+ 'Fri Feb 25 2022 07:29:26 GMT+0000 (Coordinated Universal Time)',
)
})
})
@@ -222,18 +329,35 @@ describe('GddTransactionList', () => {
describe('receive transactions', () => {
let transaction
beforeEach(() => {
- transaction = wrapper.findAll('div.gdd-transaction-list-item').at(2)
+ transaction = wrapper.findAll('div.list-group-item').at(3)
+ })
+
+ it('has a bi-caret-down-square icon', () => {
+ expect(transaction.findAll('svg').at(0).classes()).toEqual([
+ 'bi-caret-down-square',
+ 'b-icon',
+ 'bi',
+ 'text-muted',
+ ])
})
it('has a bi-arrow-right-circle icon', () => {
- expect(transaction.find('svg').classes()).toContain('bi-arrow-right-circle')
+ expect(transaction.findAll('svg').at(1).classes()).toContain('bi-arrow-right-circle')
})
it('has gradido-global-color-accent color', () => {
- expect(transaction.find('svg').classes()).toContain('gradido-global-color-accent')
+ expect(transaction.findAll('svg').at(1).classes()).toEqual([
+ 'bi-arrow-right-circle',
+ 'gradido-global-color-accent',
+ 'm-mb-1',
+ 'font2em',
+ 'b-icon',
+ 'bi',
+ ])
})
- it('has a plus operator', () => {
+ // operators are renderd by GDD filter
+ it.skip('has a plus operator', () => {
expect(transaction.findAll('.gdd-transaction-list-item-operator').at(0).text()).toContain(
'+',
)
@@ -241,99 +365,49 @@ describe('GddTransactionList', () => {
it('shows the amount of transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-item-amount').at(0).text()).toContain(
- '314.98',
+ '10',
)
})
it('shows the name of the recipient', () => {
expect(transaction.findAll('.gdd-transaction-list-item-name').at(0).text()).toContain(
- 'Jan Ulrich',
+ 'Bibi Bloxberg',
)
})
it('shows the message of the transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-message').at(0).text()).toContain(
- 'Für das Fahrrad!',
+ 'asd adaaad adad addad',
)
})
it('shows the date of the transaction', () => {
expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
- 'Thu Apr 29 2021',
+ 'Wed Feb 23 2022 10:55:30 GMT+0000 (Coordinated Universal Time)',
)
})
it('shows the decay calculation', () => {
expect(transaction.findAll('.gdd-transaction-list-item-decay').at(0).text()).toContain(
- '− 1.5',
+ '0',
)
})
})
-
- describe('decay transactions', () => {
- let transaction
- beforeEach(() => {
- transaction = wrapper.findAll('div.gdd-transaction-list-item').at(3)
- })
-
- it('has a bi-droplet-half icon', () => {
- expect(transaction.find('svg').classes()).toContain('bi-droplet-half')
- })
-
- it('has gradido-global-color-gray color', () => {
- expect(transaction.find('svg').classes()).toContain('gradido-global-color-gray')
- })
-
- it('has a minus operator', () => {
- expect(transaction.findAll('.gdd-transaction-list-item-operator').at(0).text()).toContain(
- '−',
- )
- })
-
- it('shows the amount of transaction', () => {
- expect(transaction.findAll('.gdd-transaction-list-item-amount').at(0).text()).toContain(
- '1.07',
- )
- })
-
- it('shows the name of the receiver', () => {
- expect(transaction.findAll('.gdd-transaction-list-item-name').at(0).text()).toBe(
- 'decay.decay_since_last_transaction',
- )
- })
- })
- })
-
- describe('with invalid transaction type', () => {
- beforeEach(async () => {
- await wrapper.setProps({
- transactions: [
- {
- balance: '19.93',
- date: '2021-05-25T17:38:13+00:00',
- memo: 'Alles Gute zum Geburtstag',
- name: 'Bob der Baumeister',
- transaction_id: 29,
- type: 'invalid',
- },
- ],
- })
- })
-
- it('throws an error', () => {
- expect(errorHandler).toHaveBeenCalled()
- })
})
describe('pagination buttons', () => {
const transactions = Array.from({ length: 42 }, (_, idx) => {
return {
- balance: '3.14',
- date: '2021-04-29T17:26:40+00:00',
+ amount: '3.14',
+ balanceDate: '2021-04-29T17:26:40+00:00',
memo: 'Kreiszahl PI',
- name: 'Euklid',
- transaction_id: idx + 1,
- type: 'receive',
+ linkedUser: {
+ firstName: 'Bibi',
+ lastName: 'Bloxberg',
+ __typename: 'User',
+ },
+ id: idx + 1,
+ typeId: 'RECEIVE',
}
})
diff --git a/frontend/src/components/GddTransactionList.vue b/frontend/src/components/GddTransactionList.vue
new file mode 100644
index 000000000..c3f3d4d7e
--- /dev/null
+++ b/frontend/src/components/GddTransactionList.vue
@@ -0,0 +1,115 @@
+
+