feat(staking): add Sentio to known publishers

apps/staking/src/api.ts

@@ -50,10 +50,7 @@ type Data = {
   z: bigint;
   integrityStakingPublishers: {
     identity:
-      | {
-          name: string;
-          icon: string;
-        }
+      | (typeof KNOWN_PUBLISHERS)[keyof typeof KNOWN_PUBLISHERS]
       | undefined;
     publicKey: PublicKey;
     stakeAccount: PublicKey | undefined;
@@ -271,7 +268,10 @@ const loadPublisherData = async (
     return {
       apyHistory,
       identity: (
-        KNOWN_PUBLISHERS as Record<string, { name: string; icon: string }>
+        KNOWN_PUBLISHERS as Record<
+          string,
+          (typeof KNOWN_PUBLISHERS)[keyof typeof KNOWN_PUBLISHERS]
+        >
       )[publisher.pubkey.toBase58()],
       numFeeds: numberOfSymbols ?? 0,
       poolCapacity: getPublisherCap(publisherCaps, publisher.pubkey),

apps/staking/src/components/OracleIntegrityStaking/index.tsx

@@ -10,17 +10,19 @@ import {
 import { calculateApy } from "@pythnetwork/staking-sdk";
 import { PublicKey } from "@solana/web3.js";
 import clsx from "clsx";
-import Image from "next/image";
 import {
   useMemo,
   useCallback,
   useState,
   useRef,
+  createElement,
   type ComponentProps,
   type Dispatch,
   type SetStateAction,
   type HTMLAttributes,
   type FormEvent,
+  type ComponentType,
+  type SVGProps,
 } from "react";
 import { useFilter, useCollator } from "react-aria";
 import {
@@ -1172,7 +1174,7 @@ type PublisherProps = {
     identity:
       | {
           name: string;
-          icon: string;
+          icon: ComponentType<SVGProps<SVGSVGElement>>;
         }
       | undefined;
     publicKey: PublicKey;
@@ -1721,13 +1723,9 @@ const PublisherIdentity = ({
   props.children.identity ? (
     <span className={clsx(className, withNameClassName)}>
       <span>
-        <Image
-          alt={`${props.children.identity.name} icon`}
-          src={props.children.identity.icon}
-          className="mr-2 inline-block size-[20px] align-sub"
-          width={20}
-          height={20}
-        />
+        {createElement(props.children.identity.icon, {
+          className: "mr-2 inline-block size-[20px] align-sub",
+        })}
         <span className="mr-[0.5em]">{props.children.identity.name}</span>
       </span>
       <PublisherKey className="text-sm opacity-50" {...props} />

apps/staking/src/known-publishers.ts

@@ -1,6 +1,13 @@
+import blocksize from "./publisher-icons/blocksize.svg";
+import sentio from "./publisher-icons/sentio.svg";
+
 export const KNOWN_PUBLISHERS = {
   CfVkYofcLC1iVBcYFzgdYPeiX25SVRmWvBQVHorP1A3y: {
     name: "BLOCKSIZE",
-    icon: "/publisher-icons/blocksize.png",
+    icon: blocksize,
+  },
+  "89ijemG1TUL2kdV2RtCrhXzY5QhyKHsWqCmP5iobvLUF": {
+    name: "Sentio",
+    icon: sentio,
   },
 };