#780 | Search bar (part 1) - create basic search UI with address support

[Viterbo]

Fixes #780

Draft: this PR is completely included in the second part: #800

Description

This PR implements a functional search UI that supports address searches. The search bar is now displaying correct results for all categories, but only addresses and transactions are correctly displayed.

Note:
Error handling and adaptation to small resolutions are still missing.

Test Scenarios

• go to home page
• test the following search queries:
  • 0x0190DaB99276dC42Cf5b7340749B59c7c49A840C
    • 1 result
  • 0x0190DaB99276dC42Cf5b7340749B59c7c49A840w
    • no results
  • 0x0190D
    • multiple category results
    • resize the browser to a small height to be able to test auto-scroll by pressing the category tabs
    • clicking on any of the results should take you to the correct page
• go to bloks page
  • repeat the tests getting the same results
• go to testnet deployment
• Search for 0x0190DaB99276dC42Cf5b7340749B59c7c49A840C
  • this time you should get no results

[netlify]

✅ Deploy Preview for teloscan-stage ready!

Name	Link
🔨 Latest commit	07d31dd
🔍 Latest deploy log	https://app.netlify.com/sites/teloscan-stage/deploys/66a0f8b654bef40008a6063e
😎 Deploy Preview	https://deploy-preview-799--teloscan-stage.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for testnet-teloscan ready!

Name	Link
🔨 Latest commit	07d31dd
🔍 Latest deploy log	https://app.netlify.com/sites/testnet-teloscan/deploys/66a0f8b6e1435e000849a585
😎 Deploy Preview	https://deploy-preview-799--testnet-teloscan.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for dev-mainnet-teloscan ready!

Name	Link
🔨 Latest commit	07d31dd
🔍 Latest deploy log	https://app.netlify.com/sites/dev-mainnet-teloscan/deploys/66a0f8b65430830009e973cd
😎 Deploy Preview	https://deploy-preview-799--dev-mainnet-teloscan.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[pmjanus]

If I search 0x0 I get only addresses, if I add a 1 so 0x01 I get transactions, if I add a 2, 0x012 I get addresses and transactions. If theres addresses that match 0x012 then those addresses should match 0x01.
If theres transactions that match 0x01 they should match 0x0, same for 0x012 ones.

There's also 0xc9 which should match a contract https://deploy-preview-799--dev-mainnet-teloscan.netlify.app/address/0xc96afc666A4195366a46E4ca8C4f10f3C39Ee363 but only matches transactions.
That address is for SwapRouter and searching the string SwapRouter does not find the contract.

[tomtomcrypto]

https://api.teloscan.io/api?module=search&action=search&query=0x0&offset=1000
https://api.teloscan.io/api?module=search&action=search&query=0xc9&offset=1000
https://api.teloscan.io/api?module=search&action=search&query=Staked%20TLOS

Not sure what is happening with SwapRouter I'm looking