Added Heartbeat transaction

package.json

@@ -24,7 +24,7 @@
     "postinstall": "patch-package"
   },
   "dependencies": {
-    "@algorandfoundation/algokit-subscriber": "^2.1.0",
+    "@algorandfoundation/algokit-subscriber": "^2.2.0",
     "@algorandfoundation/algokit-utils": "^7.0.0",
     "@auth0/auth0-react": "^2.2.4",
     "@blockshake/defly-connect": "^1.1.6",
@@ -60,7 +60,7 @@
     "@txnlab/use-wallet": "^3.11.0",
     "@txnlab/use-wallet-react": "^3.11.0",
     "@xstate/react": "^4.1.1",
-    "algosdk": "2.9.0",
+    "algosdk": "2.10.0",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "cmdk": "^1.0.0",
@@ -197,4 +197,4 @@
     "ws@>7.0.0 <7.5.9": "7.5.10",
     "path-to-regexp@>= 0.2.0 <8.0.0": "8.0.0"
   }
-}
+}

src/features/app-interfaces/pages/create-app-interface-page.test.tsx

@@ -17,7 +17,7 @@ import { getByRole } from '@testing-library/react'
 
 describe('create-app-interface', () => {
   const localnet = algorandFixture()
-  beforeEach(localnet.beforeEach, 10e6)
+  beforeEach(localnet.newScope, 10e6)
   afterEach(() => {
     vitest.clearAllMocks()
   })

src/features/applications/components/application-method-definitions.test.tsx

@@ -32,7 +32,7 @@ describe('application-method-definitions', () => {
   const localnet = algorandFixture()
   let appId: ApplicationId
 
-  beforeEach(localnet.beforeEach, 10e6)
+  beforeEach(localnet.newScope, 10e6)
   afterEach(() => {
     vitest.clearAllMocks()
   })

src/features/applications/pages/application-page-localnet.test.tsx

@@ -20,7 +20,7 @@ describe('application-page on localnet', () => {
       vitest.clearAllMocks()
     })
 
-    beforeEach(localnet.beforeEach, 10e6)
+    beforeEach(localnet.newScope, 10e6)
     afterEach(() => {
       vitest.clearAllMocks()
     })

src/features/common/components/badge.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { cva, type VariantProps } from 'class-variance-authority'
 import { cn } from '@/features/common/utils'
-import { CircleDollarSign, SquareArrowRight, Bolt, Snowflake, ShieldCheck, Key, Parentheses } from 'lucide-react'
+import { CircleDollarSign, SquareArrowRight, Bolt, Snowflake, ShieldCheck, Key, Parentheses, HeartPulse } from 'lucide-react'
 import { TransactionType } from '@/features/transactions/models'
 
 const badgeVariants = cva(
@@ -20,6 +20,7 @@ const badgeVariants = cva(
         [TransactionType.AssetFreeze]: 'border-transparent bg-asset-freeze text-primary-foreground',
         [TransactionType.StateProof]: 'border-transparent bg-state-proof text-primary-foreground',
         [TransactionType.KeyReg]: 'border-transparent bg-key-registration text-primary-foreground',
+        [TransactionType.Heartbeat]: 'border-transparent bg-heartbeat text-primary-foreground',
       },
     },
     defaultVariants: {
@@ -40,6 +41,7 @@ const transactionTypeBadgeIcon = new Map([
   [TransactionType.AssetFreeze.toString(), <Snowflake className={iconClasses} />],
   [TransactionType.StateProof.toString(), <ShieldCheck className={iconClasses} />],
   [TransactionType.KeyReg.toString(), <Key className={iconClasses} />],
+  [TransactionType.Heartbeat.toString(), <HeartPulse className={iconClasses} />],
 ])
 
 function Badge({ className, variant, children, ...props }: BadgeProps) {

src/features/transaction-wizard/transaction-wizard-page.test.tsx

@@ -12,7 +12,7 @@ import { groupSendResultsLabel } from './components/group-send-results'
 
 describe('transaction-wizard-page', () => {
   const localnet = algorandFixture()
-  beforeEach(localnet.beforeEach, 10e6)
+  beforeEach(localnet.newScope, 10e6)
   afterEach(() => {
     vitest.clearAllMocks()
   })

src/features/transaction-wizard/utils/transactions-url-search-params.test.tsx

@@ -27,7 +27,7 @@ const renderTxnsWizardPageWithSearchParams = ({ searchParams }: { searchParams:
 
 describe('Render transactions page with search params', () => {
   const localnet = algorandFixture()
-  beforeEach(localnet.beforeEach, 10e6)
+  beforeEach(localnet.newScope, 10e6)
   afterEach(() => {
     vitest.clearAllMocks()
   })

src/features/transactions-graph/components/__snapshots__/heartbeat-transaction-graph.HEARTBEAT1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ.html

@@ -0,0 +1,162 @@
+<div>
+  <div
+    aria-label="Visual representation of transactions"
+    class="w-min bg-card"
+  >
+    <div
+      class="relative grid"
+      style="grid-template-columns: minmax(100px, 100px) repeat(1, 140px);"
+    >
+      <div />
+      <div
+        class="p-2 flex justify-center"
+      >
+        <div
+          class="text-l font-semibold w-full"
+        >
+          <div
+            class="grid text-center"
+          >
+            <div
+              class="flex gap-0.5 items-center justify-center overflow-hidden"
+            >
+              <div
+                class="shrink-0 basis-4"
+              />
+              <div
+                class="flex items-center overflow-hidden"
+              >
+                <a
+                  class="text-primary underline truncate"
+                  href="/localnet/account/HEARTBEATADDRESS123456789ABCDEFGHIJKLMNOPQRSTUVW"
+                >
+                  <abbr
+                    class="tracking-wide"
+                    title="HEARTBEATADDRESS123456789ABCDEFGHIJKLMNOPQRSTUVW"
+                  >
+                    HEAR…TUVW
+                  </abbr>
+                </a>
+              </div>
+              <div
+                class="shrink-0 basis-4"
+              >
+                <div
+                  class="flex size-4 items-center justify-center overflow-hidden rounded-full border border-primary text-[0.6rem] text-primary"
+                >
+                  1
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="relative grid"
+      style="grid-template-columns: minmax(100px, 100px) repeat(1, 140px); grid-template-rows: repeat(1, 40px);"
+    >
+      <div
+        class="absolute left-0"
+      >
+        <div>
+          <div
+            class="p-0"
+          />
+          <div
+            class="p-0"
+            style="height: 40px; width: 140px;"
+          >
+            <div
+              class="grid h-full"
+              style="grid-template-columns: minmax(100px, 100px) repeat(1, 140px); height: 40px;"
+            >
+              <div />
+              <div
+                class="flex justify-center"
+              >
+                <div
+                  class="border h-full border-dashed"
+                  style="border-left-width: 1px;"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="p-0 relative"
+      >
+        <div
+          class="relative h-full p-0 flex items-center px-0"
+          style="margin-left: 0px;"
+        >
+          <div
+            class="inline"
+            style="margin-left: 0px;"
+          >
+            <div
+              class="flex items-center"
+            >
+              <a
+                class="text-primary underline inline"
+                href="/localnet/transaction/HEARTBEAT1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ"
+              >
+                <abbr
+                  class="tracking-wide text-primary"
+                  title="HEARTBEAT1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ"
+                >
+                  HEARTBE…
+                </abbr>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="flex items-center justify-center relative z-10"
+        data-state="closed"
+        style="grid-column-start: 2; grid-column-end: 3;"
+      >
+        <div
+          class="inline-flex relative size-5 items-center justify-center overflow-hidden rounded-full border text-[0.6rem] border-heartbeat bg-card"
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    class="sticky bottom-0 left-full z-50 flex size-0 overflow-visible"
+  >
+    <button
+      class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-transparent hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 absolute bottom-1 right-0 w-32"
+      id="download-transactions-visual"
+    >
+      <svg
+        class="lucide lucide-download mr-2 size-4"
+        fill="none"
+        height="24"
+        stroke="currentColor"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        stroke-width="2"
+        viewBox="0 0 24 24"
+        width="24"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"
+        />
+        <polyline
+          points="7 10 12 15 17 10"
+        />
+        <line
+          x1="12"
+          x2="12"
+          y1="15"
+          y2="3"
+        />
+      </svg>
+      Download
+    </button>
+  </div>
+</div>