Merge branch 'main' of https://github.com/DevForce99/fuel-explorer in…

…to feat/account-stats
FuelLabs · Sep 19, 2024 · 285a57a · 285a57a
2 parents c3a0cc9 + de929ab
commit 285a57a
Show file tree

Hide file tree

Showing 44 changed files with 875 additions and 3,612 deletions.
diff --git a/.changeset/soft-forks-hope.md b/.changeset/soft-forks-hope.md
diff --git a/.github/workflows/pr-tests.yml b/.github/workflows/pr-tests.yml
@@ -16,6 +16,7 @@ jobs:
   tests-e2e:
     name: E2E Tests
     runs-on: buildjet-4vcpu-ubuntu-2204
+    timeout-minutes: 15
     steps:
       - name: Checkout
         uses: actions/checkout@v3
@@ -39,6 +40,7 @@ jobs:
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Start Test Node
+        timeout-minutes: 7
         run: pnpm node:start
 
       # E2E tests running with Playwright
@@ -60,6 +62,7 @@ jobs:
   tests-e2e-soft:
     name: E2E Tests Soft
     runs-on: buildjet-4vcpu-ubuntu-2204
+    timeout-minutes: 10
     steps:
       - name: Checkout
         uses: actions/checkout@v3
@@ -83,6 +86,7 @@ jobs:
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Start Test Node
+        timeout-minutes: 7
         run: pnpm node:start
 
       # E2E tests running with Playwright

