Fix pointInBlock observed

Also: - removed unnecessary header type - sort the heads table based on block number - set pulling /heads data on by default - add links to sancho.cexplorer
cardano-scaling · Mar 7, 2024 · 16e23b8 · 16e23b8
1 parent 8cc2181
commit 16e23b8
Show file tree

Hide file tree

Showing 8 changed files with 58 additions and 33 deletions.
diff --git a/hydra-chain-observer/src/Hydra/ChainObserver.hs b/hydra-chain-observer/src/Hydra/ChainObserver.hs
@@ -25,6 +25,7 @@ import Hydra.Cardano.Api (
   chainTipToChainPoint,
   connectToLocalNode,
   convertTx,
+  getChainPoint,
   getTxBody,
   getTxId,
  )
@@ -175,20 +176,20 @@ chainSyncClient tracer networkId startingPoint observerHandler =
                 BlockInMode BabbageEra (Block _header babbageTxs) -> babbageTxs
                 _ -> []
 
-              (BlockInMode _ (Block (BlockHeader _ _ blockNo) _)) = blockInMode
-              point = chainTipToChainPoint tip
+              (BlockInMode _ (Block bh@(BlockHeader _ _ blockNo) _)) = blockInMode
+              pointInBlock = getChainPoint bh
           traceWith
             tracer
             RollForward
