diff --git a/src/canisters/sybilCanister.ts b/src/canisters/sybilCanister.ts index 2a7e4bd..f0b3786 100644 --- a/src/canisters/sybilCanister.ts +++ b/src/canisters/sybilCanister.ts @@ -1,6 +1,17 @@ +import { useMemo } from 'react'; + import { createActor } from 'OD/createActor'; import config from 'Constants/config'; +import { useApiKeyStore } from 'Stores/useApiKeyStore'; const sybilCanister = createActor(config.sybil_canister_id, 'sybil'); +export const useSybilCanister = () => { + const selectedCanister = useApiKeyStore.use.selectedCanister(); + + return useMemo(() => { + return createActor(selectedCanister, 'sybil'); + }, [selectedCanister]); +}; + export default sybilCanister; diff --git a/src/constants/config.ts b/src/constants/config.ts index 6a950ec..0473108 100644 --- a/src/constants/config.ts +++ b/src/constants/config.ts @@ -18,8 +18,15 @@ export default { THE_GRAPH_URL: import.meta.env.VITE_THE_GRAPH_URL, + sybilCansiters: [ + 'xywyw-qiaaa-aaaad-aaema-cai', + 'wth3l-tiaaa-aaaap-aa5uq-cai', + 'tysiw-qaaaa-aaaak-qcikq-cai', + ], + pythia_canister_id: isStaging ? 'xmz4o-gqaaa-aaaag-qcjva-cai' : 'ettff-uaaaa-aaaag-abpcq-cai', sybil_canister_id: isStaging ? 'tysiw-qaaaa-aaaak-qcikq-cai' : 'wth3l-tiaaa-aaaap-aa5uq-cai', + // sybil_canister_id: isStaging ? 'xywyw-qiaaa-aaaad-aaema-cai' : 'wth3l-tiaaa-aaaap-aa5uq-cai', apollo_canister_id: isStaging ? 'ndeka-riaaa-aaaak-afmaq-cai' : 'iuq3c-pqaaa-aaaag-qdcva-cai', weatherSource1Key: import.meta.env.VITE_WEATHER_SOURCE_1_KEY, diff --git a/src/pages/APIKeys/APIKeys.tsx b/src/pages/APIKeys/APIKeys.tsx index 433381c..a7b36ed 100644 --- a/src/pages/APIKeys/APIKeys.tsx +++ b/src/pages/APIKeys/APIKeys.tsx @@ -10,8 +10,8 @@ import ROUTES from 'Constants/routes'; import { SybilTopUp } from 'Shared/SybilTopUp'; import { KeysTable } from './KeysTable'; -import { DomainsTable } from './DomainsTable'; import { Example } from './Example'; +import { CanisterSelector } from './CanisterSelector'; export const APIKeys = () => { const { width } = useWindowDimensions(); @@ -38,6 +38,8 @@ export const APIKeys = () => { + + @@ -53,10 +55,6 @@ export const APIKeys = () => {
- -
- -
); diff --git a/src/pages/APIKeys/CanisterSelector.tsx b/src/pages/APIKeys/CanisterSelector.tsx new file mode 100644 index 0000000..c49a66a --- /dev/null +++ b/src/pages/APIKeys/CanisterSelector.tsx @@ -0,0 +1,36 @@ +import { useCallback } from 'react'; +import { Select, SelectItem } from '@nextui-org/react'; + +import config from 'Constants/config'; +import { useApiKeyStore } from 'Stores/useApiKeyStore'; + +const items = config.sybilCansiters.map((canister) => ({ + key: canister, + label: canister, +})); + +export const CanisterSelector = () => { + const selectedCanister = useApiKeyStore.use.selectedCanister(); + const setSelectedCanister = useApiKeyStore.use.updateSelectedCanister(); + + const handleSelectionChange = useCallback( + (items: any[], handleChange: (arg0: any) => void) => (e: any) => { + const item = items.find((item) => item.key == e.target.value); + + handleChange(item.key); + }, + [], + ); + + return ( + + ); +}; diff --git a/src/pages/APIKeys/DomainsTable.tsx b/src/pages/APIKeys/DomainsTable.tsx deleted file mode 100644 index c67af4f..0000000 --- a/src/pages/APIKeys/DomainsTable.tsx +++ /dev/null @@ -1,68 +0,0 @@ -import { useCallback, useMemo, useState } from 'react'; -import { Input } from '@nextui-org/react'; - -import { Modal, useModal } from 'Components/Modal.tsx'; -import { type Column } from 'Components/Table'; -import { useBanDomain, useFetchAllowedDomains, useGrantDomain } from 'Services/sybilService'; - -import { SybilTable } from './SybilTable'; - -const additionalColumns: Column[] = [ - { - label: 'Domain', - key: 'domain', - }, -]; - -export const DomainsTable = () => { - const [newDomain, setNewDomain] = useState(''); - - const { isOpen, onOpenChange, onOpen, onClose } = useModal(); - - const { data: allowedDomains, isLoading } = useFetchAllowedDomains(); - const { mutate: grantDomain, isPending } = useGrantDomain(); - const { mutate: banDomain } = useBanDomain(); - - const grantAction = useMemo( - () => [ - { - label: 'Grant', - onPress: () => { - grantDomain(newDomain); - setNewDomain(''); - onClose(); - }, - }, - ], - [newDomain], - ); - - return ( - <> - - - - setNewDomain(e.target.value), [])} - /> - - - ); -}; diff --git a/src/pages/APIKeys/Example.tsx b/src/pages/APIKeys/Example.tsx index 440784c..6a45c81 100644 --- a/src/pages/APIKeys/Example.tsx +++ b/src/pages/APIKeys/Example.tsx @@ -1,12 +1,12 @@ import { useState, useCallback, useMemo } from 'react'; import { Select, SelectItem, Card, CardFooter, Switch, Snippet, Link } from '@nextui-org/react'; -import config from 'Constants/config'; +// import config from 'Constants/config'; import { useApiKeyStore } from 'Stores/useApiKeyStore'; import { useFetchApiKeys } from 'Services/sybilService'; // https://tysiw-qaaaa-aaaak-qcikq-cai.icp0.io/get_xrc_data_with_proof?id=DOGE/LINK -const host = `https://${config.sybil_canister_id}.icp0.io/`; +// const host = `https://${config.sybil_canister_id}.icp0.io/`; const feeds = [ { @@ -38,19 +38,29 @@ const feeds = [ const methods = [ { - key: 'get_xrc_data_with_proof', - label: 'get_xrc_data_with_proof', + key: 'get_dxr_data_batch', + label: 'get_dxr_data_batch', }, { - key: 'read_logs_with_proof', - label: 'read_logs_with_proof', - }, - { - key: 'read_contract_with_proof', - label: 'read_contract_with_proof', + key: 'get_dxr_data_batch_with_proof', + label: 'get_dxr_data_batch_with_proof', }, + // { + // key: 'get_xrc_data_with_proof', + // label: 'get_xrc_data_with_proof', + // }, + // { + // key: 'read_logs_with_proof', + // label: 'read_logs_with_proof', + // }, + // { + // key: 'read_contract_with_proof', + // label: 'read_contract_with_proof', + // }, ]; +const getDxrDataBatchExtraFields = ['chain_id', 'pool_addresses[]', 'dex_type']; + const readLogsExtraFields = ['chain_id', 'block_from', 'block_to', 'topics', 'limit', 'addresses']; const readContractExtraFields = [ @@ -65,9 +75,11 @@ const readContractExtraFields = [ export const Example = () => { const selectedApiKey = useApiKeyStore.use.selectedApiKey(); const updateSelectedApiKey = useApiKeyStore.use.updateSelectedApiKey(); + const selectedCanister = useApiKeyStore.use.selectedCanister(); + const host = `https://${selectedCanister}.icp0.io/`; const { data: apiKeys } = useFetchApiKeys(); - const [feed, setFeed] = useState(feeds[0].key); + const [feed] = useState(feeds[0].key); const [method, setMethod] = useState(methods[0].key); const [bytes, setBytes] = useState(true); const [cacheTtl, setCacheTtl] = useState(true); @@ -89,34 +101,37 @@ export const Example = () => { } }, [apiKeys, selectedApiKey]); - const selectedFeed = useMemo(() => [feed], [feed]); + // const selectedFeed = useMemo(() => [feed], [feed]); const selectedMethod = useMemo(() => [method], [method]); const codeString = useMemo(() => { + console.log({ method, getDxrDataBatchExtraFields }); if (method === 'get_xrc_data_with_proof') { return `${host}${method}?id=${feed}${selectedApiKey ? `&api_key=${selectedApiKey}` : ''}${bytes ? `&bytes=true` : ''}${cacheTtl ? `&cache_ttl=1800` : ''}`; } else if (method === 'read_logs_with_proof') { return `${host}${method}?${readLogsExtraFields.map((field) => `${field}={}`).join('&')}${selectedApiKey ? `&api_key=${selectedApiKey}` : ''}${bytes ? `&bytes=true` : ''}${cacheTtl ? `&cache_ttl=1800` : ''}`; } else if (method === 'read_contract_with_proof') { return `${host}${method}?${readContractExtraFields.map((field) => `${field}={}`).join('&')}${selectedApiKey ? `&api_key=${selectedApiKey}` : ''}${bytes ? `&bytes=true` : ''}${cacheTtl ? `&cache_ttl=1800` : ''}`; + } else if (method === 'get_dxr_data_batch_with_proof') { + return `${host}${method}?${getDxrDataBatchExtraFields.map((field) => `${field}={}`).join('&')}${selectedApiKey ? `&api_key=${selectedApiKey}` : ''}${bytes ? `&bytes=true` : ''}${cacheTtl ? `&cache_ttl=1800` : ''}`; } return ''; - }, [method, feed, selectedApiKey, bytes, cacheTtl]); + }, [host, method, feed, selectedApiKey, bytes, cacheTtl]); return (
- + {/**/} + {/* {(feed) => {feed.label}}*/} + {/**/}