Merge pull request #34 from Golem-Base/develop

Develop -> main

Author: kacperzuk-neti

.github/workflows/docker.yaml

@@ -3,8 +3,7 @@ name: Docker
 on:
   push:
     branches: [ main ]
-  pull_request:
-    branches: [ main ]
+    tags: [ 'release-**' ]
 
 jobs:
   build_and_push:

package.json

@@ -54,7 +54,7 @@
     "@chakra-ui/react": "3.15.0",
     "@cloudnouns/kit": "1.1.6",
     "@emotion/react": "11.14.0",
-    "@golembase/l3-indexer-types": "^0.0.3",
+    "@golembase/l3-indexer-types": "^0.0.4",
     "@growthbook/growthbook-react": "0.21.0",
     "@helia/verified-fetch": "2.6.12",
     "@hypelab/sdk-react": "^1.0.0",

public/icons/name.d.ts

@@ -116,6 +116,7 @@
 	| "MUD_menu"
 	| "MUD"
 	| "networks"
+	| "networks/golem-base-logo-black"
 	| "networks/icon-placeholder"
 	| "networks/logo-placeholder"
 	| "nft_shield"

ui/address/AddressEntityOps.tsx

@@ -1,8 +1,10 @@
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import useApiQuery from 'lib/api/useApiQuery';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import EntityOps from 'ui/entityOps/EntityOps';
+import useEntityOpsQuery from 'ui/entityOps/useEntityOpsQuery';
 
 type Props = {
   shouldRender?: boolean;
@@ -12,15 +14,25 @@ type Props = {
 const AddressEntityOps = ({ shouldRender = true, isQueryEnabled = true }: Props) => {
   const router = useRouter();
   const currentAddress = getQueryParamString(router.query.hash);
+  const queryParams = { sender: currentAddress };
+
+  const opsCountQuery = useApiQuery('golemBaseIndexer:operationsCount', {
+    queryOptions: {
+      enabled: isQueryEnabled,
+    },
+    queryParams,
+  });
+
+  const opsQuery = useEntityOpsQuery({ filters: queryParams, enabled: isQueryEnabled });
 
   if (!shouldRender) {
     return null;
   }
 
   return (
     <EntityOps
-      isQueryEnabled={ isQueryEnabled && Boolean(currentAddress) }
-      queryParams={{ sender: currentAddress }}
+      opsQuery={ opsQuery }
+      opsCountQuery={ opsCountQuery }
     />
   );
 };

ui/blocks/BlockEntityOps.pw.tsx

@@ -0,0 +1,37 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import { baseEntityOperation } from 'mocks/operations/entityOps';
+import { expect, test } from 'playwright/lib';
+
+import BlocksEntityOps from './BlockEntityOps';
+
+const BLOCK_HASH = '0x1234567890abcdef1234567890abcdef12345678';
+
+const mockOperationsResponse = {
+  items: [ baseEntityOperation ],
+  next_page_params: null,
+};
+
+test('base view +@mobile', async({ render, mockApiResponse }) => {
+
+  await mockApiResponse('golemBaseIndexer:operations', mockOperationsResponse, {
+    queryParams: { operation: 'CREATE', page_size: '50', block_number_or_hash: BLOCK_HASH },
+  });
+  await mockApiResponse('golemBaseIndexer:operationsCount', {
+    create_count: '1',
+    update_count: '2',
+    extend_count: '3',
+    delete_count: '0',
+  }, {
+    queryParams: { block_number_or_hash: BLOCK_HASH },
+  });
+
+  const component = await render(
+    <Box pt={{ base: '134px', lg: 6 }}>
+      <BlocksEntityOps heightOrHash={ BLOCK_HASH }/>
+    </Box>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});

ui/blocks/BlockEntityOps.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import EntityOps from 'ui/entityOps/EntityOps';
+import useEntityOpsQuery from 'ui/entityOps/useEntityOpsQuery';
+
+type Props = {
+  heightOrHash: string;
+};
+
+const BlockEntityOps = ({ heightOrHash }: Props) => {
+  const queryParams = { block_number_or_hash: heightOrHash };
+
+  const opsQuery = useEntityOpsQuery({ filters: { block_number_or_hash: heightOrHash }, enabled: true });
+  const opsCountQuery = useApiQuery('golemBaseIndexer:operationsCount', {
+    queryOptions: {
+      enabled: true,
+    },
+    queryParams,
+  });
+
+  return (
+    <EntityOps
+      opsQuery={ opsQuery }
+      opsCountQuery={ opsCountQuery }
+    />
+  );
+};
+
+export default BlockEntityOps;

ui/blocks/__screenshots__/BlockEntityOps.pw.tsx_default_base-view-mobile-1.png

@@ -1,18 +1,19 @@
+import type { UseQueryResult } from '@tanstack/react-query';
 import { map } from 'es-toolkit/compat';
 import React from 'react';
 
 import { OperationType } from '@golembase/l3-indexer-types';
-import type { FilterOperationType, GolemBaseIndexerOpsFilters } from 'types/api/golemBaseIndexer';
+import type { FilterOperationType } from 'types/api/golemBaseIndexer';
 
-import useApiQuery from 'lib/api/useApiQuery';
+import type { ResourceError, ResourcePayload } from 'lib/api/resources';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import useIsMounted from 'lib/hooks/useIsMounted';
 import type { TabItemRegular } from 'toolkit/components/AdaptiveTabs';
 import { RoutedTabs } from 'toolkit/components/RoutedTabs';
 import Pagination from 'ui/shared/pagination/Pagination';
+import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
 
 import EntityOpsContent from './EntityOpsContent';
-import useEntityOpsQuery from './useEntityOpsQuery';
 
 const TAB_LIST_PROPS = {
   mt: 1,
@@ -39,22 +40,14 @@ export const ENTITY_OPS_TABS = Object.keys(LABELS).map(operationToTab);
 
 type Props = {
   isQueryEnabled?: boolean;
-  queryParams: Omit<GolemBaseIndexerOpsFilters, 'operation'>;
+  opsQuery: QueryWithPagesResult<'golemBaseIndexer:operations'>;
+  opsCountQuery: UseQueryResult<ResourcePayload<'golemBaseIndexer:operationsCount'>, ResourceError<unknown>>;
 };
 
-const EntityOps = ({ isQueryEnabled = true, queryParams }: Props) => {
+const EntityOps = ({ opsQuery, opsCountQuery }: Props) => {
   const isMounted = useIsMounted();
   const isMobile = useIsMobile();
 
-  const opsCountQuery = useApiQuery('golemBaseIndexer:operationsCount', {
-    queryOptions: {
-      enabled: isQueryEnabled,
-    },
-    queryParams,
-  });
-
-  const opsQuery = useEntityOpsQuery({ filters: queryParams, enabled: isQueryEnabled });
-
   const component = React.useMemo(() => (
     <EntityOpsContent
       pagination={ opsQuery.pagination }

ui/blocks/__screenshots__/BlockEntityOps.pw.tsx_mobile_base-view-mobile-1.png

@@ -29,10 +29,12 @@ export default function useEntityOpsQuery({ enabled, filters }: Props) {
     filters: { operation, page_size: '50', ...filters },
     options: {
       enabled: enabled,
-      placeholderData: generateListStub<'golemBaseIndexer:operations'>(ENTITY_OPERATION, 50, { next_page_params: {
-        page: 2,
-        page_size: 50,
-      } },
+      placeholderData: generateListStub<'golemBaseIndexer:operations'>(ENTITY_OPERATION, 50, {
+        next_page_params: {
+          page: 2,
+          page_size: 50,
+        },
+      },
       ),
     },
   });