feat(rollups): Add input's payload information (Root Payload)

apps/rollups/__tests__/containers/rollups/DApp.test.tsx

@@ -11,19 +11,17 @@ import { CombinedError } from '@urql/core';
 import { Provider, createClient } from 'urql';
 import {
     DApp,
-    EpochItem,
     InputContent,
-    Inputs,
     hexToJSON,
     transformPayload,
 } from '../../../src/containers/rollups/DApp';
 import {
+    PageInfo,
     useDappQuery,
     useInputEdgeQuery,
-    PageInfo,
-} from '../../../src/generated/graphql/rollups/0.9';
+} from '../../../src/generated/graphql/rollups/1.0';
 import { withChakraTheme } from '../../test-utilities';
-const path = '../../../src/generated/graphql/rollups/0.9';
+const path = '../../../src/generated/graphql/rollups/1.0';
 jest.mock(path, () => {
     const originalModule = jest.requireActual(path);
     return {
@@ -73,13 +71,13 @@ const inputContentProps = {
     label: 'Input content label',
 };
 
-const InputsComponent = withChakraTheme(Inputs);
 const edge = {
     cursor: '2',
     node: {
         id: '1',
         index: 0,
         msgSender: '0x912d9dfa80c617e5e9ef4f43eca01a05cc2123e1',
+        payload: PAYLOAD_STRING,
         timestamp: new Date().getTime() / 1000,
         blockNumber: 7704915,
         notices: {
@@ -141,29 +139,6 @@ const edge = {
         },
     },
 };
-const inputItems = [edge, edge];
-const inputsProps = {
-    inputs: inputItems,
-    count: inputItems.length,
-};
-
-const EpochItemComponent = withChakraTheme(EpochItem);
-const epochItemProps = {
-    item: {
-        id: '1',
-        index: 0,
-        inputs: {
-            totalCount: 0,
-            pageInfo: {
-                startCursor: '',
-                endCursor: '',
-                hasNextPage: false,
-                hasPreviousPage: false,
-            },
-            edges: [edge],
-        },
-    },
-};
 
 describe('DApp container', () => {
     describe('DApp component', () => {
@@ -279,6 +254,24 @@ describe('DApp container', () => {
             ).toBeInTheDocument();
         });
 
+        it('should not display internal paging when it is disabled', async () => {
+            render(
+                <InputContentComponent
+                    items={[inputContentItems[0]]}
+                    label="Payload"
+                    showPagination={false}
+                />
+            );
+
+            expect(screen.getByText('Payload')).toBeInTheDocument();
+            expect(
+                screen.queryByTestId('input-content-position')
+            ).not.toBeInTheDocument();
+            expect(screen.queryByText('PREV')).not.toBeInTheDocument();
+            expect(screen.queryByText('NEXT')).not.toBeInTheDocument();
+            expect(screen.queryByText('Total 1')).not.toBeInTheDocument();
+        });
+
         it('should display items count', () => {
             render(<InputContentComponent {...inputContentProps} />);
 
@@ -384,100 +377,6 @@ describe('DApp container', () => {
         });
     });
 
-    describe('EpochItem component', () => {
-        it('should display epoch position', () => {
-            render(<EpochItemComponent {...epochItemProps} />);
-
-            expect(
-                screen.getByText(`Epoch ${epochItemProps.item.index + 1}`)
-            ).toBeInTheDocument();
-        });
-    });
-    describe('Inputs component', () => {
-        it('should display items count', () => {
-            render(<InputsComponent {...inputsProps} />);
-
-            expect(
-                screen.getByText(`Total ${inputsProps.count}`)
-            ).toBeInTheDocument();
-        });
-
-        it('should increase position when next position exists', async () => {
-            render(<InputsComponent {...inputsProps} />);
-
-            const nextButton = screen.getByTestId('inputs-next-button');
-
-            await act(() => {
-                fireEvent.click(nextButton);
-            });
-
-            await waitFor(() =>
-                expect(screen.getByTestId('inputs-position').innerHTML).toBe(
-                    '2'
-                )
-            );
-        });
-
-        it('should not increase position when next position does not exist', async () => {
-            render(<InputsComponent {...inputsProps} count={1} />);
-
-            const nextButton = screen.getByTestId('inputs-next-button');
-
-            await act(() => {
-                fireEvent.click(nextButton);
-            });
-
-            await waitFor(() =>
-                expect(screen.getByTestId('inputs-position').innerHTML).toBe(
-                    '1'
-                )
-            );
-        });
-
-        it('should decrease position when previous position exists', async () => {
-            render(<InputsComponent {...inputsProps} />);
-
-            const nextButton = screen.getByTestId('inputs-next-button');
-
-            await act(() => {
-                fireEvent.click(nextButton);
-            });
-
-            await waitFor(() =>
-                expect(screen.getByTestId('inputs-position').innerHTML).toBe(
-                    '2'
-                )
-            );
-            const prevButton = screen.getByTestId('inputs-prev-button');
-
-            await act(() => {
-                fireEvent.click(prevButton);
-            });
-
-            await waitFor(() =>
-                expect(screen.getByTestId('inputs-position').innerHTML).toBe(
-                    '1'
-                )
-            );
-        });
-
-        it('should not decrease position when previous position does not exist', async () => {
-            render(<InputsComponent {...inputsProps} />);
-
-            const prevButton = screen.getByTestId('inputs-prev-button');
-
-            await act(() => {
-                fireEvent.click(prevButton);
-            });
-
-            await waitFor(() =>
-                expect(screen.getByTestId('inputs-position').innerHTML).toBe(
-                    '1'
-                )
-            );
-        });
-    });
-
     describe('utils', () => {
         it('should return the converted payload as true', () => {
             expect(hexToJSON(PAYLOAD_JSON)).toBeTruthy();

apps/rollups/__tests__/containers/rollups/LocalDApps.test.tsx

@@ -11,12 +11,12 @@
 
 import { act, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { withChakraTheme } from '../../test-utilities';
 import {
     DappsSummary,
     LocalDAppList,
 } from '../../../src/containers/rollups/LocalDApps';
 import { useApplications } from '../../../src/services/useApplications';
+import { withChakraTheme } from '../../test-utilities';
 
 const path = '../../../src/services/useApplications';
 jest.mock(path, () => {
@@ -134,7 +134,7 @@ describe('LocalDApps container', () => {
             const errorMessage = 'Error XYZ';
             const applications = [
                 {
-                    factoryVersion: '0.9',
+                    factoryVersion: '1.0',
                     address: 'some-address',
                     inputs: [],
                     deploymentTimestamp: new Date().getTime() / 1000,

apps/rollups/__tests__/services/useApplications.test.tsx

@@ -134,7 +134,7 @@ describe('useApplications Hook', () => {
         expect(isDeploymentCalled).toBe(true);
     });
 
-    it('should retrieve DApp (v0.9) information directly from smartcontract', async () => {
+    it('should retrieve DApp (v1.0) information directly from smartcontract', async () => {
         const factory = buildUseRollupFactoryReturn();
         factory.queryFilter = jest.fn(() =>
             Promise.resolve<any>([buildApplicationCreatedEvent()])
@@ -150,7 +150,7 @@ describe('useApplications Hook', () => {
         expect(result.current.applications).toHaveLength(1);
         expect(result.current.applications[0]).toHaveProperty(
             'factoryVersion',
-            '0.9'
+            '1.0'
         );
         expect(result.current.applications[0]).toHaveProperty(
             'address',

apps/rollups/codegen.yml

@@ -8,11 +8,11 @@ generates:
             - typescript
             - typescript-operations
             - typescript-urql
-    ./src/generated/graphql/rollups/0.9/index.ts:
+    ./src/generated/graphql/rollups/1.0/index.ts:
         schema:
-            - ./graphql/schema/0.9/schema.graphql
+            - ./graphql/schema/1.0/schema.graphql
         documents:
-            - ./graphql/documents/0.9/queries.graphql
+            - ./graphql/documents/1.0/queries.graphql
         plugins:
             - typescript
             - typescript-operations

apps/rollups/graphql/documents/0.9/queries.graphql → apps/rollups/graphql/documents/1.0/queries.graphql

@@ -4,6 +4,9 @@ query inputEdge {
             cursor
             node {
                 index
+                payload
+                msgSender
+                timestamp
                 notices {
                     totalCount
                     pageInfo {

apps/rollups/graphql/mock/server.ts

@@ -6,7 +6,7 @@ import { createServer } from 'node:http';
 import { join } from 'path';
 import { BigInt, Float, Int, String } from './custom-scalars';
 const typeDefs = readFileSync(
-    join(process.cwd(), 'graphql/schema/0.9/schema.graphql'),
+    join(process.cwd(), 'graphql/schema/1.0/schema.graphql'),
     {
         encoding: 'utf-8',
     }