-              { point
+              { point = chainTipToChainPoint tip
               , receivedTxIds = getTxId . getTxBody <$> txs
               }
           let (utxo', observations) = observeAll networkId utxo txs
               onChainTxs = mapMaybe convertObservation observations
           forM_ onChainTxs (traceWith tracer . logOnChainTx)
-          let observationsAt = HeadObservation point blockNo <$> onChainTxs
+          let observationsAt = HeadObservation pointInBlock blockNo <$> onChainTxs
           if null observationsAt
-            then observerHandler [Tick point blockNo]
+            then observerHandler [Tick pointInBlock blockNo]
             else observerHandler observationsAt
           observerHandler observationsAt
           pure $ clientStIdle utxo'

diff --git a/hydra-explorer/src/Hydra/Explorer.hs b/hydra-explorer/src/Hydra/Explorer.hs
@@ -26,24 +26,20 @@ type CorsHeaders =
   , Header "Access-Control-Allow-Headers" String
   ]
 
--- REVIEW: maybe rename
-type GetHeadsHeaders :: [Type]
-type GetHeadsHeaders = Header "Accept" String ': CorsHeaders
-
 type API :: Type
 type API =
   "heads"
     :> Get
         '[JSON]
         ( Headers
-            GetHeadsHeaders
+            CorsHeaders
             [HeadState]
         )
     :<|> "tick"
       :> Get
           '[JSON]
           ( Headers
-              GetHeadsHeaders
+              CorsHeaders
               TickState
           )
     :<|> Raw
@@ -61,32 +57,30 @@ server ::
   forall (m :: Type -> Type).
   GetHeads ->
   GetTick ->
-  Handler (Headers GetHeadsHeaders [HeadState])
-    :<|> Handler (Headers GetHeadsHeaders TickState)
+  Handler (Headers CorsHeaders [HeadState])
+    :<|> Handler (Headers CorsHeaders TickState)
     :<|> Tagged m Application
 server getHeads getTick =
-  handleGetHeads getHeads
-    :<|> handleGetTick getTick
+  (addCorsHeaders <$> handleGetHeads getHeads)
+    :<|> (addCorsHeaders <$> handleGetTick getTick)
     :<|> serveDirectoryFileServer "static"
 
 handleGetHeads ::
   GetHeads ->
-  Handler (Headers GetHeadsHeaders [HeadState])
+  Handler [HeadState]
 handleGetHeads getHeads = do
   result <- liftIO $ try getHeads
   case result of
-    Right heads -> do
-      return $ addHeader "application/json" $ addCorsHeaders heads
+    Right heads -> return heads
     Left (_ :: SomeException) -> throwError err500
 
 handleGetTick ::
   GetTick ->
-  Handler (Headers GetHeadsHeaders TickState)
+  Handler TickState
 handleGetTick getTick = do
   result <- liftIO $ try getTick
   case result of
-    Right tick -> do
-      return $ addHeader "application/json" $ addCorsHeaders tick
+    Right tick -> return tick
     Left (_ :: SomeException) -> throwError err500
 
 logMiddleware :: Tracer IO APIServerLog -> Middleware

diff --git a/hydra-explorer/test/Hydra/ExplorerSpec.hs b/hydra-explorer/test/Hydra/ExplorerSpec.hs
@@ -56,7 +56,7 @@ apiServerSpec = do
               liftIO $ headsSchema `shouldNotBe` mempty
               SResponse{simpleStatus, simpleHeaders, simpleBody} <- Wai.get "/heads"
               liftIO $ statusCode simpleStatus `shouldBe` 200
-              liftIO $ simpleHeaders `shouldContain` [("Accept", "application/json")]
+              liftIO $ simpleHeaders `shouldContain` [("Content-Type", "application/json")]
               case Aeson.eitherDecode simpleBody of
                 Left err -> liftIO . failure $ "Failed to decode body: " <> err
                 Right value ->
@@ -83,7 +83,7 @@ apiServerSpec = do
               liftIO $ tickSchema `shouldNotBe` mempty
               SResponse{simpleStatus, simpleHeaders, simpleBody} <- Wai.get "/tick"
               liftIO $ statusCode simpleStatus `shouldBe` 200
-              liftIO $ simpleHeaders `shouldContain` [("Accept", "application/json")]
+              liftIO $ simpleHeaders `shouldContain` [("Content-Type", "application/json")]
               case Aeson.eitherDecode simpleBody of
                 Left err -> liftIO . failure $ "Failed to decode body: " <> err
                 Right value ->

diff --git a/hydra-explorer/web/src/components/HeadDetails/index.tsx b/hydra-explorer/web/src/components/HeadDetails/index.tsx
@@ -49,11 +49,19 @@ const HeadDetails: React.FC<HeadDetailsProps> = ({ head, onClose }) => {
                 <div className="grid grid-cols-2 gap-4">
                     <div className="border p-4">
                         <h3 className="text-lg font-semibold mb-2">Head ID</h3>
-                        <p>{head.headId}</p>
+                        <p>
+                            <a href={`https://sancho.cexplorer.io/policy/${head.headId}/mint`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                {head.headId}
+                            </a>
+                        </p>
                     </div>
                     <div className="border p-4">
                         <h3 className="text-lg font-semibold mb-2">Seed Tx In</h3>
-                        <p>{head.seedTxIn}</p>
+                        <p>
+                            <a href={`https://sancho.cexplorer.io/tx/${head.seedTxIn}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                {head.seedTxIn}
+                            </a>
+                        </p>
                     </div>
                     <div className="border p-4">
                         <h3 className="text-lg font-semibold mb-2">Status</h3>
@@ -78,7 +86,9 @@ const HeadDetails: React.FC<HeadDetailsProps> = ({ head, onClose }) => {
                     <div className="border p-4">
                         <h3 className="text-lg font-semibold mb-2">Point</h3>
                         <p>
-                            Block Hash: {head.point.blockHash} <br />
+                            Block Hash: <a href={`https://sancho.cexplorer.io/block/${head.point.blockHash}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                {head.point.blockHash}
+                            </a> <br />
                             Slot: {head.point.slot}
                         </p>
                     </div>

diff --git a/hydra-explorer/web/src/components/HeadsTable/index.tsx b/hydra-explorer/web/src/components/HeadsTable/index.tsx
@@ -33,13 +33,21 @@ const HeadsTable: React.FC = () => {
                             </tr>
                         </thead>
                         <tbody>
-                            {heads?.map((head, index) => (
+                            {heads?.sort((a, b) => b.blockNo - a.blockNo).map((head, index) => (
                                 <tr key={index} className={`${index % 2 === 0 ? 'bg-gray-700' : 'bg-gray-600'}`}>
-                                    <td className="truncate text-center border px-4 py-2">{head.headId}</td>
+                                    <td className="truncate text-center border px-4 py-2">
+                                        <a href={`https://sancho.cexplorer.io/policy/${head.headId}/mint`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                            {head.headId}
+                                        </a>
+                                    </td>
                                     <td className="truncate text-center border px-4 py-2">{head.status}</td>
                                     <td className="truncate text-center border px-4 py-2">{head.point.slot}</td>
                                     <td className="truncate text-center border px-4 py-2">{head.blockNo}</td>
-                                    <td className="truncate text-center border px-4 py-2">{head.point.blockHash}</td>
+                                    <td className="truncate text-center border px-4 py-2">
+                                        <a href={`https://sancho.cexplorer.io/block/${head.point.blockHash}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                            {head.point.blockHash}
+                                        </a>
+                                    </td>
                                     <td className="truncate text-center border px-4 py-2">{totalLovelaceValueLocked(head) / 1000000} ₳</td>
                                     <td className="text-center border px-4 py-2">
                                         <button

diff --git a/hydra-explorer/web/src/components/MemberCommitDetails/index.tsx b/hydra-explorer/web/src/components/MemberCommitDetails/index.tsx
@@ -46,8 +46,16 @@ const MemberCommitDetails: React.FC<MemberCommitDetailsProps> = ({ member, onClo
               {member.commits &&
                 Object.entries(member.commits).map(([commitId, commit], index) => (
                   <tr key={index} className={`${index % 2 === 0 ? 'bg-gray-700' : 'bg-gray-600'}`}>
-                    <td className="truncate text-center border px-4 py-2">{commitId}</td>
-                    <td className="truncate text-center border px-4 py-2">{commit.address}</td>
+                    <td className="truncate text-center border px-4 py-2">
+                      <a href={`https://sancho.cexplorer.io/tx/${commitId}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                        {commitId}
+                      </a>
+                    </td>
+                    <td className="truncate text-center border px-4 py-2">
+                      <a href={`https://sancho.cexplorer.io/address/${commit.address}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                        {commit.address}
+                      </a>
+                    </td>
                     <td className="truncate text-center border px-4 py-2">{commit.value.lovelace / 1000000} ₳</td>
                   </tr>
                 ))}

diff --git a/hydra-explorer/web/src/components/TickBox/index.tsx b/hydra-explorer/web/src/components/TickBox/index.tsx
@@ -32,7 +32,11 @@ const TickBox = () => {
                             {tick ? (
                                 <tr>
                                     <td className="truncate text-center border px-4 py-2">{tick?.blockNo}</td>
-                                    <td className="truncate text-center border px-4 py-2">{tick?.point.blockHash}</td>
+                                    <td className="truncate text-center border px-4 py-2">
+                                        <a href={`https://sancho.cexplorer.io/block/${tick?.point.blockHash}`} target="_blank" className="text-blue-300 hover:text-blue-500">
+                                            {tick?.point.blockHash}
+                                        </a>
+                                    </td>
                                     <td className="truncate text-center border px-4 py-2">{tick?.point.slot}</td>
                                 </tr>
                             ) : null}

diff --git a/hydra-explorer/web/src/providers/IntervalProvider/index.tsx b/hydra-explorer/web/src/providers/IntervalProvider/index.tsx
@@ -18,7 +18,7 @@ const IntervalSettingProvider: React.FC<any> = ({
     children
 }) => {
     const [intervalTime, setIntervalTime] = useState(1000)
-    const [isAutoUpdateOn, setAutoUpdate] = useState(false)
+    const [isAutoUpdateOn, setAutoUpdate] = useState(true)
 
     const handleToggleAutoUpdate = () => {
         setAutoUpdate((prevAutoUpdate) => !prevAutoUpdate)