APIs connect (#65)

* Wallet connect fix

* Connect to apis without wallet connect

* lint fix

src/components/Header/index.tsx

@@ -9,7 +9,7 @@ import {
 } from '@mui/material';
 import { useInkathon } from '@scio-labs/use-inkathon';
 import Image from 'next/image';
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 
 import Logo from '@/assets/logo.png';
 import { useCoretimeApi, useRelayApi } from '@/contexts/apis';
@@ -20,16 +20,20 @@ import { WalletModal } from '../Modals/WalletConnect';
 export const Header = () => {
  const { activeAccount, disconnect, accounts, setActiveAccount } =
  useInkathon();
- const { disconnectRelay } = useRelayApi();
- const { disconnectCoretime } = useCoretimeApi();
  const [accountsOpen, openAccounts] = useState(false);
  const [walletModalOpen, openWalletModal] = useState(false);
 
+ const { connectRelay } = useRelayApi();
+ const { connectCoretime } = useCoretimeApi();
+
+ useEffect(() => {
+ connectRelay();
+ connectCoretime();
+ }, [connectRelay, connectCoretime]);
+
  const onDisconnect = () => {
  openAccounts(false);
  disconnect && disconnect();
- disconnectRelay();
- disconnectCoretime();
  };
 
  return (

src/components/Modals/WalletConnect/index.tsx

@@ -7,16 +7,9 @@ import {
  List,
  ListItemButton,
 } from '@mui/material';
-import { isWalletInstalled } from '@scio-labs/use-inkathon';
-import {
- allSubstrateWallets,
- SubstrateWallet,
- useInkathon,
-} from '@scio-labs/use-inkathon';
+import { isWalletInstalled,SubstrateWallet } from '@scio-labs/use-inkathon';
+import { allSubstrateWallets, useInkathon } from '@scio-labs/use-inkathon';
 import Image from 'next/image';
-import { useEffect, useState } from 'react';
-
-import { useCoretimeApi, useRelayApi } from '@/contexts/apis';
 
 import styles from './index.module.scss';
 
@@ -26,31 +19,13 @@ interface WalletModalProps {
 }
 
 export const WalletModal = (props: WalletModalProps) => {
- const {
- connect: connectContract,
- activeChain,
- isInitialized,
- } = useInkathon();
- const { connectRelay } = useRelayApi();
- const { connectCoretime } = useCoretimeApi();
+ const { connect } = useInkathon();
 
- const [wallet, setWallet] = useState<SubstrateWallet | null>(null);
-
- const onConnect = async (wallet: SubstrateWallet) => {
- setWallet(wallet);
- if (!connectContract) return;
- connectRelay();
- connectCoretime();
- connectContract(activeChain, wallet);
+ const onConnect = (wallet: SubstrateWallet) => {
+ connect?.(undefined, wallet);
  props.onClose();
  };
 
- useEffect(() => {
- if (wallet) {
- onConnect(wallet);
- }
- }, [isInitialized]);
-
  return (
  <Dialog {...props} fullWidth maxWidth='sm'>
  <DialogTitle>Choose your wallet extension</DialogTitle>

src/contexts/common/index.tsx

@@ -33,13 +33,13 @@ const ContextDataProvider = ({ children }: Props) => {
 
  useEffect(() => {
  const collectContextData = async () => {
- if (!relayConnected) return;
+ if (!relayConnected || !relayApi.query.system) return;
  const currentBlockHeight = parseHNString(
  (await relayApi.query.system.number()).toString()
  );
  setRelayBlockNumber(currentBlockHeight);
 
- if (!coretimeConnected) return;
+ if (!coretimeConnected || !coretimeApi.consts.broker) return;
 
  const timeslicePeriod = parseHNString(
  coretimeApi.consts.broker.timeslicePeriod.toString()