diff --git a/contracts/predicate/package.json b/contracts/predicate/package.json
@@ -1,5 +1,6 @@
 {
   "name": "predicate",
+  "private": true,
   "version": "0.0.1",
   "description": "Predicate app using Sway",
   "scripts": {

diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml
@@ -13,6 +13,11 @@ services:
       # expose the service to the host for integration testing
       - 8545:9545
       - ${DEPLOYMENTS_PORT:-8080}:8081
+    healthcheck:
+      test: "curl -f -H \"Content-Type: application/json\" -d '{\"jsonrpc\":\"2.0\",\"id\":0,\"method\":\"net_version\",\"params\":[]}' http://localhost:9545 || exit 1"
+      interval: 5s
+      timeout: 2s
+      retries: 10000
     networks:
       - app-network
 
@@ -24,7 +29,7 @@ services:
     platform: linux/amd64
     depends_on:
       l1_chain:
-        condition: service_started
+        condition: service_healthy
     build:
       context: ./fuel-core/
     environment:
@@ -35,9 +40,9 @@ services:
       - ${FUEL_CORE_HTTP_PORT:-4000}:4001
     healthcheck:
       test: curl --fail http://localhost:4001/v1/health || exit 1
-      interval: 10s
-      timeout: 10s
-      retries: 100
+      interval: 4s
+      timeout: 3s
+      retries: 200
     networks:
       - app-network
 

diff --git a/docker/erc20-deployer/deployer/package.json b/docker/erc20-deployer/deployer/package.json
@@ -1,5 +1,6 @@
 {
   "name": "erc20-deployer",
+  "private": true,
   "scripts": {
     "start": "ts-node ./src/index.ts"
   },

diff --git a/docker/fuel-core/Dockerfile b/docker/fuel-core/Dockerfile
@@ -14,9 +14,12 @@ WORKDIR /fuel
 
 COPY ./genesis_coins.json .
 
+#  Fuel Core 0.35.0, needs to be changed when core version is updated
 RUN git clone \
     https://github.com/FuelLabs/chain-configuration.git \
-    /chain-configuration
+    /chain-configuration && \
+    cd /chain-configuration && \
+    git checkout 6cea45da59bb105a02fb0b115c7ef03f3a690ba1
 
 # Copy the base local configuration
 RUN cp -R /chain-configuration/local/* ./

diff --git a/helm/fuel-explorer/Chart.yaml b/helm/fuel-explorer/Chart.yaml
@@ -15,7 +15,7 @@ type: application
 # This is the chart version. This version number should be incremented each time you make changes
 # to the chart and its templates, including the app version.
 # Versions are expected to follow Semantic Versioning (https://semver.org/)
-version: 0.1.11
+version: 0.1.12
 
 # This is the version number of the application being deployed. This version number should be
 # incremented each time you make changes to the application. Versions are not expected to

diff --git a/helm/fuel-explorer/templates/servicemonitor.yaml b/helm/fuel-explorer/templates/servicemonitor.yaml
@@ -0,0 +1,15 @@
+{{- if .Values.app.serviceMonitor.enabled }}
+apiVersion: monitoring.coreos.com/v1
+kind: ServiceMonitor
+metadata:
+  name: {{ include "fuel-explorer.fullname" . }}
+  labels:
+    release: {{ .Values.app.serviceMonitor.prometheusRelease }}
+spec:
+  selector:
+    matchLabels:
+      {{- include "fuel-explorer.labels" . | nindent 4 }}
+  endpoints:
+    - path: /metrics
+      port: http
+{{- end }}
diff --git a/helm/fuel-explorer/values.yaml b/helm/fuel-explorer/values.yaml
@@ -83,3 +83,8 @@ nodeSelector: {}
 tolerations: []
 
 affinity: {}
+
+app:
+  serviceMonitor:
+    enabled: true
+    prometheusRelease: kube-prometheus
diff --git a/packages/app-explorer/src/systems/Asset/components/AssetItem/AssetItem.tsx b/packages/app-explorer/src/systems/Asset/components/AssetItem/AssetItem.tsx
@@ -1,5 +1,6 @@
 import type { HStackProps } from '@fuels/ui';
 import {
+  Address,
   Box,
   Copyable,
   Flex,
@@ -8,11 +9,12 @@ import {
   LoadingWrapper,
   Text,
   Tooltip,
-  shortAddress,
+  useBreakpoints,
 } from '@fuels/ui';
 import Image from 'next/image';
 import { TxIcon } from '~/systems/Transaction/component/TxIcon/TxIcon';
 
+import type { TxIconType } from '~/systems/Transaction/types';
 import { useAsset } from '../../hooks/useAsset';
 
 const ICON_SIZE = 38;
@@ -21,16 +23,19 @@ type AssetItemProps = HStackProps & {
   assetId: string;
   prefix?: string;
   isLoading?: boolean;
+  txIconTypeFallback?: TxIconType;
 };
 
 export function AssetItem({
   prefix,
   assetId,
   children,
   isLoading,
+  txIconTypeFallback,
   ...props
 }: AssetItemProps) {
   const asset = useAsset(assetId);
+  const { isMobile } = useBreakpoints();
   return (
     <HStack {...props} align="center">
       <LoadingWrapper
@@ -47,17 +52,21 @@ export function AssetItem({
               />
             </Flex>
           ) : (
-            <TxIcon type="Mint" status="Submitted" />
+            <TxIcon type={txIconTypeFallback || 'Mint'} status="Submitted" />
           )
         }
       />
-      <Box>
+      <Box className="flex flex-col">
         <LoadingWrapper
           isLoading={isLoading}
           loadingEl={<LoadingBox className="w-40 h-6" />}
           regularEl={
-            <HStack gap="2">
-              {prefix && <Text className="font-medium">{prefix}</Text>}
+            <HStack gap="1" className="items-center">
+              {prefix && (
+                <Text className="font-normal text-sm text-secondary font-mono">
+                  {prefix}
+                </Text>
+              )}
               {asset?.symbol ? (
                 <Tooltip content={assetId}>
                   <Copyable value={assetId}>
@@ -69,9 +78,13 @@ export function AssetItem({
                 </Tooltip>
               ) : (
                 <Tooltip content={assetId}>
-                  <Copyable value={assetId} className="text-gray-11 font-mono">
-                    {shortAddress(assetId)}
-                  </Copyable>
+                  <Address
+                    value={assetId}
+                    className="text-gray-11 font-mono"
+                    addressOpts={
+                      isMobile ? { trimLeft: 4, trimRight: 2 } : undefined
+                    }
+                  />
                 </Tooltip>
               )}
             </HStack>

diff --git a/packages/app-explorer/src/systems/Core/components/Amount/Amount.tsx b/packages/app-explorer/src/systems/Core/components/Amount/Amount.tsx
@@ -10,13 +10,21 @@ import { useFuelAsset } from '~/systems/Asset/hooks/useFuelAsset';
 import { cx } from '../../utils/cx';
 import { formatZeroUnits } from '../../utils/format';
 
-type AmountProps = BaseProps<{
-  value?: BN | null;
-  assetId?: string | null;
-  hideIcon?: boolean;
-  hideSymbol?: boolean;
-  iconSize?: number;
-}>;
+type AmountProps =
+  | BaseProps<{
+      value?: BN | null;
+      assetId?: string | null;
+      hideIcon?: boolean;
+      hideSymbol?: boolean;
+      iconSize?: number;
+    }>
+  | BaseProps<{
+      value?: BN | null;
+      assetId?: never | null;
+      hideIcon?: never | true;
+      hideSymbol?: never | true;
+      iconSize?: never;
+    }>;
 
 export function Amount({
   value,

diff --git a/packages/app-explorer/src/systems/Core/components/Search/SearchInput.tsx b/packages/app-explorer/src/systems/Core/components/Search/SearchInput.tsx
@@ -105,24 +105,32 @@ const SearchResultDropdown = forwardRef<HTMLDivElement, SearchDropdownProps>(
                       )}
                     </Link>
                   </Dropdown.Item>
-                  <Dropdown.Separator />
-                  <Dropdown.Label>Recent Transactions</Dropdown.Label>
-                  {searchResult.account.transactions?.map((transaction) => {
-                    return (
-                      <Dropdown.Item
-                        key={transaction?.id}
-                        className={classes.dropdownItem()}
-                      >
-                        <Link
-                          as={NextLink}
-                          href={Routes.txSimple(transaction?.id!)}
-                          onClick={onSelectItem}
-                        >
-                          {shortAddress(transaction?.id || '', trimL, trimR)}
-                        </Link>
-                      </Dropdown.Item>
-                    );
-                  })}
+                  {!!searchResult.account.transactions?.length && (
+                    <>
+                      <Dropdown.Separator />
+                      <Dropdown.Label>Recent Transactions</Dropdown.Label>
+                      {searchResult.account.transactions?.map((transaction) => {
+                        return (
+                          <Dropdown.Item
+                            key={transaction?.id}
+                            className={classes.dropdownItem()}
+                          >
+                            <Link
+                              as={NextLink}
+                              href={Routes.txSimple(transaction?.id!)}
+                              onClick={onSelectItem}
+                            >
+                              {shortAddress(
+                                transaction?.id || '',
+                                trimL,
+                                trimR,
+                              )}
+                            </Link>
+                          </Dropdown.Item>
+                        );
+                      })}
+                    </>
+                  )}
                 </>
               )}
               {searchResult?.block && (

diff --git a/packages/app-explorer/src/systems/Transaction/component/TxIcon/TxIcon.tsx b/packages/app-explorer/src/systems/Transaction/component/TxIcon/TxIcon.tsx
@@ -46,7 +46,7 @@ export const TX_STATUS_MAP: Record<TxStatus, string> = {
 
 type TxIconProps = VariantProps<typeof styles> &
   BaseProps<{
-    type: string;
+    type: TxIconType;
     status?: TxStatus;
     color?: BadgeProps['color'];
     label?: string;

diff --git a/packages/app-explorer/src/systems/Transaction/component/TxInput/TxInputCoin/TxInputCoin.tsx b/packages/app-explorer/src/systems/Transaction/component/TxInput/TxInputCoin/TxInputCoin.tsx
@@ -35,14 +35,18 @@ export const TxInputCoin = createComponent<
           <Flex className="flex flex-col items-center tablet:flex-row gap-2 w-full">
             <Badge
               color="gray"
-              className="font-mono justify-start tablet:justify-center hidden tablet:flex tablet:min-w-[70px] tablet:w-[70px] tablet:max-w-[70px] items-center"
+              className="font-mono ml-14 tablet:ml-0 self-start tablet:self-center justify-center flex min-w-[70px] w-[70px] max-w-[70px] items-center"
               size="1"
             >
               COIN
             </Badge>
 
             <Flex className="w-full items-start tablet:items-center flex flex-col tablet:flex-row gap-2 tablet:gap-4">
-              <AssetItem assetId={assetId} className="flex-1">
+              <AssetItem
+                assetId={assetId}
+                className="flex-1 text-sm"
+                prefix="Asset:"
+              >
                 <Address
                   prefix="From:"
                   value={input.owner || ''}
@@ -58,13 +62,6 @@ export const TxInputCoin = createComponent<
               </AssetItem>
               {amount && (
                 <Box className="w-full tablet:w-auto tablet:ml-0 justify-between flex flex-row tablet:block pl-14">
-                  <Badge
-                    color="gray"
-                    className="font-mono tablet:hidden min-w-[70px] w-[70px] max-w-[70px] items-center justify-center"
-                    size="1"
-                  >
-                    COIN
-                  </Badge>
                   <Amount
                     hideIcon
                     hideSymbol

diff --git a/...pp-explorer/src/systems/Transaction/component/TxInput/TxInputContract/TxInputContract.tsx b/...pp-explorer/src/systems/Transaction/component/TxInput/TxInputContract/TxInputContract.tsx
@@ -31,7 +31,7 @@ export const TxInputContract = createComponent<
     return (
       <Collapsible {...props}>
         <Collapsible.Header>
-          <Flex className="flex flex-col-reverse items-start  tablet:items-center tablet:flex-row gap-2 w-full">
+          <Flex className="flex flex-col items-start  tablet:items-center tablet:flex-row gap-2 w-full">
             <Badge
               color="gray"
               className="font-mono justify-center ml-14 tablet:ml-0 tablet:flex min-w-[70px] w-[70px] max-w-[70px] items-center"
@@ -42,9 +42,6 @@ export const TxInputContract = createComponent<
             <HStack className="items-center justify-center gap-4">
               <TxIcon type="ContractCall" status="Submitted" />
               <VStack className="flex-1" gap="0">
-                <Text className="flex items-center gap-2 text-md">
-                  Contract
-                </Text>
                 <Address
                   prefix="Address:"
                   value={contractId}
@@ -57,6 +54,18 @@ export const TxInputContract = createComponent<
                     href: Routes.contractAssets(contractId),
                   }}
                 />
+                <Address
+                  prefix="Utxo Id:"
+                  value={utxoId}
+                  className="text-white"
+                  addressOpts={
+                    isMobile ? { trimLeft: 4, trimRight: 2 } : undefined
+                  }
+                  linkProps={{
+                    as: NextLink,
+                    href: Routes.txSimple(utxoId?.slice(0, -4)),
+                  }}
+                />
               </VStack>
             </HStack>
           </Flex>